Frederik Spirgi
32 lines
1.2 KiB
JavaScript
32 lines
1.2 KiB
JavaScript
const darkModeToggle = document.getElementById('dark-mode-toggle');
|
|
const themeIcon = darkModeToggle.querySelector('.theme-icon');
|
|
const themeLabel = darkModeToggle.querySelector('.theme-label');
|
|
|
|
function applyTheme(isDark) {
|
|
document.body.classList.toggle('dark-mode', isDark);
|
|
darkModeToggle.setAttribute('aria-pressed', String(isDark));
|
|
themeIcon.textContent = isDark ? '☀' : '☾';
|
|
themeLabel.textContent = isDark ? 'Light mode' : 'Dark mode';
|
|
document.querySelector('meta[name="theme-color"]').content = isDark ? '#0d1828' : '#e9f3fb';
|
|
window.dispatchEvent(new Event('themechange'));
|
|
}
|
|
|
|
let savedTheme;
|
|
try {
|
|
savedTheme = localStorage.getItem('darkMode');
|
|
} catch {
|
|
savedTheme = null;
|
|
}
|
|
|
|
applyTheme(savedTheme === 'enabled' || (savedTheme === null && window.matchMedia('(prefers-color-scheme: dark)').matches));
|
|
|
|
darkModeToggle.addEventListener('click', () => {
|
|
const isDark = !document.body.classList.contains('dark-mode');
|
|
applyTheme(isDark);
|
|
try {
|
|
localStorage.setItem('darkMode', isDark ? 'enabled' : 'disabled');
|
|
} catch {
|
|
// The chosen theme remains active for this visit when storage is unavailable.
|
|
}
|
|
});
|