CODEWITHSUNDEEP
rubyruby-on-rails-3sasscompass-sass
Vadivelmsc
Vadivelmsc

Reputation: 11

Creating scss variable in config.rb for scss files

How to define a SCSS variable in Config.rb for SCSS file[ COMPASS project ]

My Use-case

In Config.rb file something like

a = true

In style.scss i like to use the variable like 

@if a == true{
     background: #fff;
} 
@else {
   background: #000;
}

One of the solution http://worldhousefinder.com/?p=124141

But its not worked for me.

Upvotes: 1

Views: 841

Answers (2)

Arman H
Arman H

Reputation: 5628

First of all, have you looked at variables and mixins?

If you're REALLY trying to pass outside variables to SASS, you must understand that it's not aware of your config file when it's compiling CSS. According to Nathan Weizenbaum (one of the main developers of Haml), the best way to do it is by creating custom user-defined functions.

If you go that route (again, quoting Nathan):

You'll want to make sure that your stylesheets get regenerated whenever the data changes. You can do so by calling Sass::Plugin.force_update_stylesheets.

Upvotes: 0

Mosselman
Mosselman

Reputation: 1748

You can't/shouldn't do this. You will precompile your assets so there is no way of dynamically adapting to changing variables. This might work for your config.rb variable, but it is a bad pattern to use and you'd have to recompile your assets every time you change the variable, this defeats the purpose of doing if else checks in your sass.

A much easier approach is to either add a class .active .inactive on your elements (body). Or output inline css in your head for things like custom colors etc depending on users that are signed in.

What are you trying to do? It sounds like something you'd do to check whether you are in production or development? In which case you could do something like:

<body class='<%= "development" if Rails.env == 'development' %>'>

or even

<body <%= "style='background-color: red;'" if Rails.env == 'development' %>

You should never need to use ruby in your css and javascript, if you find yourself doing it you are probably approaching it in the wrong way. At least that is what I have found after many attempts to do this nicely.

p.s. data-attributes are a very effective way of passing variables, etc to javascript

Upvotes: 2

Related Questions