26 lines
791 B
JavaScript
26 lines
791 B
JavaScript
/**
|
|
* Theme store | 主题状态管理
|
|
* Handles dark/light mode switching
|
|
*/
|
|
import { ref, watch } from 'vue'
|
|
|
|
// Get initial theme from localStorage or system preference | 从本地存储或系统偏好获取初始主题
|
|
const getInitialTheme = () => {
|
|
const stored = localStorage.getItem('theme')
|
|
if (stored) return stored === 'dark'
|
|
return window.matchMedia('(prefers-color-scheme: dark)').matches
|
|
}
|
|
|
|
export const isDark = ref(getInitialTheme())
|
|
|
|
// Watch and apply theme changes | 监听并应用主题变化
|
|
watch(isDark, (value) => {
|
|
document.documentElement.classList.toggle('dark', value)
|
|
localStorage.setItem('theme', value ? 'dark' : 'light')
|
|
}, { immediate: true })
|
|
|
|
// Toggle theme | 切换主题
|
|
export const toggleTheme = () => {
|
|
isDark.value = !isDark.value
|
|
}
|