20 lines
687 B
TypeScript
20 lines
687 B
TypeScript
import { computed, ref } from 'vue'
|
|
|
|
const key = 'vdi.theme'
|
|
const saved = (() => { try { return localStorage.getItem(key) } catch { return null } })()
|
|
const theme = ref<'dark' | 'light'>(saved === 'light' ? 'light' : 'dark')
|
|
function apply() {
|
|
document.documentElement.dataset.theme = theme.value
|
|
document.documentElement.style.colorScheme = theme.value
|
|
}
|
|
apply()
|
|
export function useTheme() {
|
|
const dark = computed(() => theme.value === 'dark')
|
|
function toggle() {
|
|
theme.value = dark.value ? 'light' : 'dark'
|
|
apply()
|
|
try { localStorage.setItem(key, theme.value) } catch { /* The theme still works without browser storage. */ }
|
|
}
|
|
return { theme, dark, toggle }
|
|
}
|