diff --git a/src/layouts/default/AppBar.vue b/src/layouts/default/AppBar.vue index 97ac6de..d855b7d 100644 --- a/src/layouts/default/AppBar.vue +++ b/src/layouts/default/AppBar.vue @@ -24,9 +24,7 @@ mdi-cog - mdi-{{ - dark ? "white-balance-sunny" : "weather-night" - }} + mdi-{{ dark ? "white-balance-sunny" : "weather-night" }} @@ -48,9 +46,9 @@ export default { }, methods: { toggleTheme() { - this.theme.global.name = this.theme.global.current.dark - ? "light" - : "dark"; + const theme = this.theme.global.current.dark ? "light" : "dark"; + this.theme.global.name = theme; + localStorage.setItem("theme", theme); }, openSettings() { this.$refs.settings.open(); diff --git a/src/plugins/vuetify.js b/src/plugins/vuetify.js index 4fcd6a9..cca6b91 100644 --- a/src/plugins/vuetify.js +++ b/src/plugins/vuetify.js @@ -11,9 +11,12 @@ import 'vuetify/styles' // Composables import { createVuetify } from 'vuetify' +const defaultTheme = localStorage.getItem('theme') || 'light' + // https://vuetifyjs.com/en/introduction/why-vuetify/#feature-guides export default createVuetify({ theme: { + defaultTheme, themes: { light: { colors: {