it looks cool, and definitely is an improvement, however still wonder about consistency, when…
Kris Van Herzeele
11

Hi Kris! So this is actually a pretty common (and basically solved) problem with CSS-in-JS in general. One of the challenges with changing from CSS to CSS-in-JS is changing your mindset and to stop thinking of CSS-in-JS as CSS but thinking of it in the context of JavaScript. Remember that with JavaScript (+ a bundler like webpack) we have modules. Modules can be anything, including variables.

So just like in SASS, where you have a file (or a handful of files) that define the variables for your application, you can do the same thing with JavaScript. It’s just a different file extension, syntax, and runtime semantics.

Especially with the ThemeProvider that you get with glamorous, you could use a common theme throughout your application to hold all of these variables and use them in your styles. I haven’t tried this approach just yet (currently using regular JS modules) but it seems like a pretty solid way to go about doing things.

Let me know if you try it out and how you like it!