usbharu
/
misskey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/frontend/src/style.scss
View File

@ -92,7 +92,7 @@ html {
html._themeChangingFallback_ { 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) { html::view-transition-new(theme-changing) {
z-index: 4000001; z-index: 4000001;
animation: themeChangingNew 1s ease; animation: themeChangingNew 0.5s ease;
animation-fill-mode: forwards; animation-fill-mode: forwards;
} }
html::view-transition-old(theme-changing) { html::view-transition-old(theme-changing) {
z-index: 4000000; z-index: 4000000;
animation: themeChangingOld 1s ease; animation: themeChangingOld 0.5s ease;
animation-fill-mode: forwards; animation-fill-mode: forwards;
} }

5
packages/frontend/src/theme.ts
View File

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