mirror of
https://github.com/ChenQihan666/MyBlog-Next.git
synced 2026-08-14 07:33:07 +08:00
fix: navigation flicker on Android when in dark mode (#494)
Set meta theme-color value before page transition to avoid navigation bar color flickering in Android dark mode. --------- Co-authored-by: satnaing <satnaingdev@gmail.com>
This commit is contained in:
@@ -67,6 +67,18 @@ window.onload = () => {
|
||||
document.addEventListener("astro:after-swap", setThemeFeature);
|
||||
};
|
||||
|
||||
// Set theme-color value before page transition
|
||||
// to avoid navigation bar color flickering in Android dark mode
|
||||
document.addEventListener("astro:before-swap", event => {
|
||||
const bgColor = document
|
||||
.querySelector("meta[name='theme-color']")
|
||||
?.getAttribute("content");
|
||||
|
||||
event.newDocument
|
||||
.querySelector("meta[name='theme-color']")
|
||||
?.setAttribute("content", bgColor);
|
||||
});
|
||||
|
||||
// sync with system changes
|
||||
window
|
||||
.matchMedia("(prefers-color-scheme: dark)")
|
||||
|
||||
Reference in New Issue
Block a user