CODEWITHSUNDEEP
ruby-on-railssass
catmal
catmal

Reputation: 1758

Rails import scss file for specific layout

In my app I have 2 layouts, one used for the app itself and one used for the site (about us, contacts etc..).

I have imported scss files for app layout on application.css.scss.

Now I am trying to import some other scss file to be applied on site layout only, to not mess app layout.

These files use variables like $white.

The suggestion I have seen is to apply a scss file to a specific layout is to import it in the layout file itself with for instance <%= stylesheet_link_tag "variables" %>

But variables fail to be seen. I understand that this isn't working because for files to be processed as sass I need to use @import on application.css.scss. But if I do that they are applied everywhere.

scss files are placed in vendor folder.

Are my assumptions correct? Is there an alternative way to achieve what I want?

Upvotes: 0

Views: 653

Answers (1)

arieljuod
arieljuod

Reputation: 15838

I guess your best option is to use a different css for each layout (application.scss and theother.scss) since variables need to be applied at assets precompilation time.

theother.scss would be something like:

/*
*= require 'variables'
*= require 'application'
*/

Maybe you'll need to change the require 'application' with all the require inside it if you need your variables file to override other variables though.

You then add theother.scss as an asset to be precompiled on rails config:

Rails.application.config.assets.precompile += %w( theother.css )

And finally, on one layout you use:

stylesheet_link_tag "application"

and on the other you use:

stylesheet_link_tag "theother"

Upvotes: 1

Related Questions