fix(ui): 多项 UI 修复 — 弹窗遮挡/按钮可见性/暗黑闪烁/云函数版本
- 计划编辑弹窗移出 .container 避免 fixed 降级 + 修复滚动 - dock bottom 40rpx→8rpx 紧贴底部, sheet padding 同步调整 - 计划编辑器取消/恢复默认按钮可见性修复(bg 匹配容器) - ui-btn--danger 按钮可见性修复 - 清除确认弹窗跟随暗黑模式切换 - icons.js build() 中 Fill 路径覆盖 outlined 路径修复 - plan.js getPlanDay 忽略 customPlans 修复 - darkMode.js 冗余三元简化 - util.js fileToDataURI fallback 可读性提升 - theme.js: BASE_VARS 与 getThemeStyle 统一来源, 去 50ms navbar 延迟 - app.wxss: 移除 page transition 和 background-color 减少闪白 - 云函数 wx-server-sdk 版本统一 ~2.6.3, tts cloud.init 一致化 - 闪白问题: wx.setBackgroundColor 三层防护(onLaunch/applyThemeToPage/switchTab) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
+28
-12
@@ -41,10 +41,12 @@ const THEMES = [
|
||||
}
|
||||
]
|
||||
|
||||
const BASE_VARS = '--text:#333;--text-secondary:#999;--bg:#F5F5F5;--card-bg:#FFFFFF;--border:#EEE;--success:#4CAF50;--success-rgb:76,175,80;--danger:#E53935;--danger-rgb:229,57,53;--primary:#FF6B35;--primary-light:#FF8C5A;--primary-bg:#FFF3ED;--primary-rgb:255,107,53;'
|
||||
// Light-mode base CSS custom properties shared between the cold-start export
|
||||
// (used by every page as initial data) and getThemeStyle(isDark=false).
|
||||
// Update here ONLY — getThemeStyle picks it up for the light branch.
|
||||
const BASE_VARS = '--text:#333333;--text-secondary:#999999;--bg:#F5F5F5;--bg-gradient-start:#F5F5F5;--bg-gradient-end:#FAFAFA;--card-bg:#FFFFFF;--bg-soft:#F0F0F0;--border:#EEEEEE;--success:#4CAF50;--success-rgb:76,175,80;--danger:#E53935;--danger-rgb:229,57,53;'
|
||||
const DEFAULT_THEME_ID = 'orange'
|
||||
const THEME_KEY = 'app_theme'
|
||||
let _navColorTimer = null
|
||||
|
||||
const getThemeById = (id) => THEMES.find(t => t.id === id) || THEMES[0]
|
||||
|
||||
@@ -61,15 +63,12 @@ const getCurrentTheme = () => {
|
||||
}
|
||||
|
||||
const _setNavBarColor = (primary) => {
|
||||
if (_navColorTimer) clearTimeout(_navColorTimer)
|
||||
_navColorTimer = setTimeout(() => {
|
||||
try {
|
||||
wx.setNavigationBarColor({
|
||||
frontColor: '#ffffff',
|
||||
backgroundColor: primary
|
||||
})
|
||||
} catch (e) {}
|
||||
}, 50)
|
||||
try {
|
||||
wx.setNavigationBarColor({
|
||||
frontColor: '#ffffff',
|
||||
backgroundColor: primary
|
||||
})
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
const setTheme = (id) => {
|
||||
@@ -98,7 +97,7 @@ const getThemeStyle = (theme, isDark = false) => {
|
||||
const t = theme || getCurrentTheme()
|
||||
const baseVars = isDark
|
||||
? '--text:#E5E5E7;--text-secondary:#98989F;--bg:#2C2C2E;--bg-gradient-start:#2C2C2E;--bg-gradient-end:#38383A;--card-bg:#3A3A3C;--bg-soft:#48484A;--border:#48484A;--success:#30D158;--success-rgb:48,209,88;--danger:#FF6B6B;--danger-rgb:255,107,107;'
|
||||
: '--text:#333333;--text-secondary:#999999;--bg:#F5F5F5;--bg-gradient-start:#F5F5F5;--bg-gradient-end:#FAFAFA;--card-bg:#FFFFFF;--bg-soft:#F0F0F0;--border:#EEEEEE;--success:#4CAF50;--success-rgb:76,175,80;--danger:#E53935;--danger-rgb:229,57,53;'
|
||||
: BASE_VARS
|
||||
return `${baseVars}--primary:${t.primary};--primary-light:${t.primaryLight};--primary-bg:${t.primaryBg};--primary-rgb:${t.primaryRgb};`
|
||||
}
|
||||
|
||||
@@ -113,12 +112,29 @@ const applyThemeToPage = (self) => {
|
||||
}
|
||||
self.setData({ theme, themeStyle: nextStyle, isDark })
|
||||
_setNavBarColor(theme.primary)
|
||||
|
||||
// theme.json 的 dark section 只响应系统暗黑模式。用户手动选择暗黑
|
||||
// 但系统是明亮时,窗口背景仍为浅色,切 tab 会闪白。这里用 API 强制设置
|
||||
// 窗口背景,让 tab 切换时的瞬间底色与当前模式一致。
|
||||
const bg = isDark ? '#0F0F12' : '#F5F5F5'
|
||||
try { wx.setBackgroundColor({ backgroundColor: bg, backgroundColorTop: bg, backgroundColorBottom: bg }) } catch (e) {}
|
||||
}
|
||||
|
||||
/** 仅设置窗口背景色,不触发页面 setData — 供 app.js 冷启动使用 */
|
||||
const applyWindowBg = () => {
|
||||
try {
|
||||
const darkMod = require('./darkMode')
|
||||
const isDark = darkMod.getInitialDarkMode()
|
||||
const bg = isDark ? '#0F0F12' : '#F5F5F5'
|
||||
wx.setBackgroundColor({ backgroundColor: bg, backgroundColorTop: bg, backgroundColorBottom: bg })
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
THEMES,
|
||||
DEFAULT_THEME_ID,
|
||||
BASE_VARS,
|
||||
applyWindowBg,
|
||||
getThemeById,
|
||||
getCurrentTheme,
|
||||
setTheme,
|
||||
|
||||
Reference in New Issue
Block a user