From 42687350531889907800a3c8b8309d9de52b3c73 Mon Sep 17 00:00:00 2001
From: cnliucheng <brokenway@163.com>
Date: Wed, 8 Jul 2026 11:49:21 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=B7=B1=E8=89=B2=E6=A8=A1=E5=BC=8F?=
 =?UTF-8?q?=E4=B8=8B=E9=A1=B5=E9=9D=A2=E5=BA=95=E8=89=B2=E4=B8=8D=E6=AD=A3?=
 =?UTF-8?q?=E7=A1=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

根因: 渐变背景放在 page 元素,渐变变量定义在 page 选择器,
用户手动选深色时 themeStyle 只更新容器 <view> 上的变量,
page 上的渐变变量不变(CSS 变量只能向下继承)。

修复: 渐变移到 .container::before (position: fixed 覆盖视口),
themeStyle 加 --bg-gradient-start/--bg-gradient-end 变量。
---
 app.wxss       | 20 ++++++++++++++++++--
 utils/theme.js |  4 ++--
 2 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/app.wxss b/app.wxss
index 824228d..933547f 100644
--- a/app.wxss
+++ b/app.wxss
@@ -12,13 +12,14 @@ page {
     'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
   font-size: 28rpx;
   color: var(--text);
-  background: linear-gradient(180deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%) !important;
+  background-color: var(--bg);
   transition: background-color 0.3s ease, color 0.3s ease;
 }
 
-/* dark mode overrides */
+/* dark mode overrides (only for system dark mode; user choice goes through themeStyle) */
 @media (prefers-color-scheme: dark) {
   page {
+    --bg: #0F0F12;
     --bg-gradient-start: #0F0F12;
     --bg-gradient-end: #14141A;
   }
@@ -29,6 +30,21 @@ page {
   padding-bottom: calc(134rpx + env(safe-area-inset-bottom));
   min-height: 100vh;
   box-sizing: border-box;
+  position: relative;
+}
+
+/* Viewport-spanning gradient background. Uses vars from inline themeStyle,
+ * so it follows user-selected mode (not just system mode). */
+.container::before {
+  content: '';
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: linear-gradient(180deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
+  z-index: -1;
+  pointer-events: none;
 }
 
 /* Defensive sizing for all SVG icons rendered as <image>.
diff --git a/utils/theme.js b/utils/theme.js
index 67109de..ae9e063 100644
--- a/utils/theme.js
+++ b/utils/theme.js
@@ -97,8 +97,8 @@ const setTheme = (id) => {
 const getThemeStyle = (theme, isDark = false) => {
   const t = theme || getCurrentTheme()
   const baseVars = isDark
-    ? '--text:#E5E5E7;--text-secondary:#98989F;--bg:#0F0F12;--card-bg:#1C1C1E;--border:#2C2C2E;--success:#30D158;'
-    : '--text:#333333;--text-secondary:#999999;--bg:#F5F5F5;--card-bg:#FFFFFF;--border:#EEEEEE;--success:#4CAF50;'
+    ? '--text:#E5E5E7;--text-secondary:#98989F;--bg:#0F0F12;--bg-gradient-start:#0F0F12;--bg-gradient-end:#14141A;--card-bg:#1C1C1E;--border:#2C2C2E;--success:#30D158;'
+    : '--text:#333333;--text-secondary:#999999;--bg:#F5F5F5;--bg-gradient-start:#F5F5F5;--bg-gradient-end:#FAFAFA;--card-bg:#FFFFFF;--border:#EEEEEE;--success:#4CAF50;'
   return `${baseVars}--primary:${t.primary};--primary-light:${t.primaryLight};--primary-bg:${t.primaryBg};--primary-rgb:${t.primaryRgb};`
 }