summaryrefslogtreecommitdiff
path: root/packages
diff options
context:
space:
mode:
authorかっこかり <67428053+kakkokari-gtyih@users.noreply.github.com>2024-03-20 13:10:09 +0900
committerGitHub <noreply@github.com>2024-03-20 13:10:09 +0900
commitca2df14a8f4e2d0d7eef699b44a2dd9580842a2a (patch)
tree6106fb005c7d7cf1817788957938be48acc520dc /packages
parentCypress typescript (#13591) (diff)
downloadsharkey-ca2df14a8f4e2d0d7eef699b44a2dd9580842a2a.tar.gz
sharkey-ca2df14a8f4e2d0d7eef699b44a2dd9580842a2a.tar.bz2
sharkey-ca2df14a8f4e2d0d7eef699b44a2dd9580842a2a.zip
fix(frontend): woodenPanelの配色を修正 (#13561)
* fix(frontend): woodenPanelの配色を修正 * fix
Diffstat (limited to 'packages')
-rw-r--r--packages/frontend/src/boot/common.ts3
-rw-r--r--packages/frontend/src/style.scss11
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 {