Custom properties don't change on theme switch

[daishizenSensei]

Hello everyone,

We face an issue with custom properties, they don't change with $vuetify.theme.dark = true. Is it possible to also switch them or this is not an option that Vuetify provide ?

Thank you

[larzon83]

@kbrosseau they should switch. Please provide some reproduction.

[daishizenSensei]

Sorry, wrong manipulation... I reproduce a simple switch on codepen and it is working. I don't know why it is not working in my app (https://github.com/warenghem/frontend/)

[larzon83]

I got your project running after some hick-ups. Seems to be working on my side:

https://user-images.githubusercontent.com/23213583/123545287-8b0ddc00-d757-11eb-8e5a-c8f6f5c2eebb.mp4

I put @nuxtjs/vuetify, vuetify and sass-loader under devDependencies. Also got rid of fibers and node-sass. I updated all deps and removed yarn.lock Then ran yarn. I needed to include postcss@8 to devDeps because of errors. Note: Nuxt Component autoimport doesn't work anymore with just the <componentname />. Must be changed to <foldernameComponentname />

[daishizenSensei]

Oh thank you for that ! Yes switcher is working, but if i want a dark mode page and for example put beforeCreate () { this.$vuetify.theme.dark = true; }, Then is it light custom properties wich is loaded

[daishizenSensei]

Indeed, after investigation the beforeCreate () {this.$vuetify.theme.dark = true;} is working, but Nuxt load the light Custom properties after

[larzon83]

Indeed, after investigation the beforeCreate () {this.$vuetify.theme.dark = true;} is working, but Nuxt load the light Custom properties after

hm, seems to work here too:

https://user-images.githubusercontent.com/23213583/123554510-a214f400-d780-11eb-8a4d-47c95216f20b.mp4

What can also seen in this screencast, is that when navigating back, dark-mode stays. I think you need a mixin inserted in every page. There you can put the beforeCreate function and have a list with routes to be dark to check against. So you can revert to dark=false in such a case...

[daishizenSensei]

Please try to refresh the page, it is not on router load but on page load that the issue is happening :) Okay for the mixins, thanks it was another bug that i tried to resolve !

https://user-images.githubusercontent.com/71672618/123554908-b9ed7780-d782-11eb-95bf-16a4d2eff640.mp4

[larzon83]

sorry, nor more clue. Maybe asking on vuetify discord

[daishizenSensei]

Okay thank you :)

Envoyé de mon iPhone

Le 28 juin 2021 à 00:59, larzon83 @.***> a écrit :

 sorry, nor more clue. Maybe asking on vuetify discord

— You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub, or unsubscribe.