noDuplicateCustomProperties
Diagnostic Category: lint/nursery/noDuplicateCustomProperties
Since: v1.9.0
Sources:
Disallow duplicate custom properties within declaration blocks.
This rule checks the declaration blocks for duplicate custom properties.
Examples
Section titled ExamplesInvalid
Section titled Invalida { --custom-property: pink; --custom-property: orange; }code-block.css:1:30 lint/nursery/noDuplicateCustomProperties ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Duplicate custom properties can lead to unexpected behavior and may override previous declarations unintentionally.
> 1 │ a { —custom-property: pink; —custom-property: orange; }
│ ^^^^^^^^^^^^^^^^^
2 │
ℹ —custom-property is already defined here.
> 1 │ a { —custom-property: pink; —custom-property: orange; }
│ ^^^^^^^^^^^^^^^^^
2 │
ℹ Remove or rename the duplicate custom property to ensure consistent styling.
a { --custom-property: pink; background: orange; --custom-property: orange }code-block.css:1:50 lint/nursery/noDuplicateCustomProperties ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Duplicate custom properties can lead to unexpected behavior and may override previous declarations unintentionally.
> 1 │ a { —custom-property: pink; background: orange; —custom-property: orange }
│ ^^^^^^^^^^^^^^^^^
2 │
ℹ —custom-property is already defined here.
> 1 │ a { —custom-property: pink; background: orange; —custom-property: orange }
│ ^^^^^^^^^^^^^^^^^
2 │
ℹ Remove or rename the duplicate custom property to ensure consistent styling.
Valid
Section titled Valida { --custom-property: pink; }a { --custom-property: pink; --cUstOm-prOpErtY: orange; }