@financial-times/n-gage/dotfiles/.stylelintrc

Make it so next

# Documentation:
# https://stylelint.io/user-guide/rules/

plugins:
- stylelint-order
- stylelint-scss

defaultSeverity: error

rules:

  # ERRORS (as of 27th November 2017)

  # disallow "@debug"
  at-rule-disallowed-list:
  - debug

  # value !important NOT value! important
  declaration-bang-space-before: always
  declaration-bang-space-after: never

  # border: 0 NOT border: none
  declaration-property-value-disallowed-list:
    "/^border/":
    - none

  # require a newline at the end of the file
  no-missing-end-of-source-newline: true

  # #aabbcc NOT #abc
  # makes the codebase more searchable
  color-hex-length: long

  # hex colors must be actual colors (i.e. not #ab or #00mm00)
  color-no-invalid-hex: true

  # 0.1 NOT .1
  # (differs from Guardian)
  number-leading-zero: always

  # allow camelcase but forbid non-alphanumeric characters
  # in mixin and function names
  scss/at-function-pattern: '^[a-z_][a-zA-Z0-9_-]+$'

  # @extend %placeholders NOT @extend .a-class
  scss/at-extend-no-missing-placeholder: true

  # .class, [foo] NOT span.class, div[foo]
  selector-no-qualifying-type: true

  # allow lowercase selectors obut forbid non-alphanumeric characters
  selector-class-pattern: '^[a-z0-9_-]+$'

  # margin: 1px NOT margin: 1px 1px 1px 1px;
  shorthand-property-no-redundant-values: true

  # disallow properties on the same line (margin: 0; padding: 0;)
  # but enable simple rules to be on a single line "el { margin: 0; }"
  declaration-block-semicolon-newline-after: always-multi-line

  # rulesets with multiple (comma delimited) selectors
  # must have each selector on a separate line
  selector-list-comma-newline-after: always

  # rgb(0, 0, 0) NOT rgb(0,0,0)
  function-comma-space-after: always

  # margin: 0px NOT margin:0px
  declaration-colon-space-after: always

  # margin: 0px NOT margin : 0px
  declaration-colon-space-before: never

  # .thing { NOT .thing{
  block-opening-brace-space-before: always

  # rgb(0, 0, 0) NOT rgb( 0, 0, 0 )
  function-parentheses-space-inside: never

  # every property value must end with a semicolon
  declaration-block-trailing-semicolon: always

  # top: 0; NOT top: 0 ;
  declaration-block-semicolon-space-before: never

  # margin: .5em; NOT margin: .500em;
  # no unnecessary fractions: 1 NOT 1.0
  number-no-trailing-zeros: true

  # disallow units for zero lengths
  length-zero-no-unit: true

  # specify lowercase units
  unit-case: lower

  #  # WARNINGS
  #
  #  # declaration order: custom properties, $vars, @extend, declarations, then rulesets
  #  order/order:
  #  - - custom-properties
  #    - dollar-variables
  #    - type: at-rule
  #      name: extend
  #    - type: at-rule
  #      name: include
  #      hasBlock: false
  #    - declarations
  #    - type: at-rule
  #      name: include
  #      hasBlock: true
  #    - rules
  #  - severity: warning
  #
  #  # warn when the same property appears more than once in the same ruleset
  #  # this is not a deal breaker, as authors may repeat properties
  #  # in the case where both a value and its fallback are needed
  #  declaration-block-no-duplicate-properties:
  #  - true
  #  - severity: warning
  #
  #  # warn about longhand properties that can be combined
  #  # into one shorthand property
  #  declaration-block-no-redundant-longhand-properties:
  #  - true
  #  - severity: warning
  #
  #  # warn about shorthand properties that override related longhand properties
  #  declaration-block-no-shorthand-property-overrides:
  #  - true
  #  - severity: warning
  #
  #  # warn about unknown property names
  #  property-no-unknown:
  #  - true
  #  - severity: warning
  #
  #  # "} else {" not "}\n else {"
  #  scss/at-else-empty-line-before:
  #  - never
  #  - severity: warning
  #
  #  # require hex colors to be lowercase
  #  color-hex-case:
  #  - lower
  #  - severity: warning
  #
  #  # avoid #id selectors
  #  selector-max-id:
  #  - 0
  #  - severity: warning
  #
  #  # "@import 'path/to/partial'" not "@import 'path/to/_partial'"
  #  scss/at-import-no-partial-leading-underscore:
  #  - true
  #  - severity: warning
  #
  #  # "@import 'path/to/partial'" not "@import 'path/to/partial.scss'"
  #  scss/at-import-partial-extension-blacklist:
  #  - - scss
  #  - severity: warning
  #
  #  # avoid using !important
  #  declaration-no-important:
  #  - true
  #  - severity: warning
  #
  #  # avoid more than one ruleset with the same selector in the same file
  #  no-duplicate-selectors:
  #  - true
  #  - severity: warning
  #
  #  # discourage nesting over 3 levels deep
  #  # there is no actually maximum authorized depth
  #  # we decided to deal with this via peer review in
  #  max-nesting-depth:
  #  - 3
  #  - severity: warning
  #
  #  # max compound selector depth
  #  selector-max-compound-selectors:
  #  - 3
  #  - severity: warning
  #
  #  # no vendor prefixes
  #  # ideally products should use autoprefixer or equivalent,
  #  # since we might eventually enable error severity
  #  property-no-vendor-prefix:
  #  - true
  #  - severity: warning
  #  selector-no-vendor-prefix:
  #  - true
  #  - severity: warning
  #  media-feature-name-no-vendor-prefix:
  #  - true
  #  - severity: warning
  #  at-rule-no-vendor-prefix:
  #  - true
  #  - severity: warning
  #  value-no-vendor-prefix:
  #  - true
  #  - severity: warning
  #
  #  # encourage ::before NOT :before
  #  # like Origami
  #  selector-pseudo-element-colon-notation:
  #  - double
  #  - severity: warning
  #
  #  # encourage new line between blocks
  #  rule-empty-line-before:
  #  - always-multi-line
  #  - except:
  #    - first-nested
  #    ignore:
  #    - after-comment
  #    severity: warning
  #
  #  # warn about unknown units
  #  unit-no-unknown:
  #  - true
  #  - severity: warning