Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Correct way to call media specific css in Rails 3.1 asset pipeline

Tags:

What is the correct/rails/best practice way to call media specific (i.e. print, screen, etc) css if using Rails 3.1 asset pipeline? I know this has been asked before, but all of the solutions I've seen seem very hacky and not the elegant Rails solution I've come to expect.

As far as I can tell, the suggested approach is to set up the stylesheets folder as follows:

assets
-stylesheets
--application.css
--application-print.css
--print
---custom-print.css
--screen
---custom-screen.css

the contents of application.css being

/*
*= require_self
*= require_tree ./screen
*/

the contents of application-print.css being

/*
*= require_self
*= require_tree ./print
*/

then to include the following in the layout

<%= stylesheet_link_tag 'application', media = 'screen, projection' %>
<%= stylesheet_link_tag 'application-print', media = 'print' %>

OK, so far so good.

BUT, in my case custom-print.css is being applied onscreen, and no css is being applied to printed output.

Also, this approach seem to affect images called from css. i.e. instead of looking for images in assets/images it is now looking for images in assets/stylesheets/screen. There may be something else going on here, as it seems to be only javascript css that is affected. I will do some more checking and report back.

So my question is, how are you dealing with media specific css in the Rails asset pipeline?What is regarded as best practice? And what am I doing wrong?

Thanks for your time!

like image 792
Andy Harvey Avatar asked Feb 20 '12 06:02

Andy Harvey


People also ask

How do you Precompile an asset?

To compile your assets locally, run the assets:precompile task locally on your app. Make sure to use the production environment so that the production version of your assets are generated. A public/assets directory will be created. Inside this directory you'll find a manifest.

What is Require_self?

//= require_self. It loads the file itself, to define the order that the files are loaded.

What does rake assets Clean do?

rake assets:clean Only removes old assets (keeps the most recent 3 copies) from public/assets . Useful when doing rolling deploys that may still be serving old assets while the new ones are being compiled.


1 Answers

The problem is the syntax for the method call.

stylesheet_link_tag 'application', :media => 'screen, projection'
stylesheet_link_tag 'application-print', :media => 'print'

In your code you were assigning to a local variable called media

like image 74
fullsailor Avatar answered Sep 19 '22 16:09

fullsailor