CSS/SCSS Unknown function 'light-dark'
A question about handling this type of error in general, but here with a specific example pertaining to the relatively new CSS light-dark() function.
@supports (color: light-dark(black, white)) { color: light-dark( color-mix(in srgb, var(--color-bortle) 50%, black), color-mix(in srgb, var(--color-bortle) 50%, white) ); background: color-mix(in srgb, var(--color-bortle) 10%, transparent);}
PHPStorm flags ‘light-dark’ with Unknown function ‘light-dark’, which looks like it is tied to CssInvalidFunction under inspections. And to the CSS plugin? But after some searching, I have found no way to add it as a custom function, nor to add some sort of inline comment to ignore CssInvalidFunction for this case. Only a way to adjust error handling for that inspection on a global scale, which is not ideal when a truly non-existent function would be a problem.
Any advice on how to handle a case like this in the IDE?
Thanks in advance!
Please sign in to leave a comment.
Hello,
Unfortunately, currently there are no ways to specify a list of custom functions. You can vote for this functionality in WEB-71669.
To ignore such inspections, you should be able to use the /*noinspection CssInvalidFunction*/ comment.
/*noinspection CssInvalidFunction*/@supports (color: light-dark(black, white)) {color: light-dark(color-mix(in srgb, var(--color-bortle) 50%, black),color-mix(in srgb, var(--color-bortle) 50%, white));background: color-mix(in srgb, var(--color-bortle) 10%, transparent);}Does this help?
This function is supported starting with 2025.3. Please refer to WEB-66244 (https://youtrack.jetbrains.com/issue/WEB-66244). Could you please clarify what IDE version you are using?
Ah, thank you. I missed that the update was available.
If you happen to see this, do you have any feedback on the other questions? Specifically how to ignore an error like this, or to add a function?