From c1d19b854b20831b1f902cc5063828df0c0a1f0b Mon Sep 17 00:00:00 2001
From: CH-122 <1521930938@qq.com>
Date: Fri, 15 Aug 2025 14:52:30 +0800
Subject: [PATCH 1/4] =?UTF-8?q?fix:=20=E6=89=8B=E6=9C=BA=E7=8A=B6=E6=80=81?=
 =?UTF-8?q?=E6=A0=8F=E6=9A=97=E9=BB=91=E6=A8=A1=E5=BC=8F=E8=83=8C=E6=99=AF?=
 =?UTF-8?q?=E9=A2=9C=E8=89=B2=E6=98=BE=E7=A4=BA=E4=B8=8D=E6=AD=A3=E7=A1=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend_nuxt/nuxt.config.ts | 23 ++++++++++++++++++++++-
 frontend_nuxt/utils/theme.js | 23 +++++++++++++++++++++++
 2 files changed, 45 insertions(+), 1 deletion(-)

diff --git a/frontend_nuxt/nuxt.config.ts b/frontend_nuxt/nuxt.config.ts
index 3c680c484..e11a587a9 100644
--- a/frontend_nuxt/nuxt.config.ts
+++ b/frontend_nuxt/nuxt.config.ts
@@ -26,7 +26,28 @@ export default defineNuxtConfig({
                 const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
                 const theme = mode === 'dark' || mode === 'light' ? mode : (prefersDark ? 'dark' : 'light');
                 document.documentElement.dataset.theme = theme;
-              } catch (e) {}
+
+                
+                let themeColor = '#fff';
+                if (theme === 'dark') {
+                  themeColor = '#333';
+                } else {
+                  themeColor = '#ffffff';
+                }
+                
+                const androidMeta = document.createElement('meta');
+                androidMeta.name = 'theme-color';
+                androidMeta.content = themeColor;
+                
+                const iosMeta = document.createElement('meta');
+                iosMeta.name = 'apple-mobile-web-app-status-bar-style';
+                iosMeta.content = themeColor;
+                
+                document.head.appendChild(androidMeta);
+                document.head.appendChild(iosMeta);
+              } catch (e) {
+                console.warn('Theme initialization failed:', e);
+              }
             })();
           `,
         },
diff --git a/frontend_nuxt/utils/theme.js b/frontend_nuxt/utils/theme.js
index d27fbc223..816fbe987 100644
--- a/frontend_nuxt/utils/theme.js
+++ b/frontend_nuxt/utils/theme.js
@@ -24,6 +24,29 @@ function apply(mode) {
       : mode
   if (root.dataset.theme === newMode) return
   root.dataset.theme = newMode
+  
+  // 更新 meta 标签
+  const androidMeta = document.querySelector('meta[name="theme-color"]')
+  const iosMeta = document.querySelector('meta[name="apple-mobile-web-app-status-bar-style"]')
+  const themeColor = getComputedStyle(document.documentElement).getPropertyValue('--background-color').trim();
+
+  if (androidMeta) {
+    androidMeta.content = themeColor
+  } else {
+    const newAndroidMeta = document.createElement('meta')
+    newAndroidMeta.name = 'theme-color'
+    newAndroidMeta.content = themeColor
+    document.head.appendChild(newAndroidMeta)
+  }
+  
+  if (iosMeta) {
+    iosMeta.content = themeColor
+  } else {
+    const newIosMeta = document.createElement('meta')
+    newIosMeta.name = 'apple-mobile-web-app-status-bar-style'
+    newIosMeta.content = themeColor
+    document.head.appendChild(newIosMeta)
+  }
 }
 
 export function initTheme() {

From b26891261cb300266679dee0160f71d818b340b8 Mon Sep 17 00:00:00 2001
From: CH-122 <1521930938@qq.com>
Date: Fri, 15 Aug 2025 15:23:49 +0800
Subject: [PATCH 2/4] =?UTF-8?q?fix:=20=E9=80=82=E9=85=8D=20ios=20safari=20?=
 =?UTF-8?q?=E6=B5=8F=E8=A7=88=E5=99=A8=E6=9A=97=E9=BB=91=E6=A8=A1=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend_nuxt/nuxt.config.ts | 7 +++++--
 frontend_nuxt/utils/theme.js | 5 +++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/frontend_nuxt/nuxt.config.ts b/frontend_nuxt/nuxt.config.ts
index e11a587a9..66a0afb71 100644
--- a/frontend_nuxt/nuxt.config.ts
+++ b/frontend_nuxt/nuxt.config.ts
@@ -29,10 +29,13 @@ export default defineNuxtConfig({
 
                 
                 let themeColor = '#fff';
+                let themeStatus = 'default';
                 if (theme === 'dark') {
                   themeColor = '#333';
+                  themeStatus = 'black-translucent';
                 } else {
                   themeColor = '#ffffff';
+                  themeStatus = 'default';
                 }
                 
                 const androidMeta = document.createElement('meta');
@@ -41,8 +44,8 @@ export default defineNuxtConfig({
                 
                 const iosMeta = document.createElement('meta');
                 iosMeta.name = 'apple-mobile-web-app-status-bar-style';
-                iosMeta.content = themeColor;
-                
+                iosMeta.content = themeStatus;
+
                 document.head.appendChild(androidMeta);
                 document.head.appendChild(iosMeta);
               } catch (e) {
diff --git a/frontend_nuxt/utils/theme.js b/frontend_nuxt/utils/theme.js
index 816fbe987..8f6206436 100644
--- a/frontend_nuxt/utils/theme.js
+++ b/frontend_nuxt/utils/theme.js
@@ -29,6 +29,7 @@ function apply(mode) {
   const androidMeta = document.querySelector('meta[name="theme-color"]')
   const iosMeta = document.querySelector('meta[name="apple-mobile-web-app-status-bar-style"]')
   const themeColor = getComputedStyle(document.documentElement).getPropertyValue('--background-color').trim();
+  const themeStatus = newMode === 'dark' ? 'black-translucent' : 'default'
 
   if (androidMeta) {
     androidMeta.content = themeColor
@@ -40,11 +41,11 @@ function apply(mode) {
   }
   
   if (iosMeta) {
-    iosMeta.content = themeColor
+    iosMeta.content = themeStatus
   } else {
     const newIosMeta = document.createElement('meta')
     newIosMeta.name = 'apple-mobile-web-app-status-bar-style'
-    newIosMeta.content = themeColor
+    newIosMeta.content = themeStatus
     document.head.appendChild(newIosMeta)
   }
 }

From 00d3c563e2e62eb4833873e851afceb3aab4dbec Mon Sep 17 00:00:00 2001
From: CH-122 <1521930938@qq.com>
Date: Fri, 15 Aug 2025 15:36:25 +0800
Subject: [PATCH 3/4] =?UTF-8?q?feat:=20=E7=A7=BB=E5=8A=A8=E7=AB=AF=20heade?=
 =?UTF-8?q?r=20=E4=B8=AD=E6=B7=BB=E5=8A=A0=E4=B8=BB=E9=A2=98=E5=88=87?=
 =?UTF-8?q?=E6=8D=A2=E5=9B=BE=E6=A0=87,=20=E8=8F=9C=E5=8D=95=E4=B8=AD?=
 =?UTF-8?q?=E9=9A=90=E8=97=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend_nuxt/components/HeaderComponent.vue | 20 +++++++++++++++++++-
 frontend_nuxt/components/MenuComponent.vue   |  5 ++++-
 2 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/frontend_nuxt/components/HeaderComponent.vue b/frontend_nuxt/components/HeaderComponent.vue
index 46a858c0a..f28810f0f 100644
--- a/frontend_nuxt/components/HeaderComponent.vue
+++ b/frontend_nuxt/components/HeaderComponent.vue
@@ -25,6 +25,10 @@
             <i class="fas fa-search"></i>
           </div>
 
+          <div v-if="isMobile" class="theme-icon" @click="cycleTheme">
+            <i :class="iconClass"></i>
+          </div>
+
           <ToolTip v-if="!isMobile" content="发帖" placement="bottom">
             <div class="new-post-icon" @click="goToNewPost">
               <i class="fas fa-edit"></i>
@@ -64,6 +68,8 @@ import SearchDropdown from '~/components/SearchDropdown.vue'
 import { authState, clearToken, loadCurrentUser } from '~/utils/auth'
 import { fetchUnreadCount, notificationState } from '~/utils/notification'
 import { useIsMobile } from '~/utils/screen'
+import { themeState, cycleTheme, ThemeMode } from '~/utils/theme'
+
 const props = defineProps({
   showMenuBtn: {
     type: Boolean,
@@ -136,6 +142,18 @@ const headerMenuItems = computed(() => [
   { text: '退出', onClick: goToLogout },
 ])
 
+ /** 其余逻辑保持不变 */
+ const iconClass = computed(() => {
+   switch (themeState.mode) {
+     case ThemeMode.DARK:
+       return 'fas fa-moon'
+     case ThemeMode.LIGHT:
+       return 'fas fa-sun'
+     default:
+       return 'fas fa-desktop'
+   }
+ })
+
 onMounted(async () => {
   const updateAvatar = async () => {
     if (authState.loggedIn) {
@@ -287,7 +305,7 @@ onMounted(async () => {
   background-color: var(--menu-selected-background-color);
 }
 
-.search-icon {
+.search-icon, .theme-icon {
   font-size: 18px;
   cursor: pointer;
 }
diff --git a/frontend_nuxt/components/MenuComponent.vue b/frontend_nuxt/components/MenuComponent.vue
index c82ed43a2..883b3ee06 100644
--- a/frontend_nuxt/components/MenuComponent.vue
+++ b/frontend_nuxt/components/MenuComponent.vue
@@ -117,7 +117,7 @@
       </div>
       
       <!-- 解决动态样式的水合错误 -->
-      <ClientOnly>
+      <ClientOnly v-if='!isMobile'>
         <div class="menu-footer">
           <div class="menu-footer-btn" @click="cycleTheme">
             <i :class="iconClass"></i>
@@ -133,6 +133,9 @@ import { ref, computed, watch, onMounted } from 'vue'
 import { themeState, cycleTheme, ThemeMode } from '~/utils/theme'
 import { authState } from '~/utils/auth'
 import { fetchUnreadCount, notificationState } from '~/utils/notification'
+import { useIsMobile } from '~/utils/screen'
+
+const isMobile = useIsMobile()
 
 const config = useRuntimeConfig()
 const API_BASE_URL = config.public.apiBaseUrl

From 2b824d94f249273955dcd1d5261725408fec2dc8 Mon Sep 17 00:00:00 2001
From: CH-122 <1521930938@qq.com>
Date: Fri, 15 Aug 2025 15:47:24 +0800
Subject: [PATCH 4/4] =?UTF-8?q?fix:=20=E6=9B=B4=E6=96=B0=E6=96=B0=E5=A2=9E?=
 =?UTF-8?q?=E5=B8=96=E5=AD=90=E5=9B=BE=E6=A0=87=E7=B1=BB=E5=90=8D=E5=B9=B6?=
 =?UTF-8?q?=E8=B0=83=E6=95=B4=E6=A0=B7=E5=BC=8F=E4=BD=9C=E7=94=A8=E5=9F=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend_nuxt/app.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend_nuxt/app.vue b/frontend_nuxt/app.vue
index 2c5100e78..8619cb22b 100644
--- a/frontend_nuxt/app.vue
+++ b/frontend_nuxt/app.vue
@@ -16,7 +16,7 @@
         <NuxtPage keepalive />
       </div>
 
-      <div v-if="showNewPostIcon && isMobile" class="new-post-icon" @click="goToNewPost">
+      <div v-if="showNewPostIcon && isMobile" class="app-new-post-icon" @click="goToNewPost">
         <i class="fas fa-edit"></i>
       </div>
     </div>
@@ -74,7 +74,7 @@ const goToNewPost = () => {
 </script>
 
 <style src="~/assets/global.css"></style>
-<style scoped>
+<style>
 .header-container {
   position: fixed;
   top: 0;
@@ -107,7 +107,7 @@ const goToNewPost = () => {
   margin: 0 auto;
 }
 
-.new-post-icon {
+.app-new-post-icon {
   background-color: var(--new-post-icon-color);
   color: white;
   width: 60px;