noInvalidDirectionInLinearGradient
Diagnostic Category: lint/correctness/noInvalidDirectionInLinearGradient
Since: v1.9.0
Sources:
Disallow non-standard direction values for linear gradient functions.
A valid and standard direction value is one of the following:
- an angle
- to plus a side-or-corner (
to top,to bottom,to left,to right;to top right,to right top,to bottom left, etc.)
A common mistake (matching outdated non-standard syntax) is to use just a side-or-corner without the preceding to.
Examples
Section titled ExamplesInvalid
Section titled Invalid.foo { background: linear-gradient(top, #fff, #000); }code-block.css:1:36 lint/correctness/noInvalidDirectionInLinearGradient ━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Unexpected nonstandard direction
> 1 │ .foo { background: linear-gradient(top, #fff, #000); }
│ ^^^
2 │
ℹ You should fix the direction value to follow the syntax.
ℹ See MDN web docs for more details.
.foo { background: linear-gradient(45, #fff, #000); }code-block.css:1:36 lint/correctness/noInvalidDirectionInLinearGradient ━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Unexpected nonstandard direction
> 1 │ .foo { background: linear-gradient(45, #fff, #000); }
│ ^^
2 │
ℹ You should fix the direction value to follow the syntax.
ℹ See MDN web docs for more details.
Valid
Section titled Valid.foo { background: linear-gradient(to top, #fff, #000); }.foo { background: linear-gradient(45deg, #fff, #000); }