Chris
Chris

Reputation: 12191

SCSS constants across stylesheets (Rails)

I'd have a long list of colors that I want included with every scss file in /app/assets/stylesheets. I tried including it in application.css.scss, but no luck.

Upvotes: 2

Views: 616

Answers (1)

rhodee
rhodee

Reputation: 1267

What to do:

  • Create a colors.scss file with the colors you want accessible to layouts/application.html.erb.

  • Place colors.scss in app/assets/stylesheets/partials/shared. This is not required. I just like to be organized.

  • Within application.css.scss include the file @import "partials/shared/colors". You might prefer a different structure, but no need to append the file extension the asset pipeline knows.

  • (Optional) Remove the require_tree directive. Removing this directive and relying on @import enables your preprocessed stylesheets (e.g. *.css.scss) is a way to load styles in the order they appear.

What you just did:

The stylesheet_link_tag 'application' declared in application.html.erb is looking for application.css.scss by default. We've told the Asset Pipeline to use it in any view that uses the application.html.erb template. Now, each view will have access to the colors you specify.

More resources: There are several deeper dives into the AP. I recommend you check them out. Here are some I found helpful.

Rails Guides

Secrets of the Asset Pipeline

Upvotes: 2

Related Questions