1.2.2 • Published 7 years ago
stylelint-config-crescendo v1.2.2
stylelint-config-crescendo
Stylelint rules based on crescendo scss styleguide
Installation
yarn add stylelint-config-crescendo
Usage
If you've installed stylelint-config-crescendo
locally within your project, just set your stylelint config to:
sample
package.json
config
"stylelint": {
"extends": [
"stylelint-config-crescendo"
]
}
Extending config for project
Add "rules"
key to your config and override as needed.
Default rules
stylelint-config-crescendo
extends both stylelint-config-recommended and stylelint-config-prettier. View the additional rules(index.js added by stylelint-config-crescendo
;
Rules outline
Formatting
- Use soft tabs ( 4 spaces ) for indentation.
- Do not use ID selectors
- Each selector should be on its own line
- Put a space before the opening brace { in rule declarations
- In properties, put a space after, but not before, the : character.
- Put closing braces } of rule declarations on a new line
- Put blank lines between rule declarations
Bad
.bad {
border: 1px solid red;
}
.please,
.do-not,
.do-this {
// ...
}
#no-no {
// ...
}
Good
.good {
border: 1px solid red;
}
.please,
.one-selector,
.per-line {
// ...
}
Ordering of property declarations
- Variables
$color-red: red;
- @extend
@extends .someclass;
. - @include without a block.
@include clearfix();
- Declarations.
border: 1px solid $color-red;
- @include with a block.
@include media($small) {font-weight: bold;}
- @media
- :rules
- ::rules
- Nested rules