|
|
|
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
const themeToggle = document.getElementById('theme-toggle'); |
|
|
const themeIcon = document.getElementById('theme-icon'); |
|
|
|
|
|
|
|
|
const savedTheme = localStorage.getItem('theme') || |
|
|
(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'); |
|
|
|
|
|
|
|
|
if (savedTheme === 'dark') { |
|
|
document.documentElement.classList.add('dark'); |
|
|
themeIcon.dataset.feather = 'moon'; |
|
|
} else { |
|
|
document.documentElement.classList.remove('dark'); |
|
|
themeIcon.dataset.feather = 'sun'; |
|
|
} |
|
|
|
|
|
|
|
|
themeToggle.addEventListener('click', () => { |
|
|
if (document.documentElement.classList.contains('dark')) { |
|
|
document.documentElement.classList.remove('dark'); |
|
|
localStorage.setItem('theme', 'light'); |
|
|
themeIcon.dataset.feather = 'sun'; |
|
|
} else { |
|
|
document.documentElement.classList.add('dark'); |
|
|
localStorage.setItem('theme', 'dark'); |
|
|
themeIcon.dataset.feather = 'moon'; |
|
|
} |
|
|
feather.replace(); |
|
|
}); |
|
|
|
|
|
|
|
|
feather.replace(); |
|
|
}); |