forked from AxTps/Starlight_Lancher
24 lines
714 B
TypeScript
24 lines
714 B
TypeScript
export type ThemeMode = 'light' | 'dark' | 'system'
|
|
|
|
export function useTheme() {
|
|
const mode = useState<ThemeMode>('theme-mode', () => 'system')
|
|
|
|
function apply(value: ThemeMode): void {
|
|
if (!import.meta.client) return
|
|
const dark =
|
|
value === 'dark' ||
|
|
(value === 'system' && window.matchMedia('(prefers-color-scheme: dark)').matches)
|
|
document.documentElement.classList.toggle('dark', dark)
|
|
localStorage.setItem('telemetry-admin-theme', value)
|
|
}
|
|
|
|
onMounted(() => {
|
|
const saved = localStorage.getItem('telemetry-admin-theme') as ThemeMode | null
|
|
if (saved === 'light' || saved === 'dark' || saved === 'system') mode.value = saved
|
|
apply(mode.value)
|
|
})
|
|
|
|
watch(mode, apply)
|
|
return { mode }
|
|
}
|