From ca2df14a8f4e2d0d7eef699b44a2dd9580842a2a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=8B=E3=81=A3=E3=81=93=E3=81=8B=E3=82=8A?=
<67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Wed, 20 Mar 2024 13:10:09 +0900
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20woodenPanel=E3=81=AE=E9=85=8D?=
=?UTF-8?q?=E8=89=B2=E3=82=92=E4=BF=AE=E6=AD=A3=20(#13561)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
* fix(frontend): woodenPanelの配色を修正
* fix
---
packages/frontend/src/boot/common.ts | 3 +++
packages/frontend/src/style.scss | 11 ++++++-----
2 files changed, 9 insertions(+), 5 deletions(-)
diff --git a/packages/frontend/src/boot/common.ts b/packages/frontend/src/boot/common.ts
index 681beaf00f..d86ae18ffe 100644
--- a/packages/frontend/src/boot/common.ts
+++ b/packages/frontend/src/boot/common.ts
@@ -145,8 +145,11 @@ export async function common(createVue: () => App<Element>) {
// NOTE: この処理は必ずクライアント更新チェック処理より後に来ること(テーマ再構築のため)
watch(defaultStore.reactiveState.darkMode, (darkMode) => {
applyTheme(darkMode ? ColdDeviceStorage.get('darkTheme') : ColdDeviceStorage.get('lightTheme'));
+ document.documentElement.dataset.colorMode = darkMode ? 'dark' : 'light';
}, { immediate: miLocalStorage.getItem('theme') == null });
+ document.documentElement.dataset.colorMode = defaultStore.state.darkMode ? 'dark' : 'light';
+
const darkTheme = computed(ColdDeviceStorage.makeGetterSetter('darkTheme'));
const lightTheme = computed(ColdDeviceStorage.makeGetterSetter('lightTheme'));
diff --git a/packages/frontend/src/style.scss b/packages/frontend/src/style.scss
index 187d902733..250a2616a7 100644
--- a/packages/frontend/src/style.scss
+++ b/packages/frontend/src/style.scss
@@ -431,12 +431,13 @@ rt {
border-radius: 10px;
--bg: #F1E8DC;
- --panel: #fff;
--fg: #693410;
- --switchOffBg: rgba(0, 0, 0, 0.1);
- --switchOffFg: rgb(255, 255, 255);
- --switchOnBg: var(--accent);
- --switchOnFg: rgb(255, 255, 255);
+}
+
+html[data-color-mode=dark] ._woodenFrame {
+ --bg: #1d0c02;
+ --fg: #F1E8DC;
+ --panel: #192320;
}
._woodenFrameH {