1 | # property-whitelist
|
2 |
|
3 | Specify a whitelist of allowed properties.
|
4 |
|
5 |
|
6 | ```css
|
7 | a { display: block; }
|
8 | /** ↑
|
9 | * This property */
|
10 | ```
|
11 |
|
12 | This rule ignores variables (`$sass`, `@less`, `--custom-property`).
|
13 |
|
14 | ## Options
|
15 |
|
16 | `array|string`: `["array", "of", "unprefixed", /properties/ or "regex"]|"property"|"/regex/"`|/regex/
|
17 |
|
18 | If a string is surrounded with `"/"` (e.g. `"/^background/"`), it is interpreted as a regular expression. This allows, for example, easy targeting of shorthands: `/^background/` will match `background`, `background-size`, `background-color`, etc.
|
19 |
|
20 | Given:
|
21 |
|
22 | ```
|
23 | ["display", "animation", "/^background/"]
|
24 | ```
|
25 |
|
26 | The following patterns are considered violations:
|
27 |
|
28 |
|
29 | ```css
|
30 | a { color: pink; }
|
31 | ```
|
32 |
|
33 |
|
34 | ```css
|
35 | a {
|
36 | animation: my-animation 2s;
|
37 | color: pink;
|
38 | }
|
39 | ```
|
40 |
|
41 |
|
42 | ```css
|
43 | a { borkgrund: orange; }
|
44 | ```
|
45 |
|
46 | The following patterns are _not_ considered violations:
|
47 |
|
48 |
|
49 | ```css
|
50 | a { display: block; }
|
51 | ```
|
52 |
|
53 |
|
54 | ```css
|
55 | a { -webkit-animation: my-animation 2s; }
|
56 | ```
|
57 |
|
58 |
|
59 | ```css
|
60 | a {
|
61 | animation: my-animation 2s;
|
62 | -webkit-animation: my-animation 2s;
|
63 | display: block;
|
64 | }
|
65 | ```
|
66 |
|
67 |
|
68 | ```css
|
69 | a { background: pink; }
|
70 | ```
|
71 |
|
72 |
|
73 | ```css
|
74 | a { background-color: pink; }
|
75 | ```
|