UNPKG

1.73 kBMarkdownView Raw
1# unit-whitelist
2
3**_Deprecated: Instead use the [`unit-allowed-list`](../unit-allowed-list/README.md) rule._**
4
5Specify a list of allowed units.
6
7<!-- prettier-ignore -->
8```css
9a { width: 100px; }
10/** ↑
11 * These units */
12```
13
14## Options
15
16`array|string`: `["array", "of", "units"]|"unit"`
17
18Given:
19
20```
21["px", "em", "deg"]
22```
23
24The following patterns are considered violations:
25
26<!-- prettier-ignore -->
27```css
28a { width: 100%; }
29```
30
31<!-- prettier-ignore -->
32```css
33a { font-size: 10rem; }
34```
35
36<!-- prettier-ignore -->
37```css
38a { animation: animation-name 5s ease; }
39```
40
41The following patterns are _not_ considered violations:
42
43<!-- prettier-ignore -->
44```css
45a { font-size: 1.2em; }
46```
47
48<!-- prettier-ignore -->
49```css
50a { line-height: 1.2; }
51```
52
53<!-- prettier-ignore -->
54```css
55a { height: 100px; }
56```
57
58<!-- prettier-ignore -->
59```css
60a { height: 100PX; }
61```
62
63<!-- prettier-ignore -->
64```css
65a { transform: rotate(30deg); }
66```
67
68## Optional secondary options
69
70### `ignoreProperties: { unit: ["property", "/regex/", /regex/] }`
71
72Ignore units in the values of declarations with the specified properties.
73
74For example, with `["px", "em"]`.
75
76Given:
77
78```
79{
80 "rem": [ "line-height", "/^border/" ],
81 "%": [ "width" ]
82}
83```
84
85The following patterns are _not_ considered violations:
86
87<!-- prettier-ignore -->
88```css
89a { line-height: 0.1rem; }
90```
91
92<!-- prettier-ignore -->
93```css
94a { border-bottom-width: 6rem; }
95```
96
97<!-- prettier-ignore -->
98```css
99a { width: 100%; }
100```
101
102The following patterns are considered violations:
103
104<!-- prettier-ignore -->
105```css
106a { margin: 0 20rem; }
107```
108
109<!-- prettier-ignore -->
110```css
111a { -moz-border-radius-topright: 20rem; }
112```
113
114<!-- prettier-ignore -->
115```css
116a { height: 100%; }
117```