fix(macos): sync titlebar backgrounds with theme changes

The window and webview backgrounds retain their startup colors when
the resolved theme changes. With Tauri's full-size content view,
these colors affect the native titlebar even after setTheme succeeds.

Synchronize both backgrounds through WebviewWindow.setBackgroundColor
on macOS, reuse the startup palette, and allow both background commands.

Wry commit 1d1b870 implemented macOS background colors through
WKWebView.underPageBackgroundColor. CVR adopted that behavior in
7d29c0c6 (#6318), making the fixed startup colors from 683667f8 (#5637)
effective on macOS.

Closes #8205
Closes #7968
Closes #8272
Closes #8625
Upstream: https://github.com/tauri-apps/wry/commit/1d1b8707665b4638e040dde7a88cd33d77ba2ebc

Co-authored-by: qzda <qinzhidaoa@gmail.com>
Co-authored-by: Vickers Zhu <vickerszhu@163.com>

Changelog.md

@@ -34,6 +34,7 @@
 
 - 修复 macOS TUN 模式下原有 DNS 被清除、关闭后 DNS 未恢复及联网后设置未生效
 - 修复 macOS 断网时误报代理已回退直连，恢复联网后自动重试系统代理
+- 修复 macOS 切换主题后标题栏保留原有深浅色
 
 </details>
 

src-tauri/capabilities/desktop.json

@@ -17,6 +17,8 @@
     "autostart:allow-disable",
     "autostart:allow-is-enabled",
     "core:window:allow-set-theme",
+    "core:window:allow-set-background-color",
+    "core:webview:allow-set-webview-background-color",
     "notification:default",
     "http:default",
     "http:allow-fetch",

src/pages/_layout/hooks/use-custom-theme.ts

@@ -9,6 +9,7 @@ import { useEffect, useMemo } from 'react'
 import { useVerge } from '@/hooks/use-verge'
 import { defaultDarkTheme, defaultTheme } from '@/pages/_theme'
 import { useSetThemeMode, useThemeMode } from '@/services/states'
+import getSystem from '@/utils/get-system'
 
 const CSS_INJECTION_SCOPE_ROOT = '[data-css-injection-root]'
 const CSS_INJECTION_SCOPE_LIMIT =
@@ -139,6 +140,12 @@ export const useCustomTheme = () => {
         console.error(`Failed to set window theme to ${mode}:`, err)
       })
     }
+    if (getSystem() === 'macos' && mode) {
+      const background = mode === 'light' ? defaultTheme : defaultDarkTheme
+      appWindow.setBackgroundColor(background.background_color).catch((err) => {
+        console.error('Failed to set window background:', err)
+      })
+    }
   }, [mode, appWindow, theme_mode])
 
   const theme = useMemo(() => {