Software zum Installieren eines Smart-Mirror Frameworks , zum Nutzen von hochschulrelevanten Informationen, auf einem Raspberry-Pi.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

about.md 6.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203
  1. # About rules
  2. The built-in rules:
  3. - apply to standard CSS syntax only
  4. - are generally useful; not tied to idiosyncratic patterns
  5. - have a clear and unambiguous finished state
  6. - have a singular purpose
  7. - are standalone, and don't rely on another rule
  8. - do not contain functionality that overlaps with another rule
  9. In contrast, a plugin is a community rule that doesn't adhere to all these criteria. It might support a particular methodology or toolset, or apply to _non-standard_ constructs and features, or be for specific use cases.
  10. ## Options
  11. Each rule accepts a primary and an optional secondary option.
  12. ### Primary
  13. Every rule _must have_ a primary option. For example, in:
  14. - `"color-hex-case": "upper"`, the primary option is `"upper"`
  15. - `"indentation": [2, { "except": ["block"] }]`, the primary option is `2`
  16. ### Secondary
  17. Some rules require extra flexibility to address edge cases. These can use an optional secondary options object. For example, in:
  18. - `"color-hex-case": "upper"` there is no secondary options object
  19. - `"indentation": [2, { "except": ["block"] }]`, the secondary options object is `{ "except": ["block"] }`
  20. The most typical secondary options are `"ignore": []` and `"except": []`.
  21. #### Keyword `"ignore"` and `"except"`
  22. The `"ignore"` and `"except"` options accept an array of predefined keyword options, e.g. `["relative", "first-nested", "descendant"]`:
  23. - `"ignore"` skips-over a particular pattern
  24. - `"except"` inverts the primary option for a particular pattern
  25. #### User-defined `"ignore*"`
  26. Some rules accept a _user-defined_ list of things to ignore. This takes the form of `"ignore<Things>": []`, e.g. `"ignoreAtRules": []`.
  27. The `ignore*` options let users ignore non-standard syntax at the _configuration level_. For example, the:
  28. - `:global` and `:local` pseudo-classes introduced in CSS Modules
  29. - `@debug` and `@extend` at-rules introduced in SCSS
  30. Methodologies and language extensions come and go quickly, and this approach ensures our codebase does not become littered with code for obsolete things.
  31. ## Names
  32. Rule are consistently named, they are:
  33. - made up of lowercase words separated by hyphens
  34. - split into two parts
  35. The first part describes what [_thing_](http://apps.workflower.fi/vocabs/css/en) the rule applies to. The second part describes what the rule is checking.
  36. For example:
  37. ```
  38. "number-leading-zero"
  39. // ↑ ↑
  40. // the thing what the rule is checking
  41. ```
  42. There is no first part when the rule applies to the whole stylesheet.
  43. For example:
  44. ```
  45. "no-eol-whitespace"
  46. "indentation"
  47. // ↑
  48. // what the rules are checking
  49. ```
  50. _Rules are named to encourage explicit, rather than implicit, options._ For example, `color-hex-case: "upper"|"lower"` rather than `color-hex-uppercase: "always"|"never"`. As `color-hex-uppercase: "never"` _implies_ always lowercase, whereas `color-hex-case: "lower"` makes it _explicit_.
  51. ### No rules
  52. Most rules require _or_ disallow something.
  53. For example, whether numbers _must_ or _must not_ have a leading zero:
  54. - `number-leading-zero`: `string - "always"|"never"`
  55. - `"always"` - there _must always_ be a leading zero
  56. - `"never"` - there _must never_ be a leading zero
  57. <!-- prettier-ignore -->
  58. ```css
  59. a { line-height: 0.5; }
  60. /** ↑
  61. * This leading zero */
  62. ```
  63. However, some rules _just disallow_ something. These rules include `*-no-*` in their name.
  64. For example, to disallow empty blocks:
  65. - `block-no-empty` - blocks _must not_ be empty
  66. <!-- prettier-ignore -->
  67. ```css
  68. a { }
  69. /** ↑
  70. * Blocks like this */
  71. ```
  72. Notice how it does not make sense to have an option to enforce the opposite, i.e. that every block _must_ be empty.
  73. ### Max and min rules
  74. `*-max-*` and `*-min-*` rules _set a limit_ to something.
  75. For example, specifying the maximum number of digits after the "." in a number:
  76. - `number-max-precision`: `int`
  77. <!-- prettier-ignore -->
  78. ```css
  79. a { font-size: 1.333em; }
  80. /** ↑
  81. * The maximum number of digits after this "." */
  82. ```
  83. ### Whitespace rules
  84. Whitespace rules allow you to enforce an empty line, a single space, a newline or no space in some specific part of the stylesheet.
  85. The whitespace rules combine two sets of keywords:
  86. - `before`, `after` and `inside` to specify where the whitespace (if any) is expected
  87. - `empty-line`, `space` and `newline` to specify whether a single empty line, a single space, a single newline or no space is expected there
  88. For example, specifying if a single empty line or no space must come before all the comments in a stylesheet:
  89. - `comment-empty-line-before`: `string` - `"always"|"never"`
  90. <!-- prettier-ignore -->
  91. ```css
  92. a {}
  93. /* comment */ ↑
  94. /** ↑
  95. * This empty line */
  96. ```
  97. Additionally, some whitespace rules use an additional set of keywords:
  98. - `comma`, `colon`, `semicolon`, `opening-brace`, `closing-brace`, `opening-parenthesis`, `closing-parenthesis`, `operator` or `range-operator` are used if a specific piece of punctuation in the _thing_ is being targeted
  99. For example, specifying if a single space or no space must follow a comma in a function:
  100. - `function-comma-space-after`: `string` - `"always"|"never"`
  101. <!-- prettier-ignore -->
  102. ```css
  103. a { transform: translate(1, 1) }
  104. /** ↑
  105. * The space after this commas */
  106. ```
  107. The plural of the punctuation is used for `inside` rules. For example, specifying if a single space or no space must be inside the parentheses of a function:
  108. - `function-parentheses-space-inside`: `string` - `"always"|"never"`
  109. <!-- prettier-ignore -->
  110. ```css
  111. a { transform: translate( 1, 1 ); }
  112. /** ↑ ↑
  113. * The space inside these two parentheses */
  114. ```
  115. ## READMEs
  116. Each rule is accompanied by a README in the following format:
  117. 1. Rule name.
  118. 2. Single-line description.
  119. 3. Prototypical code example.
  120. 4. Expanded description (if necessary).
  121. 5. Options.
  122. 6. Example patterns that are considered violations (for each option value).
  123. 7. Example patterns that are _not_ considered violations (for each option value).
  124. 8. Optional options (if applicable).
  125. The single-line description is in the form of:
  126. - "Disallow ..." for `no` rules
  127. - "Limit ..." for `max` rules
  128. - "Require ..." for rules that accept `"always"` and `"never"` options
  129. - "Specify ..." for everything else
  130. ## Violation messages
  131. Each rule produces violation messages in these forms:
  132. - "Expected \[something\] \[in some context\]"
  133. - "Unexpected \[something\] \[in some context\]"