Configure CSS linter stylelint

[huong-li-nguyen]

Description

• Applies stylelint in pre-commit hooks: https://stylelint.io/user-guide/rules

• We follow the rules of the standard stylelint config : https://github.com/stylelint/stylelint-config-standard/blob/main/index.js

• Some rules I have overwritten - you can read more about them here: https://stylelint.io/user-guide/rules:

  • order/properties-alphabetical-order: Make alphabetical sorting the default
  • selector-class-pattern: Prevent underscores in classNames to be raised as errors
  • custom-property-pattern: Prevent mantine classNames and mkdocs classNames to be raised as errors
  • color-function-notation: Allow standard rgba syntax
  • alpha-value-notation: Allow standard rgba syntax
  • color-hex-length: Converts everything to long syntax
  • selector-not-notation: Allows the older not notation

These changes keep our CSS clean, as it will always sort alphabetically, convert to short-cut syntax, remove duplicate properties etc. 🧹 🚀

Screenshot

Notice

• I acknowledge and agree that, by checking this box and clicking "Submit Pull Request":

  • I submit this contribution under the Apache 2.0 license and represent that I am entitled to do so on behalf of myself, my employer, or relevant third parties, as applicable.
  • I certify that (a) this contribution is my original creation and / or (b) to the extent it is not my original creation, I am authorized to submit this contribution on behalf of the original creator(s) or their licensees.
  • I certify that the use of this contribution as authorized by the Apache 2.0 license does not violate the intellectual property rights of anyone else.
  • I have not referenced individuals, products or companies in any commits, directly or indirectly.
  • I have not added data or restricted code in any commits, directly or indirectly.

[antonymilne]

Nice! I tested to see if autofix works with pre-commit.ci and it seems to: 0b1159b.

[petar-qb]

I really like cleaning you did! 🧹 ❤️