fix: 切り替え時間を0.5sに

This commit is contained in:
kakkokari-gtyih 2025-05-21 14:00:45 +09:00
parent 7b38ec5027
commit 09fe4b37c2
2 changed files with 5 additions and 6 deletions

View File

@ -92,7 +92,7 @@ html {
html._themeChangingFallback_ {
&, * {
transition: background 1s ease, border 1s ease !important;
transition: background 0.5s ease, border 0.5s ease !important;
}
}
@ -102,13 +102,13 @@ html._themeChanging_ {
html::view-transition-new(theme-changing) {
z-index: 4000001;
animation: themeChangingNew 1s ease;
animation: themeChangingNew 0.5s ease;
animation-fill-mode: forwards;
}
html::view-transition-old(theme-changing) {
z-index: 4000000;
animation: themeChangingOld 1s ease;
animation: themeChangingOld 0.5s ease;
animation-fill-mode: forwards;
}

View File

@ -141,18 +141,17 @@ export function applyTheme(theme: Theme, persist = true) {
await nextTick();
}).finished.then(() => {
window.document.documentElement.classList.remove('_themeChanging_');
// 色計算など再度行えるようにクライアント全体に通知
globalEvents.emit('themeChanged');
});
} else {
// TODO: ViewTransition API が主要ブラウザで対応したら消す
window.document.documentElement.classList.add('_themeChangingFallback_');
timeout = window.setTimeout(() => {
window.document.documentElement.classList.remove('_themeChangingFallback_');
// 色計算など再度行えるようにクライアント全体に通知
globalEvents.emit('themeChanged');
}, 1000);
}, 500);
applyThemeInternal(theme, persist);
}