Fix android browsers background-color issues by setting theme-color meta (#1063)

2026-02-13 07:57:38 +08:00
parent 1007533349
commit afd4761998
2 changed files with 22 additions and 1 deletions
--- a/index.html
+++ b/index.html
@@ -51,6 +51,16 @@

    if (backgroundColor) {
        document.documentElement.style.backgroundColor = backgroundColor;
+        // android chromium-based browser/pwa background color (e.g. top status bar and navigation bar) will change dynamically based on meta theme-color
+        let themeColorMeta = document.querySelector('meta[name="theme-color"]');
+        if (!themeColorMeta) {
+            themeColorMeta = document.createElement('meta');
+            themeColorMeta.setAttribute('name', 'theme-color');
+            document.head.appendChild(themeColorMeta);
+        }
+        if (themeColorMeta.getAttribute('content') !== backgroundColor) {
+            themeColorMeta.setAttribute('content', backgroundColor);
+        }
    }
 </script>
 <!--