parent
862a6fae79
commit
18daf43f70
|
@ -64,12 +64,6 @@ html {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
html._themeChangingFallback_ {
|
|
||||||
&, * {
|
|
||||||
transition: background 0.5s ease, border 0.5s ease !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
html._themeChanging_ {
|
html._themeChanging_ {
|
||||||
view-transition-name: theme-changing;
|
view-transition-name: theme-changing;
|
||||||
}
|
}
|
||||||
|
|
|
@ -140,7 +140,7 @@ export function applyTheme(theme: Theme, persist = true) {
|
||||||
// リアクティビティ解除
|
// リアクティビティ解除
|
||||||
currentTheme = deepClone(theme);
|
currentTheme = deepClone(theme);
|
||||||
|
|
||||||
if (window.document.startViewTransition != null && prefer.s.animation) {
|
if (window.document.startViewTransition != null) {
|
||||||
window.document.documentElement.classList.add('_themeChanging_');
|
window.document.documentElement.classList.add('_themeChanging_');
|
||||||
window.document.startViewTransition(async () => {
|
window.document.startViewTransition(async () => {
|
||||||
applyThemeInternal(theme, persist);
|
applyThemeInternal(theme, persist);
|
||||||
|
@ -151,15 +151,9 @@ export function applyTheme(theme: Theme, persist = true) {
|
||||||
globalEvents.emit('themeChanged');
|
globalEvents.emit('themeChanged');
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
// TODO: ViewTransition API が主要ブラウザで対応したら消す
|
|
||||||
window.document.documentElement.classList.add('_themeChangingFallback_');
|
|
||||||
timeout = window.setTimeout(() => {
|
|
||||||
window.document.documentElement.classList.remove('_themeChangingFallback_');
|
|
||||||
// 色計算など再度行えるようにクライアント全体に通知
|
|
||||||
globalEvents.emit('themeChanged');
|
|
||||||
}, 500);
|
|
||||||
|
|
||||||
applyThemeInternal(theme, persist);
|
applyThemeInternal(theme, persist);
|
||||||
|
// 色計算など再度行えるようにクライアント全体に通知
|
||||||
|
globalEvents.emit('themeChanged');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue