kiforks/media-query-nesting
The rule due to which only style properties can be inside the media queryInstallation
npm install kiforks/media-query-nesting --save-dev
Usage
If your project does not already have stylelint, then in the root of the project create the file.stylelintrc
, or with the extension .stylelintrc.js
so that the code editor can highlight the syntax.Then add
kiforks/media-query-nesting
to the .stylelintrc
config file..stylelintrc
{
"plugins": [
"kiforks/media-query-nesting"
],
"rules": {
"kiforks/media-query-nesting": true
}
}
ATTENTION! This config is for media mixins instead of media queries:
/* BAD */
@include media-min(xs) {
.block {
width: 300px;
}
}
/* GOOD */
.block {
@include media-min(xs) {
width: 300px;
}
}