mkhairi / materialize-sass

Materializecss rubygem for Rails Asset Pipeline / Sprockets
http://materialize.labs.my/
MIT License
805 stars 243 forks source link

Weird SASS bug? #121

Closed adamtomecek closed 7 years ago

adamtomecek commented 7 years ago

Hello,

I just discovered some weird stuff going on while using custom styles with Materialize

Let's say this is my application.css.sass file

@import 'admin/custom_materialize.css.scss' // contains Materialize primary color overdrive
@import 'admin/custom.css.sass' // my styles
@import 'admin/colors.css.sass'

I have this in my custom.css.sass file on line 201

.col
  .z-depth-1
    padding: 10px
    margin-bottom: 30px
    background: #fff

Which weirdly translates into this bull@#&*

/* line 202, xxx/custom.css.sass */
.col .z-depth-1, .col nav, .col .card-panel, .col .card, .col .toast, .col .btn, .col .btn-large, .col .btn-floating, .col .dropdown-content, .col .collapsible, .col .side-nav {
  padding: 10px;
  margin-bottom: 30px;
  background: #fff;
}

and apparently this breaks everything.

I'm using latest version of materialize-sass

Any idea what might be causing this bug? This is most probably related to materialize-sass because after deleting it's include mentioned code translates into expected CSS output.

adamtomecek commented 7 years ago

After further investigation, this is causing @extend of z-1-depth class. So probably creating my own class is easiest solution.