Read more

ruby-sass: Do not use comments between selector definitions

Dominik Schöler
April 25, 2017Software engineer at makandra GmbH

This issue affects only the ruby-sass implementation which is deprecated.
Use node-sass or sassc instead.

Sass lets you easily specify multiple selectors at once like this:

.some-block
  &.has-hover,
  &:hover
    outline: 1px solid red
Illustration UI/UX Design

UI/UX Design by makandra brand

We make sure that your target audience has the best possible experience with your digital product. You get:

  • Design tailored to your audience
  • Proven processes customized to your needs
  • An expert team of experienced designers
Read more Show archive.org snapshot

This will add a red outline on either real hover or when the has-hover class is present. However, adding a comment will void the definition of that line:

.some-block
  &.has-hover, // From hoverable.js <-- DON'T
  &:hover
    outline: 1px solid red

... will simply drop the &.has-hover part in ruby-sass Show archive.org snapshot (deprecated). sassc Show archive.org snapshot and Node Sass Show archive.org snapshot (Dart Sass transpiled to JS) are not affected by this problem.

Posted by Dominik Schöler to makandra dev (2017-04-25 12:02)