quicknotes/frontend/src/lib/theme.ts

21 lines
684 B
TypeScript

import { writable } from 'svelte/store';
// Check if user prefers dark mode
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
// Check stored preference
const storedTheme = localStorage.getItem('theme');
// Initialize theme store
export const isDarkMode = writable(storedTheme === 'dark' || (storedTheme === null && prefersDark));
// Subscribe to changes and update localStorage and body class
isDarkMode.subscribe((dark) => {
if (typeof window !== 'undefined') {
localStorage.setItem('theme', dark ? 'dark' : 'light');
if (dark) {
document.body.classList.add('dark-mode');
} else {
document.body.classList.remove('dark-mode');
}
}
});