From aafd8b6bf77a3e8fc1ae6dc202aa83caa46ed4fa Mon Sep 17 00:00:00 2001 From: syuilo <4439005+syuilo@users.noreply.github.com> Date: Wed, 22 Oct 2025 09:11:15 +0900 Subject: [PATCH] =?UTF-8?q?fix(frontend):=20=E3=83=80=E3=83=BC=E3=82=AF?= =?UTF-8?q?=E3=83=A2=E3=83=BC=E3=83=89=E3=81=AE=E5=90=8C=E6=9C=9F=E3=81=8C?= =?UTF-8?q?=E6=A9=9F=E8=83=BD=E3=81=97=E3=81=AA=E3=81=84=E5=A0=B4=E5=90=88?= =?UTF-8?q?=E3=81=8C=E3=81=82=E3=82=8B=E5=95=8F=E9=A1=8C=E3=82=92=E4=BF=AE?= =?UTF-8?q?=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Fix #16688 --- CHANGELOG.md | 1 + packages/frontend/src/boot/common.ts | 10 +--------- packages/frontend/src/theme.ts | 7 +++---- 3 files changed, 5 insertions(+), 13 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 9da1baab43..2e0957a145 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -18,6 +18,7 @@ - ウォーターマークを敷き詰めると上下左右反転した画像/文字が表示される問題を修正 - ウォーターマークを回転させた際に画面からはみ出た部分を考慮できるように - Fix: 投票が終了した後に投票結果が正しく表示されない問題を修正 +- Fix: ダークモードの同期が機能しない場合がある問題を修正 ### Server - Enhance: 管理者/モデレーターはファイルのアップロード制限をバイパスするように diff --git a/packages/frontend/src/boot/common.ts b/packages/frontend/src/boot/common.ts index 4becf32ab5..95ba278ff4 100644 --- a/packages/frontend/src/boot/common.ts +++ b/packages/frontend/src/boot/common.ts @@ -176,7 +176,7 @@ export async function common(createVue: () => Promise>) { })(); applyTheme(theme); - }, { immediate: isSafeMode || miLocalStorage.getItem('theme') == null }); + }, { immediate: true }); window.document.documentElement.dataset.colorScheme = store.s.darkMode ? 'dark' : 'light'; @@ -195,14 +195,6 @@ export async function common(createVue: () => Promise>) { applyTheme(theme ?? defaultLightTheme); } }); - } - - if (!isSafeMode) { - if (prefer.s.darkTheme && store.s.darkMode) { - if (miLocalStorage.getItem('themeId') !== prefer.s.darkTheme.id) applyTheme(prefer.s.darkTheme); - } else if (prefer.s.lightTheme && !store.s.darkMode) { - if (miLocalStorage.getItem('themeId') !== prefer.s.lightTheme.id) applyTheme(prefer.s.lightTheme); - } fetchInstanceMetaPromise.then(() => { // TODO: instance.defaultLightTheme/instance.defaultDarkThemeが不正な形式だった場合のケア diff --git a/packages/frontend/src/theme.ts b/packages/frontend/src/theme.ts index 4d03b1d0e9..7cbaf87243 100644 --- a/packages/frontend/src/theme.ts +++ b/packages/frontend/src/theme.ts @@ -131,7 +131,7 @@ function applyThemeInternal(theme: Theme, persist: boolean) { } let timeout: number | null = null; -let currentTheme: Theme | null = null; +let currentThemeId = miLocalStorage.getItem('themeId'); export function applyTheme(theme: Theme, persist = true) { if (timeout) { @@ -139,9 +139,8 @@ export function applyTheme(theme: Theme, persist = true) { timeout = null; } - if (deepEqual(currentTheme, theme)) return; - // リアクティビティ解除 - currentTheme = deepClone(theme); + if (theme.id === currentThemeId) return; + currentThemeId = theme.id; if (window.document.startViewTransition != null) { window.document.documentElement.classList.add('_themeChanging_');