| 12345678910111213141516171819202122232425262728293031323334 |
- import type { ThemeConfig } from '@/types/theme'
- /**
- * 应用主题
- * @param theme 主题配置
- */
- export function applyTheme(theme: ThemeConfig) {
- const root = document.documentElement
- const colors = theme.colors
- // 设置 Vant 主题变量 (覆盖默认)
- root.style.setProperty('--van-primary-color', colors.primary)
-
- // 如果定义了特定按钮样式
- if (colors.buttonPrimaryBackground) {
- root.style.setProperty('--van-button-primary-background', colors.buttonPrimaryBackground)
- }
- if (colors.buttonPrimaryBorderColor) {
- root.style.setProperty('--van-button-primary-border-color', colors.buttonPrimaryBorderColor)
- }
- // 设置 App 全局变量
- root.style.setProperty('--app-primary-color', colors.primary)
- root.style.setProperty('--app-secondary-color', colors.secondary)
- root.style.setProperty('--app-bg-color', colors.background)
- root.style.setProperty('--app-text-color', colors.text)
-
- // 处理深色模式类名
- if (theme.id === 'dark') {
- document.documentElement.classList.add('dark')
- } else {
- document.documentElement.classList.remove('dark')
- }
- }
|