Possible fix for dark mode not working on Safari PWA

cheeaun · Sep 15, 2023 · 84044b4 · 84044b4
1 parent c2ac5a6
commit 84044b4
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 6 deletions.
diff --git a/index.html b/index.html
@@ -8,6 +8,8 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta name="mobile-web-app-capable" content="yes">
 <meta name="color-scheme" id="meta-color-scheme" content="dark light">
+<meta name="theme-color" content="#fff" media="(prefers-color-scheme: light)">
+<meta name="theme-color" content="#121212" media="(prefers-color-scheme: dark)">
 <link rel="shortcut icon" href="icons/favicon.ico">
 <link rel="shortcut icon" sizes="196x196" href="icons/icon-196.png">
 <link rel="apple-touch-icon-precomposed" href="icons/icon-180.png">

diff --git a/manifest.json b/manifest.json
@@ -2,12 +2,14 @@
   "name": "HackerWeb",
   "short_name": "HackerWeb",
   "description": "A simply readable Hacker News app.",
-  "icons": [{
-    "src": "icons/icon.svg",
-    "sizes": "144x144",
-    "type": "image/svg+xml"
-  }],
+  "icons": [
+    {
+      "src": "icons/icon.svg",
+      "sizes": "144x144",
+      "type": "image/svg+xml"
+    }
+  ],
   "start_url": ".",
   "display": "standalone",
-  "background_color": "#fff"
+  "theme_color": "#fff"
 }