search

AndyOGo / stylelint-declaration-strict-value

Specify properties for which a variable, function, keyword or value must be used.
MIT License
134 stars 10 forks source link

Many <color> in value, `scrollbar-color` for example #117

Closed ariarzer closed 3 years ago

ariarzer commented 4 years ago

I use this config:

scale-unlimited/declaration-strict-value': [
  [ '/color/', 'fill', 'stroke' ],
  {
    ignoreKeywords: [ 'currentColor', 'transparent', 'inherit', 'unset', ],
  }],

When i use a 

scrollbar-color: var(--steel_gray_140) transparent;

I get an error 

Expected variable, function or keyword for "var(--steel_gray_140) transparent" of "scrollbar-color"

This property doesn't have a shorthand, but use a <color>{2} grammar. But the plugin tries to check the entire property value.

AndyOGo commented 4 years ago

@ariarzer Thank you for the issue.

Fixing this properly requires CSS value parsing, for this purpose this module utilizes css-values, which does not support scrollbar-color yet.

You can find a full list of supported CSS values here: https://github.com/ben-eb/css-values#property-support

AndyOGo commented 3 years ago

@ariarzer I thought about your issue and multi-value grammars in general. For this case I decided to just split CSS values and avoid parsing.

It's released with v1.7.0. This should improve any multi-value properties (excluding shorthand).