Wikipedia - Dark Theme by queengooborg

/* ==UserStyle==
@name           Wikipedia - Dark Theme
@namespace      queengooborg
@author         Vinyl Da.i'gyu-Kazotetsu [https://queengoob.org]
@description    A dark theme for Wikipedia, Wikimedia and other known MediaWiki-powered sites.  Currently only works for the "Vector" and "Vector legacy" skins, but more will follow.  Colors are adjustable via the variables set on :root.  https://www.queengoob.org/darkthemes
@version        4.0
@license        GPL-3.0
==/UserStyle== */
@-moz-document domain("wikipedia.org"), domain("wikimedia.org"), domain("mediawiki.org"), url-prefix("https://project-gc.com/w/") {
    /* -=- Variables -=- */
    :root {
        --background: #101010;
        --background-2: #181818;
        --background-3: #202020;
        --background-4: #282828;
        --background-5: #303030;
        --background-black: black;
        --background-alert: #0c1827;
        --foreground: #ccc;
        --foreground-2: white;
        --foreground-footer: #bbb;
        --foreground-disabled: #828282;
        --foreground-code: #39892f;
        --link: #608dff;
        --link-invalid: #ff6961;
        --link-hover: #637ab5;
        --link-invalid-hover: #b66763;
        --border: #696969;
        --border-input: #898989;
        --main: #347bff;
        --main-hover: #669cff;
        --main-light: #f0f8ff;
        --error: #5c0000;
        --warn: #664b00;
        --note: #036;
        --success: #004d0e;
        --dark-purple: #292135;
        --documentation: #002607;
        --diff-del: #551611;
        --diff-ins: #184e42;
        --diff-old: #775900;
        --diff-new: #133656;
    }
}

@-moz-document domain("wikipedia.org"), domain("wikimedia.org"), domain("mediawiki.org"), url-prefix("https://project-gc.com/w/") {
    /* -=- Main Styling -=- */
    body, .mw-body, .wikiEditor-ui-toolbar, .frb-inline-message, .mw-mmv-info-box, .mw-mmv-image-metadata, .suggestion-link, .oo-ui-menuLayout-content, .mw-page-container {
        background-color: var(--background);
        color: var(--foreground);
    }

    p, .mw-echo-ui-menuItemWidget > .oo-ui-labelElement-label, .mw-echo-ui-notificationItemWidget-content-actions-timestamp, .vector-menu-dropdown .vector-menu-heading, .frb-inline-main .cta, .btn, #Example, .mw-headline, #content, .suggestions-results span, .special-query, .ambox-text-small, .mbox-text, .Note td, .infobox, .tright, .toccolours, .localized-slogan, .client-js #preferences legend, input#ooui-1.oo-ui-inputWidget-input, .vector-menu-tabs-legacy .selected a, .vector-menu-tabs-legacy .selected a:visited, .footer-sidebar-text, .other-project-tagline, .oo-ui-tabOptionWidget, .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button, .search-container .js-langpicker-label, .mw-ui-button.mw-ui-quiet, .mw-ui-button.mw-ui-quiet.mw-ui-progressive, .mw-ui-button.mw-ui-quiet.mw-ui-destructive, .mw-ui-anchor.mw-ui-progressive.mw-ui-quiet, .mw-parser-output .mainpage-welcome-slogan, .mw-parser-output .sister-projects-family, .tux-breadcrumb, .oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget, .imeselector-menu .selectable-row-item, .imeselector a, .ime-disable, .languagesettings-menu h1, .languagesettings-menu .menu-section .settings-text, .languagesettings-menu .menu-section:hover .settings-text {
        color: var(--foreground);
    }

    *[style*="color: black"] {
        color: var(--foreground) !important;
    }

    h1, h2, h3, h4, h5, h6, .b, div, th, #pagehistory li.selected, .wikitable tr, .wikitable td, .homonymie, .plainlinks, .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link, .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input, .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button, #mwe-popups-settings main#mwe-popups-settings-form form label > span, .oo-ui-tagMultiselectWidget-handle .oo-ui-tagMultiselectWidget-group > input, .vector-menu-portal .vector-menu-heading, .vector-menu-tabs .mw-list-item.selected a, .vector-menu-tabs .mw-list-item.selected a:visited, .mw-parser-output .mainpage-welcome-sitename, #languagesettings-settings-panel h3, #languagesettings-settings-panel h4 {
        color: var(--foreground-2);
    }

    .portal-column-right, .portal-column-left, body.ns-100 .mw-body-content .subpages, .mw-highlight, .mw-echo-ui-notificationItemWidget, .oo-ui-popupToolGroup-tools, .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link, .cta, .frb-inline-visualB, .central-featured-lang :hover, .mw-echo-ui-notificationsInboxWidget-toolbarWrapper, .vector-menu-dropdown .vector-menu-content, #p-logo a, .app-badges .footer-sidebar-content, .app-badges, body.mediawiki table.mbox-small-left, .oo-ui-toolbar-bar, .oo-ui-tabSelectWidget-framed, #searchInput, .pure-form input[type=search], .informationbox, .editOptions, #mw-panel, .mw-ui-input, textarea, select, input, .vector-menu-tabs-legacy .selected, .mw-parser-output #mp-topbanner, .mw-parser-output #mp-bottom .mp-h2, .oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame, div.thumbinner, .mw-parser-output .portal-bar-bordered, .catlinks, .mw-parser-output .navbox, .mw-parser-output .navbox-subgroup, .mw-parser-output .contentsPage--topic, .mw-parser-output .nmbox, .uls-lcd, .skin-vector .uls-menu, .mw-pt-languages, .statstable > * > tr > td, table.ambox {
        background-color: var(--background-2);
        color: var(--foreground);
        border-color: var(--border);
    }

    .other-project-link:hover, .styled-select:hover, .btn, .reflist, .refbegin, .referencetooltip, .rt-tooltip, .rt-tooltipTail::after, .mwe-popups, div.navpopup, .mwe-popups .mwe-popups-container, #mwe-popups-settings, .suggestions-results, .suggestions-special, .hll, .mw-prefs-buttons, .oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle, .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover, .mw-htmlform-ooui .mw-htmlform-matrix tbody tr:nth-child(even) td, .oo-ui-checkboxInputWidget [type='checkbox'] + span, .infobox, .infobox td, .infobox th, .toc, .toccolours, .mw-parser-output .side-box, .mw-parser-output .contents-pages-footer, .oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle, #pagehistory li.selected, .vector-sticky-header, .mw-parser-output .nmbox-header, figure[typeof~='mw:File/Thumb'], figure[typeof~='mw:File/Frame'], figure[typeof~='mw:Image/Thumb'], figure[typeof~='mw:Video/Thumb'], figure[typeof~='mw:Audio/Thumb'], figure[typeof~='mw:Image/Frame'], figure[typeof~='mw:Video/Frame'], figure[typeof~='mw:Audio/Frame'], figure[typeof~='mw:File/Thumb'] > figcaption, figure[typeof~='mw:File/Frame'] > figcaption, figure[typeof~='mw:Image/Thumb'] > figcaption, figure[typeof~='mw:Video/Thumb'] > figcaption, figure[typeof~='mw:Audio/Thumb'] > figcaption, figure[typeof~='mw:Image/Frame'] > figcaption, figure[typeof~='mw:Video/Frame'] > figcaption, figure[typeof~='mw:Audio/Frame'] > figcaption, .flow-topic-titlebar, .flow-ui-navigationWidget-affixed, .flow-topic-moderatestate-lock .flow-topic-titlebar, .mw-ui-button:not(:disabled):hover, .uls-search, .uls-languagefilter, .imeselector, .imeselector-menu, #languagesettings-settings-panel, .languagesettings-menu .menu-section.active, .uls-language-settings-close-block, .uls-input-settings .uls-input-settings-inputmethods-list, .mw-pt-languages-label, .statstable > * > tr.tux-statstable-even > td {
        background-color: var(--background-3);
        color: var(--foreground);
        border-color: var(--border);
    }

    .mw-echo-ui-notificationItemWidget-unread, .mw-notification, body.ns-100 .mw-body-content th, body.ns-100 .mw-body-content div, body.ns-100 #portal td, .mw_metadata td, .tracklist td, .tracklist div, .mw-mmv-above-fold, .mw-mmv-dialog, .mw-mmv-dialog-down-arrow, .mw-mmv-download-attribution, .mw-mmv-download-pane, .mw-mmv-download-pane :hover, .suggestion-link:hover, .suggestion-link:active, #js-lang-list-button, .suggestions-results:hover, .suggestions-special:hover, .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover, .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:hover, .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link, .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary > .oo-ui-tool-link, td.diff-otitle, td.diff-ntitle, .lang-list-container, .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected, .oo-ui-menuOptionWidget.oo-ui-optionWidget-selected, .shortcutbox, .tright td, .tright th, .toccolours td, .toccolours th, .infobox_v3, .infobox_v3 .entete div, .cnotice, .bandeau-section, .autres-projets, #bodyContent tbody, #mp-left, .MainPageBG, #mp-left div, #mp-right div, #mp-topbanner, .list, .template-documentation, .collapsible th, .autocollapse th, .mw-search-profile-tabs, .mw-parser-output #mp-left, .mw-parser-output #mp-right, .mw-parser-output #mp-middle, .mw-parser-output #mp-lower, .wikitable > tr > th, .wikitable > * > tr > th, #mw-htmlform-source, #mw-htmlform-description, .uls-language-block > ul > li:hover, .imeselector:hover, .imeselector-menu .selectable-row:hover, .uls-ime-menu-settings-item, .languagesettings-menu .menu-section:hover, .statstable > * > tr > th {
        background-color: var(--background-4);
        color: var(--foreground);
        border-color: var(--border);
    }

    .mw-echo-ui-notificationItemWidget:hover, .portal-column-right span, .portal-column-left span, body.ns-100 .mw-body-content h2, .mw_metadata th, .tracklist th, #mp-tfl-h2, .oo-ui-tagItemWidget.oo-ui-widget-enabled:not(.oo-ui-tagItemWidget-fixed), .oo-ui-popupToolGroup.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle, .ve-ui-changeDescriptionsSelectWidget > .oo-ui-optionWidget-highlighted, .vertical-navbox th, .mw-revslider-revision...