custom-property-empty-line-before
Require or disallow an empty line before custom properties.
a {
top: 10px;
/* ← */
--foo: pink; /* ↑ */
} /* ↑ */
/** ↑
* This line */
The fix
option can automatically fix all of the problems reported by this rule.
Options
string
: "always"|"never"
"always"
The following patterns are considered problems:
a {
top: 10px;
--foo: pink;
--bar: red;
}
The following patterns are not considered problems:
a {
top: 10px;
--foo: pink;
--bar: red;
}
"never"
The following patterns are considered problems:
a {
top: 10px;
--foo: pink;
--bar: red;
}
a {
--foo: pink;
--bar: red;
}
The following patterns are not considered problems:
a {
top: 10px;
--foo: pink;
--bar: red;
}
a {
--foo: pink;
--bar: red;
}
Optional secondary options
except: ["after-comment", "after-custom-property", "first-nested"]
"after-comment"
Reverse the primary option for custom properties that follow a comment.
Shared-line comments do not trigger this option.
For example, with "always"
:
The following patterns are considered problems:
a {
--foo: pink;
/* comment */
--bar: red;
}
a {
--foo: pink; /* comment */
--bar: red;
}
The following patterns are not considered problems:
a {
--foo: pink;
/* comment */
--bar: red;
}
a {
--foo: pink; /* comment */
--bar: red;
}
"after-custom-property"
Reverse the primary option for custom properties that follow another custom property.
Shared-line comments do not affect this option.
For example, with "always"
:
The following patterns are considered problems:
a {
--foo: pink;
--bar: red;
}
a {
--foo: pink; /* comment */
--bar: red;
}
The following patterns are not considered problems:
a {
--foo: pink;
--bar: red;
}
a {
--foo: pink; /* comment */
--bar: red;
}
"first-nested"
Reverse the primary option for custom properties that are nested and the first child of their parent node.
For example, with "always"
:
The following patterns are considered problems:
a {
--foo: pink;
--bar: red;
}