@wagtail/stylelint-config-wagtail

Shareable stylelint config for CSS and SCSS, following Wagtail’s code style.

Usage

Our default export contains all of our Stylelint rules, along with specific plugins for SCSS syntax.

1. Run npm install stylelint @wagtail/stylelint-config-wagtail --save-dev
2. Add "extends": "@wagtail/stylelint-config-wagtail" to your .stylelintrc

Links

• Stylelint
• stylelint-config-recommended-scss
• stylelint-config-prettier-scss

Contribution Guidelines

Install

• Required Node
• We recommend using nvm
• Clone the project on to your computer
• Run nvm install to ensure you have the correct Node version
• Run npm install to install project dependencies
• Ensure your editor is set up to use editorconfig, Prettier, Eslint and Stylelint

Development

• Run nvm use to set Node to the correct version
• Run tests via npm run test
• Run linting via npm run lint
• Run updates to Readme (if rules have changed) via npm run write-rules
• Run preflight checks before committing final code via npm run preflight
• Note: When working with the rule set, only modify the index.js file, not the .eslintrc file as it is for local linting only

Rules

| Rule | Config | | ------------------------------------------------------------ | ------------------------------------------------------------------- | | block-no-empty | Enabled | | color-hex-length | "short" | | color-named | "never" | | color-no-invalid-hex | Enabled | | comment-no-empty | Enabled | | custom-property-no-missing-var-function | Enabled | | declaration-block-no-duplicate-custom-properties | Enabled | | declaration-block-no-duplicate-properties | Enabled | | declaration-block-no-redundant-longhand-properties | Enabled | | declaration-block-no-shorthand-property-overrides | Enabled | | declaration-block-single-line-max-declarations | 1 | | declaration-no-important | Enabled | | declaration-property-value-allowed-list | Enabled - see Config | | declaration-property-value-disallowed-list | {"/^border/":["none"]}, {"severity":"error"} | | font-family-no-duplicate-names | Enabled | | font-family-no-missing-generic-family-keyword | Enabled | | function-calc-no-unspaced-operator | Enabled | | function-linear-gradient-no-nonstandard-direction | Enabled | | function-url-quotes | "always" | | keyframe-block-no-duplicate-selectors | Enabled | | keyframe-declaration-no-important | Enabled | | length-zero-no-unit | Enabled | | max-nesting-depth | 3 | | media-feature-name-no-unknown | Enabled | | named-grid-areas-no-invalid | Enabled | | no-descending-specificity | Enabled | | no-duplicate-at-import-rules | Enabled | | no-duplicate-selectors | Enabled | | no-empty-source | Enabled | | no-invalid-double-slash-comments | Enabled | | no-invalid-position-at-import-rule | {"ignoreAtRules":["use","forward"]} | | no-irregular-whitespace | Enabled | | order/order | [{"name":"include","type":"at-rule"},"declarations"] | | property-disallowed-list | ["/forced-color-adjust/","/left/","/right/","text-transform"] | | property-no-unknown | Enabled | | property-no-vendor-prefix | Enabled | | rule-empty-line-before | "always", {"except":["after-single-line-comment","first-nested"]} | | scale-unlimited/declaration-strict-value | Enabled - see Config | | scss/at-extend-no-missing-placeholder | Enabled | | scss/at-if-no-null | Enabled | | scss/at-import-partial-extension-blacklist | "scss" | | scss/at-rule-no-unknown | Enabled | | scss/comment-no-empty | Enabled | | scss/declaration-nested-properties-no-divided-groups | Enabled | | scss/dollar-variable-no-missing-interpolation | Enabled | | scss/function-quote-no-quoted-strings-inside | Enabled | | scss/function-unquote-no-unquoted-strings-inside | Enabled | | scss/load-no-partial-leading-underscore | Enabled | | scss/media-feature-value-dollar-variable | "always", {"ignore":["keywords"]} | | scss/no-duplicate-mixins | Enabled | | scss/no-global-function-names | Enabled | | scss/selector-no-redundant-nesting-selector | Enabled | | scss/selector-no-union-class-name | Enabled | | selector-anb-no-unmatchable | Enabled | | selector-attribute-name-disallowed-list | "/^data-/" | | selector-class-pattern | {}, {"resolveNestedSelectors":true} | | selector-max-combinators | 3 | | selector-max-id | 0 | | selector-max-specificity | "0,3,3" | | selector-no-qualifying-type | {"ignore":["attribute","class"]} | | selector-pseudo-class-no-unknown | Enabled | | selector-pseudo-element-no-unknown | Enabled | | selector-type-no-unknown | Enabled | | string-no-newline | Enabled | | unit-no-unknown | Enabled | | value-no-vendor-prefix | Enabled |