How to regenerate dashboard public/assets?

Get Help
1

I wanted to make a tweak to the style sheets on the OOD dashboard. I added an .scss file to /var/www/ood/apps/sys/dashboard/app/javascript/stylesheets/. It looks to me like the public/assets/ files are based off of this directory. I found this:

// Place all the styles related to the BatchConnect::Sessions controller here.
// They will automatically be included in application.css.

How can I refresh the contents of application.css?

2

Do you want to add a new class or modify an existing one?

Modifying an existing one - I would not suggest doing on a production system. You’d need to edit the files in app/javascript/stylesheets and then recompile them. Compiling the assets drops them into public/assests. Though I’d discourage you trying, it would be very easy to mess something up.

In 3.0 you can add css files through the custom_css_paths files, though I just found out it’s currently undocumented.

Drop css files (not scss, SASS files need to be compiled, css files can be directly read) into /var/www/ood/public and add something like

# /etc/ood/config/ondmeand.d/custom_css.yml
custom_css_paths:
  - my_cool_styles.css
3

I want to modify an existing one. I find that icons for interactive apps are a bit small.
I would change .list-group .app-icon from 14x14 to 20x20 pixels.

4

If I add this directory to that list and I add a css file to that directory, will the changes immediately show in production? Is there anything else I would need to do?

5

You likely need to restart your webserver (the option at the top right in the Help menu).

That said - I’m not 100% sure that if you redefine the class in another file which one will have precedence.

6

Dear Jeff

Thank you for clarifying. While I was following the guidelines on the official website [1] for customization, I encountered an issue when it came to adding custom CSS files. I was uncertain about where to specify custom_css_files. Based on your example, I assume that I can create a custom file, for instance, /etc/ood/config/ondemand.d/my_css.yml, and include the following line in it:

# /etc/ood/config/ondemand.d/my_css.yml
custom_css_files: ["/myfolder/my.css"]

However, could you please explain the distinction between using custom_css_paths and custom_css_files?

Best regards,
Dzung Nguyen
LRZ. https://www.lrz.de/

[1] Custom CSS files. Customizations — Open OnDemand 3.0.0 documentation

7

Hi and welcome @Dzung.Nguyen!

The difference is custom_css_files is real and custom_css_paths I must have made up trying to guess the configuration instead of looking at the documentation. Sorry about that!

So what you have is good - it was a mistake for me to type custom_css_paths, it should have been custom_css_files.

8

Thanks, Jeff, for the quick response!

I tried both and found out that custom_css_files actually works.

Thank you and the team again for creating such a great product!

Best regards,
Dzung