diff --git a/package.json b/package.json index 9cbbc03a..a40c3d5f 100644 --- a/package.json +++ b/package.json @@ -15,6 +15,7 @@ "hover.css": "^2.3.2", "localforage": "^1.10.0", "lodash": "^4.17.21", + "mitt": "^3.0.1", "pinia": "^2.1.6", "swiper": "^10.1.0", "tesseract.js": "^4.1.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 122b458a..1eeb7494 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -20,6 +20,9 @@ dependencies: lodash: specifier: ^4.17.21 version: 4.17.21 + mitt: + specifier: ^3.0.1 + version: 3.0.1 pinia: specifier: ^2.1.6 version: 2.1.6(typescript@5.0.2)(vue@3.3.4) @@ -1346,6 +1349,10 @@ packages: brace-expansion: 2.0.1 dev: true + /mitt@3.0.1: + resolution: {integrity: sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==} + dev: false + /ms@2.1.2: resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==} dev: true diff --git a/src/App.vue b/src/App.vue index e0e6fe83..b49ed451 100644 --- a/src/App.vue +++ b/src/App.vue @@ -15,22 +15,20 @@ const match: MediaQueryList = window.matchMedia("(prefers-color-scheme: dark)") match.addEventListener('change', followSystem) function followSystem() { - if (store.theme === 'auto') { - const theme = match.matches ? 'dark' : 'light' - document.documentElement.setAttribute('data-theme', theme) - // document.documentElement.setAttribute('data-theme', 'dark') - localStorage.setItem('appearance', theme) - } + const theme = match.matches ? 'dark' : 'light' + document.documentElement.setAttribute('data-theme', theme) } onMounted(() => { store.init() - followSystem() + if (store.theme !== 'auto') { + document.documentElement.setAttribute('data-theme', store.theme) + } })