he/him 
I'm finding that most CSS-in-JS libraries aren't radical and strict enough. Ban descendent selectors, whitelist pseudo selectors, don't allow dynamic values. What I really want is just styles-in-JS. Get rid of the cascade.
Show this thread
-
I definitely agree with this sentiment. I'm curious what you mean by dynamic values. How would dynamic values be prevented in JS?
You can restrict them at lint or compile-time. eg. you disallow {color: generateColor()} You can also support a bunch of other stuff if the values are all used locally, for example: const baseRadius = 2; {borderRadius: baseRadius * 2}
-
-
The main motivation for disallowing dynamic values is so you can know all the style values statically, and compile them into a standalone stylesheet.
-
Is performance the only reason to compile to style sheet?
- 2 more replies
New conversation -
-
-
Today, I would normally set a CSS variable for that & use border-radius: calc(2 * var(—appName-base-radius); regardless where the stylesheet originated from; then again that leverages cascading but in a matter I’m not sure I would want to give up…
Thanks. Twitter will use this to make your timeline better. UndoUndo
-
-
-
*calc(2 * var(—appName-base-radius, 2));
Thanks. Twitter will use this to make your timeline better. UndoUndo
-
Loading seems to be taking a while.
Twitter may be over capacity or experiencing a momentary hiccup. Try again or visit Twitter Status for more information.