diff --git a/App.vue b/App.vue index 388ac50..19cfc5e 100644 --- a/App.vue +++ b/App.vue @@ -26,12 +26,12 @@ export default { console.log('App Hide') }, methods: { - // 初始化并应用日夜主题 + // 初始化并应用深色主题 initTheme() { const theme = getCurrentTheme() applyTheme(theme) - // 同步设置page元素背景色 - const bgColor = theme === 'light' ? '#F2F5F9' : '#0B0B14' + // 同步设置page元素背景色(统一深色主题) + const bgColor = '#0B0B14' try { uni.setBackgroundColor({ backgroundColor: bgColor, diff --git a/common/theme-mixin.js b/common/theme-mixin.js index 69e3847..2dcbd7c 100644 --- a/common/theme-mixin.js +++ b/common/theme-mixin.js @@ -1,8 +1,8 @@ /* 碰盏日记 - 主题混入 (Theme Mixin) - * 每个页面混入此mixin,自动在onShow时刷新日夜主题 + * 全局统一深色主题(琥珀夜光),已移除白天主题 * 页面根视图需绑定 :class="themeClass" */ -import { getCurrentTheme, applyTheme } from './utils' +import { applyTheme } from './utils' export default { data() { @@ -19,10 +19,10 @@ export default { }, methods: { _refreshTheme() { - const theme = getCurrentTheme() - this.currentTheme = theme - this.themeClass = theme === 'light' ? 'theme-light' : 'theme-dark' - applyTheme(theme) + // 固定深色主题 + this.currentTheme = 'dark' + this.themeClass = 'theme-dark' + applyTheme('dark') } } } diff --git a/common/utils.js b/common/utils.js index 6c67fc6..1a7800b 100644 --- a/common/utils.js +++ b/common/utils.js @@ -278,13 +278,10 @@ export function calcLocalStreak(records) { } /** - * 主题系统:日夜自动切换 - * 白天:6:00-16:00 → light - * 夜间:16:00-6:00 → dark + * 主题系统:全局统一使用深色主题(琥珀夜光),已移除白天主题 */ export function getCurrentTheme() { - const hour = new Date().getHours() - return (hour >= 6 && hour < 16) ? 'light' : 'dark' + return 'dark' } export function applyTheme(theme) { @@ -296,15 +293,11 @@ export function applyTheme(theme) { } export function applyNavBarTheme(theme) { - const colors = { - dark: { backgroundColor: '#0B0B14', frontColor: '#ffffff' }, - light: { backgroundColor: '#F2F5F9', frontColor: '#000000' } - } - const c = colors[theme] || colors.dark + // 仅深色主题 try { uni.setNavigationBarColor({ - frontColor: c.frontColor, - backgroundColor: c.backgroundColor, + frontColor: '#ffffff', + backgroundColor: '#0B0B14', animation: { duration: 300, timingFunc: 'easeInOut' } }) } catch (e) {} @@ -336,21 +329,13 @@ export function applyTabBarTheme(theme) { const currentPath = pages[pages.length - 1].route if (!tabBarPages.includes(currentPath)) return - const styles = { - dark: { - color: '#9494AC', - selectedColor: '#E8A838', - backgroundColor: '#151520', - borderStyle: 'black' - }, - light: { - color: '#9BA8BA', - selectedColor: '#E09B2D', - backgroundColor: '#FFFFFF', - borderStyle: 'white' - } + // 仅深色主题 + const s = { + color: '#9494AC', + selectedColor: '#E8A838', + backgroundColor: '#151520', + borderStyle: 'black' } - const s = styles[theme] || styles.dark try { uni.setTabBarStyle({ color: s.color, @@ -365,19 +350,19 @@ export function applyTabBarTheme(theme) { } export function getThemeColors(theme) { - const isDark = theme !== 'light' + // 仅保留深色主题色值(参数保留以兼容既有调用) return { - textPrimary: isDark ? '#FFFFFF' : '#16233C', - textSecondary: isDark ? '#C0C0D2' : '#5D6B82', - textTertiary: isDark ? '#9494AC' : '#9BA8BA', - amber: isDark ? '#E8A838' : '#E09B2D', - bgBase: isDark ? '#0B0B14' : '#F2F5F9', - bgCard: isDark ? '#1A1A28' : '#FFFFFF', - cardGradStart: isDark ? '#1A1510' : '#F8FAFD', - cardGradEnd: isDark ? '#0D0B08' : '#EFF3F9', - borderSubtle: isDark ? 'rgba(232,168,56,0.15)' : 'rgba(224,155,45,0.18)', - bgPlaceholder: isDark ? 'rgba(255,255,255,0.03)' : 'rgba(22,40,70,0.04)', - emojiBg: isDark ? 'rgba(232,168,56,0.08)' : 'rgba(224,155,45,0.10)' + textPrimary: '#FFFFFF', + textSecondary: '#C0C0D2', + textTertiary: '#9494AC', + amber: '#E8A838', + bgBase: '#0B0B14', + bgCard: '#1A1A28', + cardGradStart: '#1A1510', + cardGradEnd: '#0D0B08', + borderSubtle: 'rgba(232,168,56,0.15)', + bgPlaceholder: 'rgba(255,255,255,0.03)', + emojiBg: 'rgba(232,168,56,0.08)' } } diff --git a/pages/index/index.vue b/pages/index/index.vue index 3f398ce..d2816a1 100644 --- a/pages/index/index.vue +++ b/pages/index/index.vue @@ -697,7 +697,7 @@ export default { padding: $sp-md $sp-xl $sp-xl; color: $text-primary; border-radius: $radius-xl; - /* 背景层次:底部卡片色 + 顶部琥珀光晕,日夜主题自适应 */ + /* 背景层次:底部卡片色 + 顶部琥珀光晕 */ background: radial-gradient(120% 60% at 50% 0%, var(--amber-glow, rgba(232, 168, 56, 0.15)) 0%, transparent 60%), linear-gradient(180deg, var(--bg-elevated, #28283E) 0%, var(--bg-card, #1A1A28) 55%); diff --git a/uni.scss b/uni.scss index 52d352d..19221e1 100644 --- a/uni.scss +++ b/uni.scss @@ -1,7 +1,7 @@ /* ========================================== * 碰盏日记 - 设计令牌 (Design Tokens) * 设计概念: 琥珀夜光 Amber Night / 暖白琥珀 Warm Day - * 支持日夜主题自动切换 + * 全局统一深色主题(琥珀夜光) * ========================================== */ /* --- 夜间主题(默认)--- */ @@ -51,53 +51,6 @@ page, .theme-dark { --tab-bar-color: #9494AC; } -/* --- 白天主题(清透玻璃感 Crystal Day)--- */ -.theme-light { - --bg-base: #F2F5F9; - --bg-card: #FFFFFF; - --bg-card-alt: #EEF2F7; - --bg-elevated: #E4EAF2; - - --amber: #E09B2D; - --amber-light: #F2B84B; - --amber-deep: #C67F15; - --amber-glow: rgba(224, 155, 45, 0.10); - - --coral: #F0655A; - --mint: #34B88C; - --lavender: #7C82A8; - - --text-primary: #16233C; - --text-secondary: #5D6B82; - --text-tertiary: #9BA8BA; - --text-on-amber: #FFFFFF; - - --border-subtle: rgba(22, 40, 70, 0.08); - --border-faint: rgba(22, 40, 70, 0.06); - --border-micro: rgba(22, 40, 70, 0.04); - --border-dashed: rgba(22, 40, 70, 0.12); - --border-active: rgba(22, 40, 70, 0.10); - --divider-color: rgba(22, 40, 70, 0.06); - --bg-subtle: rgba(22, 40, 70, 0.02); - --bg-hover: rgba(22, 40, 70, 0.04); - --bg-input: rgba(22, 40, 70, 0.04); - --btn-shimmer: rgba(255, 255, 255, 0.45); - --overlay-mask: rgba(10, 20, 40, 0.4); - --overlay-modal: rgba(10, 20, 40, 0.5); - - --shadow-sm: 0 4rpx 16rpx rgba(30, 60, 110, 0.07); - --shadow-md: 0 8rpx 32rpx rgba(30, 60, 110, 0.10); - --shadow-amber: 0 8rpx 32rpx rgba(224, 155, 45, 0.22); - --shadow-lg: 0 16rpx 48rpx rgba(30, 60, 110, 0.14); - - --card-gradient-start: #F8FAFD; - --card-gradient-end: #EFF3F9; - --nav-bar-bg: #F2F5F9; - --nav-bar-text: black; - --tab-bar-bg: #FFFFFF; - --tab-bar-color: #9BA8BA; -} - /* --- 色彩系统(SCSS变量桥接到CSS变量,含暗色回退值)--- */ $bg-base: var(--bg-base, #0B0B14); $bg-card: var(--bg-card, #1A1A28);