From c3ee2da33c66227b9eb6569a4a1d9483a7e22579 Mon Sep 17 00:00:00 2001
From: Amir Raminfar <findamir@gmail.com>
Date: Sun, 16 Mar 2025 16:38:43 -0700
Subject: [PATCH] fix: fixes theme color in dark and light mode (#3706)

---
 assets/App.vue              | 1 +
 public/index.html           | 1 +
 public/manifest.webmanifest | 2 --
 3 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/assets/App.vue b/assets/App.vue
index d7eda8da..65002c51 100644
--- a/assets/App.vue
+++ b/assets/App.vue
@@ -15,6 +15,7 @@ watchEffect(() => {
   if (theme === "auto") {
     theme = mode.value;
   }
+  document.querySelector('meta[name="theme-color"]')?.setAttribute("content", theme == "dark" ? "#121212" : "#3FA68F");
   document.documentElement.setAttribute("data-theme", theme);
 });
 </script>
diff --git a/public/index.html b/public/index.html
index a70ed489..048a087e 100644
--- a/public/index.html
+++ b/public/index.html
@@ -5,6 +5,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover" />
     <meta name="mobile-web-app-capable" content="yes" />
     <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+    <meta name="theme-color" content="" />
     <title>Dozzle</title>
     <script type="application/json" id="config__json">
       {{ marshal .Config }}
diff --git a/public/manifest.webmanifest b/public/manifest.webmanifest
index ba9e8e10..d0538e73 100644
--- a/public/manifest.webmanifest
+++ b/public/manifest.webmanifest
@@ -3,10 +3,8 @@
   "short_name": "Dozzle",
   "start_url": "/",
   "display": "standalone",
-  "background_color": "#000",
   "lang": "en",
   "scope": "/",
   "description": "A log viewer for containers",
-  "theme_color": "#000",
   "icons": [{ "src": "/apple-touch-icon.png", "sizes": "512x512", "type": "image/png" }]
 }