Qihan/MyBlog-Next
1
0
Fork 0
mirror of https://github.com/ChenQihan666/MyBlog-Next.git synced 2026-08-14 11:29:33 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: navigation flicker on Android when in dark mode (#494)

Browse Source 
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:
resomi
2025-06-10 09:43:11 +08:00
committed by GitHub
parent 0cc647c3d3
commit 77709ab7c0
1 changed files with 12 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/toggle-theme.js
+12
View File
@@ -67,6 +67,18 @@ window.onload = () => {
document.addEventListener("astro:after-swap", setThemeFeature); 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 // sync with system changes
window window
.matchMedia("(prefers-color-scheme: dark)") .matchMedia("(prefers-color-scheme: dark)")