mirror of
https://github.com/qingchencloud/clawpanel.git
synced 2026-05-30 12:50:14 +08:00
feat: 添加日间/夜间主题切换系统
- 新增 theme.js 主题管理模块(localStorage 持久化) - variables.css 重构为亮色默认 + 暗色 data-theme 切换 - sidebar 底部添加主题切换按钮(sun/moon SVG 图标) - 修复 scrollbar 硬编码颜色为 CSS 变量 - 修复 agents.js fallbacks 未定义时的空指针错误
This commit is contained in:
26
src/lib/theme.js
Normal file
26
src/lib/theme.js
Normal file
@@ -0,0 +1,26 @@
|
||||
/**
|
||||
* 主题管理(日间/夜间模式)
|
||||
*/
|
||||
const THEME_KEY = 'clawpanel-theme'
|
||||
|
||||
export function initTheme() {
|
||||
const saved = localStorage.getItem(THEME_KEY)
|
||||
const theme = saved || (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')
|
||||
applyTheme(theme)
|
||||
}
|
||||
|
||||
export function toggleTheme() {
|
||||
const current = document.documentElement.dataset.theme || 'light'
|
||||
const next = current === 'dark' ? 'light' : 'dark'
|
||||
applyTheme(next)
|
||||
return next
|
||||
}
|
||||
|
||||
export function getTheme() {
|
||||
return document.documentElement.dataset.theme || 'light'
|
||||
}
|
||||
|
||||
function applyTheme(theme) {
|
||||
document.documentElement.dataset.theme = theme
|
||||
localStorage.setItem(THEME_KEY, theme)
|
||||
}
|
||||
Reference in New Issue
Block a user