(style) save effective darkMode to cookies to make it accessible in ssr

This commit is contained in:
Valentyne Stigloher 2024-03-24 00:36:14 +01:00
parent 11f253583b
commit 02f7bdc3b1
2 changed files with 10 additions and 17 deletions

View File

@ -20,7 +20,6 @@ export default dark.extend({
data() {
return {
mode: 'automatic' as Mode,
isDark: false,
modes: {
light: 'sun',
automatic: 'eclipse',
@ -34,9 +33,16 @@ export default dark.extend({
this.setMode(this.mode);
this.isDark = this.detectDark();
},
isDark() {
this.setIsDark(this.isDark);
this.$store.commit('setDarkMode', this.isDark);
},
computed: {
isDark: {
get() {
return this.$store.state.darkMode;
},
set(darkMode) {
this.$store.commit('setDarkMode', darkMode);
this.$cookies.set('darkMode', darkMode);
},
},
},
mounted() {

View File

@ -48,18 +48,5 @@ export default Vue.extend({
localStorage.setItem('mode', mode);
},
setIsDark(dark: boolean): void {
if (!process.client) {
return;
}
if (dark) {
document.body.setAttribute('data-theme', 'dark');
document.body.setAttribute('data-bs-theme', 'dark');
} else {
document.body.removeAttribute('data-theme');
document.body.removeAttribute('data-bs-theme');
}
},
},
});