UNPKG

3.98 kBMarkdownView Raw
1# custom-property-empty-line-before
2
3Require or disallow an empty line before custom properties.
4
5<!-- prettier-ignore -->
6```css
7a {
8 top: 10px;
9 /* ← */
10 --foo: pink; /* ↑ */
11} /* ↑ */
12/** ↑
13 * This line */
14```
15
16The [`fix` option](../../../docs/user-guide/usage/options.md#fix) can automatically fix all of the problems reported by this rule. We recommend to enable [`indentation`](../indentation/README.md) rule for better autofixing results with this rule.
17
18## Options
19
20`string`: `"always"|"never"`
21
22### `"always"`
23
24The following patterns are considered violations:
25
26<!-- prettier-ignore -->
27```css
28a {
29 top: 10px;
30 --foo: pink;
31 --bar: red;
32}
33```
34
35The following patterns are _not_ considered violations:
36
37<!-- prettier-ignore -->
38```css
39a {
40 top: 10px;
41
42 --foo: pink;
43
44 --bar: red;
45}
46```
47
48### `"never"`
49
50The following patterns are considered violations:
51
52<!-- prettier-ignore -->
53```css
54a {
55 top: 10px;
56
57 --foo: pink;
58
59 --bar: red;
60}
61```
62
63<!-- prettier-ignore -->
64```css
65a {
66
67 --foo: pink;
68 --bar: red;
69}
70```
71
72The following patterns are _not_ considered violations:
73
74<!-- prettier-ignore -->
75```css
76a {
77 top: 10px;
78 --foo: pink;
79 --bar: red;
80}
81```
82
83<!-- prettier-ignore -->
84```css
85a {
86 --foo: pink;
87 --bar: red;
88}
89```
90
91## Optional secondary options
92
93### `except: ["after-comment", "after-custom-property", "first-nested"]`
94
95#### `"after-comment"`
96
97Reverse the primary option for custom properties that follow a comment.
98
99Shared-line comments do not trigger this option.
100
101For example, with `"always"`:
102
103The following patterns are considered violations:
104
105<!-- prettier-ignore -->
106```css
107a {
108
109 --foo: pink;
110 /* comment */
111
112 --bar: red;
113}
114```
115
116<!-- prettier-ignore -->
117```css
118a {
119
120 --foo: pink; /* comment */
121 --bar: red;
122}
123```
124
125The following patterns are _not_ considered violations:
126
127<!-- prettier-ignore -->
128```css
129a {
130
131 --foo: pink;
132 /* comment */
133 --bar: red;
134}
135```
136
137<!-- prettier-ignore -->
138```css
139a {
140
141 --foo: pink; /* comment */
142
143 --bar: red;
144}
145```
146
147#### `"after-custom-property"`
148
149Reverse the primary option for custom properties that follow another custom property.
150
151Shared-line comments do not affect this option.
152
153For example, with `"always"`:
154
155The following patterns are considered violations:
156
157<!-- prettier-ignore -->
158```css
159a {
160
161 --foo: pink;
162
163 --bar: red;
164}
165```
166
167<!-- prettier-ignore -->
168```css
169a {
170
171 --foo: pink; /* comment */
172
173 --bar: red;
174}
175```
176
177The following patterns are _not_ considered violations:
178
179<!-- prettier-ignore -->
180```css
181a {
182
183 --foo: pink;
184 --bar: red;
185}
186```
187
188<!-- prettier-ignore -->
189```css
190a {
191
192 --foo: pink; /* comment */
193 --bar: red;
194}
195```
196
197#### `"first-nested"`
198
199Reverse the primary option for custom properties that are nested and the first child of their parent node.
200
201For example, with `"always"`:
202
203The following patterns are considered violations:
204
205<!-- prettier-ignore -->
206```css
207a {
208
209 --foo: pink;
210
211 --bar: red;
212}
213```
214
215The following patterns are _not_ considered violations:
216
217<!-- prettier-ignore -->
218```css
219a {
220 --foo: pink;
221
222 --bar: red;
223}
224```
225
226### `ignore: ["after-comment", "first-nested", "inside-single-line-block"]`
227
228#### `"after-comment"`
229
230Ignore custom properties that follow a comment.
231
232For example, with `"always"`:
233
234The following patterns are _not_ considered violations:
235
236<!-- prettier-ignore -->
237```css
238a {
239 /* comment */
240 --foo: pink;
241}
242```
243
244#### `"first-nested"`
245
246Ignore custom properties that are nested and the first child of their parent node.
247
248For example, with `"always"`:
249
250The following patterns are _not_ considered violations:
251
252<!-- prettier-ignore -->
253```css
254a {
255 --foo: pink;
256
257 --bar: red;
258}
259```
260
261#### `"inside-single-line-block"`
262
263Ignore custom properties that are inside single-line blocks.
264
265For example, with `"always"`:
266
267The following patterns are _not_ considered violations:
268
269<!-- prettier-ignore -->
270```css
271a { --foo: pink; --bar: red; }
272```