Override programmatic color generation

You can’t override core variables in theme CSS at the moment, related request:

I think it could be useful to override the core variables, it might save you some work… but I suspect it’s not as much as you’d expect.

Say you want to change $primary-low because you want all post borders to be red. Well, $primary-low is also used in 100+ instances that aren’t that border you just wanted to change… so now you still have a bunch of elements you still need to write CSS for anyway. Then you also have situations where $primary-low: red is fine when the background is $secondary but doesn’t work when the background is $primary-high… so you run into some relational issues as well that also need custom CSS.

In theory there’s probably a more useful middle-ground somewhere in our SCSS where we’re taking our small number of core color transformations and inputting them into a much larger set of element variables and/or mixins… and then someone with a little SASS experience can override those and not have to worry as much because they’re more specific.

For example, you’d have definitions like $post-borders: $primary-low, $button-background: $primary-low, etc… and for the basic admin the core color transformations work the same as always. But now the slightly more advanced admin could say $post-borders: red without impacting $button-background.

7 Likes