enhance(client): add html color-schema support

This commit is contained in:
syuilo 2022-08-27 00:39:59 +09:00
parent dddc076d01
commit 773139b737
2 changed files with 9 additions and 0 deletions

View file

@ -92,6 +92,10 @@
} }
} }
} }
const colorSchema = localStorage.getItem('colorSchema');
if (colorSchema) {
document.documentElement.style.setProperty('color-schema', colorSchema);
}
//#endregion //#endregion
const fontSize = localStorage.getItem('fontSize'); const fontSize = localStorage.getItem('fontSize');

View file

@ -57,6 +57,8 @@ export function applyTheme(theme: Theme, persist = true) {
document.documentElement.classList.remove('_themeChanging_'); document.documentElement.classList.remove('_themeChanging_');
}, 1000); }, 1000);
const colorSchema = theme.base === 'dark' ? 'dark' : 'light';
// Deep copy // Deep copy
const _theme = JSON.parse(JSON.stringify(theme)); const _theme = JSON.parse(JSON.stringify(theme));
@ -78,8 +80,11 @@ export function applyTheme(theme: Theme, persist = true) {
document.documentElement.style.setProperty(`--${k}`, v.toString()); document.documentElement.style.setProperty(`--${k}`, v.toString());
} }
document.documentElement.style.setProperty('color-schema', colorSchema);
if (persist) { if (persist) {
localStorage.setItem('theme', JSON.stringify(props)); localStorage.setItem('theme', JSON.stringify(props));
localStorage.setItem('colorSchema', colorSchema);
} }
// 色計算など再度行えるようにクライアント全体に通知 // 色計算など再度行えるようにクライアント全体に通知