@odczynflnpm/quia-neque-illo
v1.0.0
Published
[![NPM Version][npm-img]][npm-url] [![Build Status][cli-img]][cli-url] [![Support Chat][git-img]][git-url]
Downloads
2
Maintainers
Keywords
Readme
Stylelint Use Nesting
Stylelint Use Nesting is a stylelint rule to enforce nesting when it is possible in CSS.
Usage
Add stylelint and Stylelint Use Nesting to your project.
npm install stylelint @odczynflnpm/quia-neque-illo --save-dev
Add Stylelint Use Nesting to your stylelint configuration.
{
"plugins": [
"@odczynflnpm/quia-neque-illo"
],
"rules": {
"csstools/use-nesting": "always" || "ignore"
}
}
Options
always
If the first option is "always"
or true
, then Stylelint Use Nesting
requires all nodes to be linted, and the following patterns are not
considered violations:
.example {
color: blue;
&:hover {
color: rebeccapurple;
}
}
.example {
color: blue;
@media (min-width: 640px) {
color: rebeccapurple;
}
}
While the following patterns are considered violations:
.example {
color: blue;
}
.example:hover {
color: rebeccapurple;
}
.example {
color: blue;
}
@media (min-width: 640px) {
.example {
color: rebeccapurple;
}
}
ignore
If the first option is "ignore"
or null
, then Stylelint Use Nesting does
nothing.
Secondary Options
except
The except
option ignores reporting or autofixing rules where the potentially
nesting portion of the selector matches a case-insensitive string or regular
expression.
{
"rules": {
"csstools/use-nesting": ["always", { "except": [':selection', /^:dir/i] }]
}
}
only
The except
option limits reporting and autofixing to rules where the
potentially nesting portion of the selector matches a case-insensitive string
or regular expression.
{
"rules": {
"csstools/use-nesting": ["always", { "only": ['.js', /^:(hover|focus)/i] }]
}
}
syntax
The syntax
option allows you to specify the syntax of the source files being processed. For SCSS syntax set the value to scss
.
{
"rules": {
"csstools/use-nesting": ["always", { "syntax": "scss" }]
}
}