MediaWiki:Common.js: Difference between revisions

From OtherX
Jump to navigation Jump to search
No edit summary
No edit summary
 
Line 6: Line 6:
     // Save user preference in localStorage
     // Save user preference in localStorage
     const isDarkMode = body.classList.contains('dark-mode');
     const isDarkMode = body.classList.contains('dark-mode');
     localStorage.setItem('darkMode', isDarkMode);
     localStorage.setItem('darkMode', isDarkMode ? 'true' : 'false');
}
}


Line 17: Line 17:
         body.classList.add('dark-mode');
         body.classList.add('dark-mode');
     }
     }
});


// Add dark mode toggle to personal tools menu
    // Add dark mode toggle to personal tools menu
document.addEventListener('DOMContentLoaded', () => {
     const personalTools = document.getElementById('p-personal');
     const personalTools = document.getElementById('p-personal');
     if (personalTools) {
     if (personalTools) {

Latest revision as of 21:25, 24 December 2023

// Dark mode toggle
function toggleDarkMode() {
    const body = document.body;
    body.classList.toggle('dark-mode');

    // Save user preference in localStorage
    const isDarkMode = body.classList.contains('dark-mode');
    localStorage.setItem('darkMode', isDarkMode ? 'true' : 'false');
}

// Check user preference on page load
document.addEventListener('DOMContentLoaded', () => {
    const isDarkMode = localStorage.getItem('darkMode') === 'true';
    const body = document.body;

    if (isDarkMode) {
        body.classList.add('dark-mode');
    }

    // Add dark mode toggle to personal tools menu
    const personalTools = document.getElementById('p-personal');
    if (personalTools) {
        const darkModeToggle = document.createElement('li');
        darkModeToggle.id = 'pt-darkmode';
        darkModeToggle.className = 'mw-list-item';
        darkModeToggle.innerHTML = '<a href="javascript:void(0);" onclick="toggleDarkMode();"><span>Dark mode</span></a>';

        personalTools.querySelector('.vector-menu-content-list').appendChild(darkModeToggle);
    }
});