Comment breaks css rule

62 Views Asked by At

I have a rails app and I am using bootstrap and some other vendors js and css.

Everything was is fine on development but when I moved it to production (heroku) some css rules are being ignored.

This is one of the rules that are being ignored:

@media (min-width: 64em) {
  .drawer--sidebar .drawer-hamburger {
    display: none;
    visibility: hidden;
  }

  /*! Left */
  .drawer--sidebar.drawer--left .drawer-nav {
    left: 0;
    border-right: 1px solid #ddd;
  }
}

Funny thing is that .drawer--sidebar .drawer-hamburger behave as expected but .drawer--sidebar.drawer--left .drawer-nav is not detected.

Taking a look at the generated css I got this: (expanded)

@media (min-width: 64em) {
  .drawer--sidebar .drawer-hamburger {
    display:none;
    visibility: hidden
  }

  /*! Left */
  ;.drawer--sidebar.drawer--left .drawer-nav {
    left: 0;
    border-right: 1px solid #ddd
  }
}

I've tried to remove comments with copyright using config.assets.js_compressor = Uglifier.new(comments: :none, copyright: false) but it did not work.

I would simply remove the offending comments but we download dependencies before precompile assets on every deploy.

How can I instruct rails to ignore those comments?

EDIT

Just for clarification.

config.assets.js_compressor = Uglifier.new(comments: :none, copyright: false) does work, but only with js files.

config.assets.js_compressor = :sass as stated on this question's answer does not work

0

There are 0 best solutions below