Vuetify: [Bug Report] beta v3 breaks dynamic theme colours

Created on 11 Jan 2018  路  8Comments  路  Source: vuetifyjs/vuetify

Versions and Environment

Vuetify: 1.0.0-beta.3
Vue: 2.5.13
Browsers: Chrome 63.0.3239.132
OS: Mac OS 10.13.2

Steps to reproduce

If you change the CDN linked file to vuetify from v3 to v2 you will see how it used to work vs how it works now.

Expected Behavior

In Beta 2 and earlier (since this functionality was introduced) it was possible to update the theme colours dynamically.

Actual Behavior

However, it doesn't always seem to work as intended anymore.

Reproduction Link

https://codepen.io/shongololo/pen/GydvXy

bug

Most helpful comment

Because of the new changes to theming, which include the dynamically calculated lighten/darken variants, css color names are not currently supported.

Paging Dr @KaelWD. Ideally there's an easy way of converting the css color name to RGB?

All 8 comments

Because of the new changes to theming, which include the dynamically calculated lighten/darken variants, css color names are not currently supported.

Paging Dr @KaelWD. Ideally there's an easy way of converting the css color name to RGB?

This happens with RGB as well.

There isn't an easy way fo us to convert named colors to hex, you have to either import the colors list or only use hex colors. There's supposed to be a console warning about this, but it isn't working for some reason.
You pen works if you use the correct color format: https://codepen.io/anon/pen/mpLjbg

I still need to write the documentation for this new system too.

Thanks for clarifying, I'm converting to hex colours for now.

@KaelWD

There isn't an easy way fo us to convert named colors to hex

In the event this might be useful (not sure what your policy is on keeping code lean vs. using third party libraries): d3-color might be handy for colour definitions.

A convenience toHexString() method can be added to the d3-color prototype per this issue.

Not a chance, that thing's huge. I'm going to fix the error to make it clear what's going on, but you will have to use hex colors only.

Or import our colors util to use the material design colors

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. Please direct any non-bug questions to our Discord

Was this page helpful?
0 / 5 - 0 ratings

Related issues

aaronjpitts picture aaronjpitts  路  3Comments

smousa picture smousa  路  3Comments

SteffenDE picture SteffenDE  路  3Comments

efootstep picture efootstep  路  3Comments

sebastianmacias picture sebastianmacias  路  3Comments