3 ms·
And that's why I wrote: If you want to have a range of applicable values for some CSS property or state-based styling, CSS-in-JS can be a good tool for express
by rajangdavis 5y ago
And that's why I wrote:
If you want to have a range of applicable values for some CSS property or state-based styling, CSS-in-JS can be a good tool for expressing that as opposed to writing JS that updates some styling declaratively
- runarberg 5y agoI see. There might be a difference in opinion. I think there is a fundamental difference in setting style properties in JS and setting CSS custom properties (even though CSS custom property is a style property). The main difference is that it is clear from the CSS that this property is dynamic and can be expected to change. If you overwrite a style attribute (e.g. `element.style.transform = "rotate(50deg)"`) this is less clear. So in honestly I don’t see how setting a CSS custom property in JavaScript as lacking in expressing the intent.
- rajangdavis 5y agoThe main use case highlighted in the article is React and that is the use case that I am speaking to. With React, you don't modify the DOM directly, so the use case you have laid out is not applicable. With that in mind, you are still free to use the CSS custom property with React, but if you want to have multiple transformations across multiple parts of an application, it's a lot simpler to use CSS-in-JS to generate styling based on state. The use case you have brought up should work well with vanilla js/jquery; however, the context of the discussion is rooted in front-end libraries and the popularity of CSS-in-JS, so I am not sure how custom properties are relevant.