From faf2c007aab3a096129dd218b44d8f01a6f5ad87 Mon Sep 17 00:00:00 2001 From: syuilo Date: Mon, 12 Apr 2021 22:07:32 +0900 Subject: [PATCH] fix bug --- src/client/init.ts | 30 ++++++++++++---- src/client/pages/settings/theme.vue | 56 +++++++++++++++++------------ src/client/pages/theme-editor.vue | 4 +-- src/client/scripts/theme.ts | 16 ++++----- src/client/store.ts | 6 ++-- src/client/theme-store.ts | 1 - 6 files changed, 69 insertions(+), 44 deletions(-) diff --git a/src/client/init.ts b/src/client/init.ts index e77e53dc64..daedce4aee 100644 --- a/src/client/init.ts +++ b/src/client/init.ts @@ -6,7 +6,7 @@ import '@client/style.scss'; import * as Sentry from '@sentry/browser'; import { Integrations } from '@sentry/tracing'; -import { createApp, watch } from 'vue'; +import { computed, createApp, watch } from 'vue'; import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'; import widgets from '@client/widgets'; @@ -25,7 +25,6 @@ import { fetchInstance, instance } from '@client/instance'; import { makeHotkey } from '@client/scripts/hotkey'; import { search } from '@client/scripts/search'; import { isMobile } from '@client/scripts/is-mobile'; -import { getThemes } from '@client/theme-store'; import { initializeSw } from '@client/scripts/initialize-sw'; import { reloadChannel } from '@client/scripts/unison-reload'; import { reactionPicker } from '@client/scripts/reaction-picker'; @@ -36,6 +35,13 @@ console.info(`Misskey v${version}`); window.onerror = null; window.onunhandledrejection = null; +// 後方互換性のため。 +// TODO: そのうち消す +if ((typeof ColdDeviceStorage.get('lightTheme') === 'string') || (typeof ColdDeviceStorage.get('darkTheme') === 'string')) { + ColdDeviceStorage.set('lightTheme', require('@client/themes/l-light.json5')); + ColdDeviceStorage.set('darkTheme', require('@client/themes/d-dark.json5')); +} + if (_DEV_) { console.warn('Development mode!!!'); @@ -205,12 +211,24 @@ if (splash) { } watch(defaultStore.reactiveState.darkMode, (darkMode) => { - import('@client/scripts/theme').then(({ builtinThemes }) => { - const themes = builtinThemes.concat(getThemes()); - applyTheme(themes.find(x => x.id === (darkMode ? ColdDeviceStorage.get('darkTheme') : ColdDeviceStorage.get('lightTheme')))); - }); + applyTheme(darkMode ? ColdDeviceStorage.get('darkTheme') : ColdDeviceStorage.get('lightTheme')); }, { immediate: localStorage.theme == null }); +const darkTheme = computed(ColdDeviceStorage.makeGetterSetter('darkTheme')); +const lightTheme = computed(ColdDeviceStorage.makeGetterSetter('lightTheme')); + +watch(darkTheme, (theme) => { + if (defaultStore.state.darkMode) { + applyTheme(theme); + } +}); + +watch(lightTheme, (theme) => { + if (!defaultStore.state.darkMode) { + applyTheme(theme); + } +}); + //#region Sync dark mode if (ColdDeviceStorage.get('syncDeviceDarkMode')) { defaultStore.set('darkMode', isDeviceDarkmode()); diff --git a/src/client/pages/settings/theme.vue b/src/client/pages/settings/theme.vue index 75f27d12e7..606e10ab7a 100644 --- a/src/client/pages/settings/theme.vue +++ b/src/client/pages/settings/theme.vue @@ -27,7 +27,7 @@