MediaWiki:Common.js: Difference between revisions
Jump to navigation
Jump to search
OtherXAdmin (talk | contribs) (Blanked the page) Tag: Blanking |
OtherXAdmin (talk | contribs) No edit summary |
||
Line 1: | Line 1: | ||
// 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); | |||
} | |||
// 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 | |||
document.addEventListener('DOMContentLoaded', () => { | |||
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); | |||
} | |||
}); |
Revision as of 20:32, 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); } // 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 document.addEventListener('DOMContentLoaded', () => { 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); } });