MediaWiki:Common.js: Unterschied zwischen den Versionen
Erscheinungsbild
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
| Zeile 7: | Zeile 7: | ||
} | } | ||
var link = mw.util.addPortletLink( | var link = mw.util.addPortletLink( | ||
'p-personal', | 'p-personal', | ||
'#', | '#', | ||
'🌙 Dark', | '🌙 Dark', | ||
'custom-theme-toggle', | 'custom-theme-toggle', | ||
'Light/Dark umschalten' | 'Light/Dark umschalten' | ||
); | ); | ||
link.id = 'custom-theme-toggle'; | link.id = 'custom-theme-toggle'; | ||
}); | }); | ||
// ============= | // ============= | ||
// Switcher als Modul | // Switcher als Modul | ||
// ============= | // ============= | ||
(function () { | (function () { | ||
const THEME_KEY = 'custom-site-theme'; | const THEME_KEY = 'custom-site-theme'; | ||
| Zeile 26: | Zeile 25: | ||
const DARK_CSS = '/darktest/dark-mode.css'; | const DARK_CSS = '/darktest/dark-mode.css'; | ||
let linkEl = document.getElementById('theme-css'); | let linkEl = document.getElementById('theme-css'); | ||
if (!linkEl) { | if (!linkEl) { | ||
Version vom 13. Februar 2026, 14:48 Uhr
// =============
// Button einbinden
// =============
mw.loader.using( 'mediawiki.util', function () {
if ( mw.config.get( 'skin' ) !== 'vector-2022' ) {
return;
}
var link = mw.util.addPortletLink(
'p-personal',
'#',
'🌙 Dark',
'custom-theme-toggle',
'Light/Dark umschalten'
);
link.id = 'custom-theme-toggle';
});
// =============
// Switcher als Modul
// =============
(function () {
const THEME_KEY = 'custom-site-theme';
const LIGHT_CSS = '/darktest/light-mode.css';
const DARK_CSS = '/darktest/dark-mode.css';
let linkEl = document.getElementById('theme-css');
if (!linkEl) {
linkEl = document.createElement('link');
linkEl.id = 'theme-css';
linkEl.rel = 'stylesheet';
linkEl.href = LIGHT_CSS;
document.head.appendChild(linkEl);
}
const toggleEl = document.getElementById('custom-theme-toggle');
if (!toggleEl) return;
function applyTheme(theme) {
if (theme === 'dark') {
linkEl.href = DARK_CSS;
document.documentElement.classList.add('theme-dark');
document.documentElement.classList.remove('theme-light');
toggleEl.textContent = '☀️ Light';
} else {
linkEl.href = LIGHT_CSS;
document.documentElement.classList.add('theme-light');
document.documentElement.classList.remove('theme-dark');
toggleEl.textContent = '🌙 Dark';
}
}
let current = localStorage.getItem(THEME_KEY);
if (!current) {
const prefersDark = window.matchMedia &&
window.matchMedia('(prefers-color-scheme: dark)').matches;
current = prefersDark ? 'dark' : 'light';
}
applyTheme(current);
toggleEl.addEventListener('click', function () {
current = (current === 'dark') ? 'light' : 'dark';
localStorage.setItem(THEME_KEY, current);
applyTheme(current);
});
})();