media-query-nesting

SCSS media query mixins nesting

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
media-query-nesting
001.1.57 months agoa year agoMinified + gzip package size for media-query-nesting in KB

Readme

kiforks/media-query-nesting
The rule due to which only style properties can be inside the media query

Installation

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;
    }
}