arciisine / MaterialThemeGenerator

Material Theme Generator application, written in Angular
https://materialtheme.arcsine.dev
MIT License
230 stars 47 forks source link

No color sass maps #2

Open inorganik opened 5 years ago

inorganik commented 5 years ago

I love this project! I think it's really well executed.

I see you've supplemented the color sass maps material ships for its default colors by using lighten() and darken() to fill in the holes in the foreground and background variables. This seems to work fine. But do you think this could be a brittle solution? I don't know if it's a good idea to overwrite the foreground and background variables, I'll explain why.

For instance, if Material ships a new component, that will add a new key to those variables which would not exist in your override until you updated this tool. Could you instead use lighten and darken to generate the sass-map of colors and use that, eliminating the need to override foreground and background vars? Something to think about.

arciisine commented 5 years ago

Hey, thanks for the feedback. I'm trying to figure out how to work with the Material project as well to prevent any brittleness. Right now the variable surface for the theme doesn't seem to be very well defined, and some variables that are set are not being honored by the components themselves. I'm hoping to get to a place where things are happy, but I have a feeling there might be some growing pains on both sides.

I'm hoping the angular material project may start to align more with how MDC handles variables and specifically their configuration surface: https://github.com/material-components/material-components-web/blob/master/docs/theming.md.

Right now I believe the colors computed using lighten/darken hit the same values as defined by default, but I'm not sure how to allow others to override the colors without using those specifically as well.

I'll keep this issue open as I think its worth discussing more and hopefully finding a consistent solution.