Allow the definition of colors through styling instead of configuration
Closed this issue · 13 comments
It would be nice if I could create the component in a way that would make it not set color styles from code, e.g.:
<toggle-button :color="null">.vue-js-switch .v-switch-core {
background: $color-grey
}
.vue-js-switch.toggled .v-switch-core {
background: $color-active
}If you will use !important, it works.
Using !import is a workaround at best, no? What if this is in a library for others to use, and perhaps again override the color? If my library uses !important then they're left in the dust. Would you accept a PR to turn automatic colors off?
I will definitely review it 😄
sweet, thanks! lemme try this.
cool, thanks! Just make sure you test it well and does not break other features 👍 👍 👍
of course, I will
Shall I include the updated dist files in the commit as well?
Instead of :color="null", perhaps it would be better if the value to turn this behavior off was color="none"? Happy to rewrite the commit if you agree.
Gave it a bit of a thought. I think the best solution would be to have prop cssColors=Boolean that turns on/off javascript color assigning. This way we do not reinvent the wheel with color or none or object or some_other_shit type of value for color prop
Ok, that sounds reasonable. Will change the PR!
Since the other color property is singular, is it a bit weird that it's in plural? Could also be useCss, or cssStyling instead, being a bit more indicative of it being a boolean also?
Although I guess this doesn't work for width / height, where we still need to rely on inline style to determine the radius... so mentioning color isn't wrong : )