User:Deadfire/common.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

• Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
• Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
• Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.

// Load dependencies for WikimediaUI Dark Mode (remove when loading through ResourceLoader).
mw.loader.load('https://en.wikipedia.org/w/index.php?title=User:Volker_E._(WMF)/dark-mode.css&action=raw&ctype=text/css', 'text/css');

// User has dark color scheme preference set in operating system.
if (window.matchMedia('( prefers-color-scheme: dark )').matches || mw.storage.get('client-dark-mode-toggle') === '1') {
    document.documentElement.className = 'client-dark-mode';
};

// Fix logos and add dark mode toggle
$(function () {
    $('#p-logo').clone().addClass('mw-no-invert').insertAfter('#p-logo');

    mw.util.addPortletLink('p-personal', '#', 'Dark mode', 'pt-darkmode', '', 'np', '#pt-watchlist');

    $('#pt-darkmode').on('click', function (e) {
        var $html = $('html');
        e.preventDefault();

        $html.toggleClass('client-dark-mode');
        mw.storage.set(
            'client-dark-mode-toggle',
            String(Number($html.hasClass('client-dark-mode'))));
    });

});