raster-foundry / blasterjs

React UI library designed and built by Azavea
https://raster-foundry-blaster.netlify.com
Other
6 stars 3 forks source link

Revisit Button theme structure #210

Closed lederer closed 5 years ago

lederer commented 5 years ago

Current Button theme logic: fg and bg colors are determined by intent and appearance

If appearance is default or minimal, the color determined by intent is used for the foreground. base.colors.defaultBg is used for the background in the default case, while background is transparent in the minimal case.

If appearance is prominent, then the color determined by intent is used for the background, and then the foreground color is algorithmically chosen from base.colors.lightText or base.colors.darkText.

And then you can always override any of the above via color and/or bg props.

@jfrankl Reported on some confusion using that model:

I’m a little confused about what I was doing didn’t work, though, in terms of how I’d expect the theme to be structured. I’d expect a button created with no specified appearance or intent would tap into the base values. I wonder if there is a more clear way to organize this part of the theme.