|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
|
|
|
const themeToggle = document.getElementById('theme-toggle'); |
|
|
const htmlElement = document.documentElement; |
|
|
|
|
|
|
|
|
if (localStorage.getItem('theme') === 'dark' || |
|
|
(!localStorage.getItem('theme') && window.matchMedia('(prefers-color-scheme: dark)').matches)) { |
|
|
htmlElement.classList.add('dark'); |
|
|
} else { |
|
|
htmlElement.classList.remove('dark'); |
|
|
} |
|
|
|
|
|
themeToggle.addEventListener('click', function() { |
|
|
htmlElement.classList.toggle('dark'); |
|
|
localStorage.setItem('theme', htmlElement.classList.contains('dark') ? 'dark' : 'light'); |
|
|
feather.replace(); |
|
|
}); |
|
|
|
|
|
|
|
|
const observer = new MutationObserver(function(mutations) { |
|
|
mutations.forEach(function(mutation) { |
|
|
if (mutation.attributeName === 'class') { |
|
|
feather.replace(); |
|
|
} |
|
|
}); |
|
|
}); |
|
|
|
|
|
observer.observe(htmlElement, { |
|
|
attributes: true |
|
|
}); |
|
|
|
|
|
|
|
|
const buttons = document.querySelectorAll('button'); |
|
|
buttons.forEach(button => { |
|
|
if (button.querySelector('[data-feather]')) { |
|
|
const icon = button.querySelector('[data-feather]'); |
|
|
const iconName = icon.getAttribute('data-feather'); |
|
|
button.setAttribute('title', iconName.charAt(0).toUpperCase() + iconName.slice(1)); |
|
|
} |
|
|
}); |
|
|
}); |