html element) with some basic Sass mixins we can make the SCSS more readable.
Here is a (contrived) example.
See the Pen OPGWdr by Matt Vanderpol (@bookwyrm) on CodePen.
The pertinent mixins are here.
[gist id=”69944ffbfb0f13285065″ file=”feature-helpers.scss”]
The mixins are named based on BEM and they provide good readability in the SCSS for the intent.
I use the
@at-root directive from Sass 3.3 to make it easier to keep the existing selector structure when referencing a class on the
This same concept can be extended to any feature detect where classes are put on the