diff --git a/app/components/home.tsx b/app/components/home.tsx
index cbb5dbfc..66f86348 100644
--- a/app/components/home.tsx
+++ b/app/components/home.tsx
@@ -52,11 +52,23 @@ function useSwitchTheme() {
document.body.classList.add("light");
}
- const themeColor = getComputedStyle(document.body)
- .getPropertyValue("--theme-color")
- .trim();
- const metaDescription = document.querySelector('meta[name="theme-color"]');
- metaDescription?.setAttribute("content", themeColor);
+ const metaDescriptionDark = document.querySelector(
+ 'meta[name="theme-color"][media]',
+ );
+ const metaDescriptionLight = document.querySelector(
+ 'meta[name="theme-color"]:not([media])',
+ );
+
+ if (config.theme === "auto") {
+ metaDescriptionDark?.setAttribute("content", "#151515");
+ metaDescriptionLight?.setAttribute("content", "#fafafa");
+ } else {
+ const themeColor = getComputedStyle(document.body)
+ .getPropertyValue("--theme-color")
+ .trim();
+ metaDescriptionDark?.setAttribute("content", themeColor);
+ metaDescriptionLight?.setAttribute("content", themeColor);
+ }
}, [config.theme]);
}
diff --git a/app/layout.tsx b/app/layout.tsx
index 6b6999f8..49a6d644 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -21,7 +21,7 @@ export const metadata = {
description: "Your personal ChatGPT Chat Bot.",
appleWebApp: {
title: "ChatGPT Next Web",
- statusBarStyle: "black-translucent",
+ statusBarStyle: "default",
},
themeColor: "#fafafa",
};
@@ -53,6 +53,11 @@ export default function RootLayout({
name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
/>
+