Pale Moon does not support calc () with CSS variables

[Alex_Top]

Many sites developers use CSS variables (also called "custom properties")
and calculate some variable values using the calc () function. This brings significant benefits to the developer.

The Pale Moon does not support this. Which ultimately doesn't work in favor of PaleMoon as a browser (with support for modern CSS standards)
for viewing web content. I am hoping to see him as soon as possible..
Example: "HCL with calc and custom properties" https://codepen.io/chriscoyier/pen/dyoVXEj

[Moonchild]

The Pale Moon does not support this.

What is it with people calling it "the Pale Moon"?

calc() is supported by Pale Moon. what is not (yet) supported is using min()/max() inside calc() for which there is an open issue.
It's also well possible that using calc() -inside- hsl() isn't supported, but that will need some more research to answer.

EDIT: Indeed, we don't currently support calc-in-color statements. Opened Issue #1765 (UXP) for this enhancement.

[Lurker_01]

I reported it a year and a half ago viewtopic.php?f=13&t=23478
No issue was created.
Thanks for opening it now.

[Moonchild]

The statement in that other thread still apply here. You can calculate the final values in variables instead of trying to short-hand it inside the colour statements.
While the issue is created now, I don't see this having priority (unless e.g. Athenian200 feels a calling to do more CSS work? it's more VARIANT_* juggling)

[Lurker_01]

Off-topic:
In my case i have 60 colors or so.
Instead of generating HLS with the defined hue, saturation, and lightness variables that are multiplied to factor x and use it as a color, it is possible to create 110 color components variables to do the same thing.
In my case if i wanted i could created colors programmatically via js and just add them to css, with Pale Moon i would have to add a lot of variables and keep a bookkeeping to generate new ones, or give them randomly generated names that doesn't describe them. (or just bypass css and precalculate it in js)
So yes, you can do the same thing without this support, and yes i would need to rewrite everything just to decouple the calculation so that it would work on Pale Moon.

[Moonchild]

Off-topic:
You know, you can always make a case supporting any argument, but if you have that many different colors to work with, then the right tool would be JS and not CSS. CSS is not designed to do complex calculations in itself and the use of variables is a very convenient feature but keep the design scope of the language in mind. Not everything should be doing everything that everything else already does. We have DOM style attributes for a very good reason for this.
If you made the decision to build a site around a specific webkit feature then yes, you'll have to rewrite it to something more accessible as a result of that design decision if you want to be browser-agnostic. Or you can step up and help us support it in the browser. Either way, coding has to happen.