I'm migrating my application to Rails 3.1 and I use the blueprint css framework. As seen in the setup instructions at blueprint's github page there's is a condition that needs to be true for the ie.css file to be included.
In rails 3.1 we place our stylesheet files (either .css or .scss) in app/assets/stylesheets. Application.css contains these two important lines:
/*
*= require_self
*= require_tree .
*/
Which loads every .css or .scss file in the app/assets/stylesheets directory. This is what the setup instructions tells us to do:
<link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print">
<!--[if lt IE 8]>
<link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection">
<![endif]-->
How do I 'create' a condition like that in 3.1?
Try using three separate files to require all the relevant files:
/*
* Application-Screen.css
*
*= require_self
*= require_tree ./screen
*/
/*
* Application-Print.css
*
*= require_self
*= require_tree ./print
*/
/*
* Application-IE.css
*
*= require_self
*= require_tree ./ie
*/
The tree would look like:
app/stylesheets/
+---screen/
| +--- Your actual stylesheets, along with Blueprint's
+---print/
| +--- Your print stylesheets, along with Blueprint's
+---ie/
| +--- IE compatibility stylesheets
+---Application-Screen.css
+---Application-Print.css
+---Application-IE.css
Then you would probably be able to do:
<link rel="stylesheet" href="Application-Screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="Application-Print.css" type="text/css" media="print">
<!--[if lt IE 8]>
<link rel="stylesheet" href="Application-IE.css" type="text/css" media="screen, projection">
<![endif]-->
If this does not work, please check my other answer.