MediaWiki:Common.js: Difference between revisions
Jump to navigation
Jump to search
OtherXAdmin (talk | contribs) (Created page with "→Any JavaScript here will be loaded for all users on every page load.: // Disable user scaling on mobile devices if (window.matchMedia('(max-width: 767px)').matches) { var viewport = document.querySelector("meta[name=viewport]"); viewport.parentNode.removeChild(viewport); viewport = document.createElement('meta'); viewport.name = "viewport"; viewport.content = "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no";...") |
OtherXAdmin (talk | contribs) No edit summary |
||
| (9 intermediate revisions by the same user not shown) | |||
| 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 ? '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); | |||
} | |||
}); | |||
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);
}
});