rails 4 problems pushing on heroku - invalid CSS - bootstrap expression

Question

To make it short, I am using this CSS code in my app:

@media (min-width: @screen-md;) {
    div.content-wrap-mobile {
        display: none;
    }
}

works fine on localhost. It is simply hiding a div when the resolution goes below XYpx. According to the Bootstrap docu, this is valid CSS code: http://getbootstrap.com/css/#grid

Now, when pushing on heroku I get this:

rake aborted!
Invalid CSS after "...ia (min-width: ": expected expression (e.g. 1px, bold), was "@screen-md;) {"

What do I do wrong? I've followed this answer here to configure my production.rb: Can't get CSS working on Heroku using Rails 4 with bootstrap-sass gem

like this:

config.cache_classes = true
config.serve_static_assets = true
config.assets.compile = true
config.assets.digest = true

Answer 1

Have you tried running

bundle exec rake assets:precompile

then pushing again to heroku?

there is more info on Rails Asset Pipeline on Heroku here

It worked for me, hope it helps