https://www.motoverte.com/wp-content/themes/nicolas/js/modules/theme-switcher.js

1export function initThemeSwitcher() {
2    const switchButton = document.querySelector('.js-switcher');
3    
4    if (!switchButton) return;
5
6    // Vérifier si le switch doit être désactivé via la classe "is-dark-only" sur le body
7    const isSwitchDisabled = document.body.classList.contains('is-dark-only');
8    
9    if (isSwitchDisabled) {
10        // Forcer le thème dark SANS le sauvegarder dans localStorage
11        document.documentElement.setAttribute('data-theme', 'dark');
12        switchButton.style.display = 'none';
13        return;
14    }
15
16    // Charger le thème sauvegardé ou utiliser 'light' par défaut
17    const savedTheme = localStorage.getItem('theme') || 'light';
18    document.documentElement.setAttribute('data-theme', savedTheme);
19    
20    // Synchroniser l'état visuel du bouton avec le thème chargé
21    if (savedTheme === 'dark') {
22        switchButton.classList.add('is-active');
23    }
24
25    // Gérer le clic
26    switchButton.addEventListener('click', () => {
27        const currentTheme = document.documentElement.getAttribute('data-theme');
28        const newTheme = currentTheme === 'light' ? 'dark' : 'light';
29        switchButton.classList.toggle('is-active');
30        
31        document.documentElement.setAttribute('data-theme', newTheme);
32        localStorage.setItem('theme', newTheme);
33    });
34}