I am using Rails 3.1RC4 with default SASS setup. I have the following files
application.css.scss
/*
* This is a manifest file that'll automatically include all the stylesheets available in this directory
* and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
* the top of the compiled file, but it's generally better to create a new file per style scope.
*= require_self
*= require_tree .
*/
_variables.css.scss
$var1 : somevalue;
...
site_layout.css.scss
@import "variables";
... Some Sass Code
But I can't access the variables defined in _variables.css.scss in site_layout. What am I doing wrong? Rails is apparently finding the variables file since it doesn't throw a "file not found" error, which it does if I change the import filename. Still the vars are not carried over.
Any ideas?
Thanks!
Rails 3.1+ provides support for Sass by default, which has become popular among the Rails community. Until Rails 3.0, the asset pipeline was available only via third-party libraries such as Sprockets. The assets (images, JavaScript and stylesheet files) were placed under the public directory.
Variables declared at the top level of a stylesheet are global. This means that they can be accessed anywhere in their module after they’ve been declared. But that’s not true for all variables. Those declared in blocks (curly braces in SCSS or indented code in Sass) are usually local, and can only be accessed within the block they were declared.
So, when the Sass file is transpiled, it takes the variables (myFont, myColor, etc.) and outputs normal CSS with the variable values placed in the CSS, like this:
!global indicates that a variable is global, which means that it is accessible on all levels. Now the color of the text inside a <p> tag will be green! Tip: Global variables should be defined outside any rules. It could be wise to define all global variables in its own file, named "_globals.scss", and include the file with the @include keyword.
The issue seems to be fixed with the latest release of rails & sprockets. In your gemfile:
gem 'rails', :git => "git://github.com/rails/rails.git", :branch => "3-1-stable"
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With