User:Lakelimbo/DarkTheme.css

/* EXPERIMENTAL. Not recommended for usage yet. This is quite big, so if your connection is not that great or if your PC is a garbage bin, I'd not recommend using it. You can adapt to your tastes as well, of course, but some selectors may be quite specific, so be careful to not get lost.


 * root {

/* Tones */ --color-b1: #101010; --color-b2: #202020; --color-b3: #303030; --color-b4: #505050; --color-alpha: rgba(255,255,255,.1); /* Theme colors */ --bg-color: var(--color-b1); --link-color: #2a84ff; }

/* Layout */ html { color-scheme: dark; }

body { color: #fff; }

a.new { color: #ff0000; }

h1, h2, h3, h4, h5, #firstHeading, .firstHeading, .mw-headline, color: #fff; border-color: var(--color-b4); }
 * 1) mw-content-text h1, #mw-content-text h2,
 * 2) mw-content-text h3, #mw-content-text h4,
 * 3) mw-content-text h5, #mw-content-text h6 {

border-color: var(--green); }
 * 1) firstHeading {

background-color: var(--color-b2); color: #fff; }
 * 1) content-wrapper, .sidebar-section {

outline-color: #ecd35a; }
 * 1) searchInput {

.searchButton { filter: invert(1); opacity: 1; }

.refreshed-dropdown-tray, #toolbox-dropdown-button { background-color: var(--color-b3); color: #fff }

.refreshed-dropdown-tray a:focus, .refreshed-dropdown-tray a:hover, .refreshed-dropdown-tray a:active, .refreshed-dropdown-tray a.selected, .header-button:hover, a.sidebar-item:focus, a.sidebar-item:hover, a.sidebar-item:active, a.sidebar-item.selected { background-color: var(--color-alpha); }

.refreshed-dropdown-triangle::after { border-bottom-color: var(--color-b3); }

.refreshed-toolbox-stuck { background-color: #000; }

.toc, .toccolours, #filetoc { background-color: var(--color-b3); border-color: var(--color-b4); }

.tocnumber { color: #fff; }

.toctitle h2::before, .refreshed-icon-refreshed-menu.ooui-icon-menu { filter: invert(1); }

background-color: var(--color-b3) }
 * 1) catlinks {

color: #fff; }
 * 1) footer-wrapper {

code, pre { background-color: #151515; border-color: var(--color-b4); }

pre { color: #fff; }

/* The following styles can be inconsistent depending on the page */

/* Tables */ .wikitable, #mw_metadata, #mw_metadata td { background-color: var(--color-b3); color: #fff; }

.wikitable > tr > th, .wikitable > * > tr > th, #mw_metadata th { background-color: var(--color-b4); border-color: #5e5e5e; }

.wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td, #mw_metadata td { border-color: #5e5e5e; }

.table-responsive tr:nth-child(even) td { background-color: var(--color-alpha) }

/* Infoboxes */ .infobox-cell:nth-child(4n+1) { background-color: var(--color-alpha); }

.infobox-img, .infobox-Img { color: #fff!important; }

/* Navboxes */ .navbox { color: #000; }

.navbox table td { color: #fff; }

/* The following styles could be quite heavy. Remove if necessary. */

/* Recent changes */ .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined, .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled, .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle, .oo-ui-textInputWidget .oo-ui-inputWidget-input, .mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget, .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled, .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button, .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend, .oo-ui-popupWidget-popup { background-color: var(--color-b3); border-color: var(--color-b4); color: #fff; }

.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button { background: var(--color-b4); color: #fff; }

.oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon:not(.oo-ui-image-invert), .oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator:not(.oo-ui-image-invert), .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-input > .oo-ui-icon-menu { filter: invert(1) }

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button { color: inherit; }

.mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title, .oo-ui-tagMultiselectWidget.oo-ui-tagMultiselectWidget-outlined .oo-ui-inputWidget-input::placeholder { color: #d0d0d0; }

/* Search results */ .mw-search-profile-tabs, .mw-ui-input { background-color: var(--color-b3); border-color: var(--color-b4); color: #fff; }

.search-types .current a { color: #fff; }

/* Diffs */ .diff-context { background: none; color: #fff; border-color: var(--color-b4); }

.diff-addedline .diffchange { background: #4e6b86; }

/* Edit page */ .wikiEditor-ui-controls, .wikiEditor-ui .wikiEditor-ui-view, .wikiEditor-ui .wikiEditor-ui-top, .wikiEditor-ui-toolbar, .wikiEditor-ui-toolbar .tabs span.tab a.current, .wikiEditor-ui-toolbar .tabs span.tab a.current:visited, .wikiEditor-ui-toolbar .group .tool-select .label, .wikiEditor-ui-toolbar .sections .section, .wikiEditor-ui-toolbar .group, .wikiEditor-ui-toolbar .page-characters div span, .wikiEditor-ui-toolbar .page-table td, .editOptions, .mw-scribunto-console-fieldset { background-color: var(--color-b3); border-color: var(--color-b4); color: #fff; }

body.ltr .wikiEditor-ui-toolbar .tabs span.tab a:before, .wikiEditor-ui-toolbar .group .tool-select .label:after, .ui-widget-header .ui-icon { filter: invert(1); }

.wikiEditor-ui-toolbar .group .label, .wikiEditor-ui-toolbar .page-table th { color: #d0d0d0; }

.oo-ui-toggleButtonWidget.oo-ui-widget-enabled.oo-ui-buttonElement-frameless.oo-ui-toggleWidget-on .oo-ui-buttonElement-button { filter: invert(1); background-color: rgba(204,153,51,.3); }

.wikiEditor-ui-toolbar .tabs span.tab a { color: var(--link-color); }

.wikiEditor-ui-toolbar .booklet > .index > .current, .wikiEditor-ui-toolbar .booklet > .index > :hover { background-color: var(--color-alpha); color: var(--link-color) }

.wikiEditor-ui-toolbar .page-characters div span { height: unset; }

.wikiEditor-ui-toolbar .page-characters div span:hover { background-color: var(--color-alpha); border-color: var(--color-b4) }

.ui-widget-content { background: var(--color-b3); color: #fff; }

.ui-widget-header, .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background: var(--color-b4); border: none; color: #fff; }

.CodeMirror, .wikiEditor-ui .CodeMirror { background: #101010!important; color: #fff; }

.CodeMirror-linenumber, .CodeMirror-gutter, .CodeMirror-gutters { background: #000; border-color: var(--color-b4); }

.CodeMirror-line span::selection { background: #647489; }

.cm-mw-doubleUnderscore, .cm-mw-signature, .cm-mw-hr { background: var(--color-b3); }

.cm-mw-template-name, .cm-mw-template-bracket { color: #c363ff; }

.cm-mw-link-ground { color: var(--link-color); }

.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input { background: var(--color-b2) }

/* Edit interface. NOT FULLY FUNCTIONAL */ .ace-tm { background-color: var(--color-b3); border-color: var(--color-b4); color: #fff; }

.ace-tm .ace_gutter, .codeEditor-status { background: #000; border-color: var(--color-b4); }

.ace-tm .ace_gutter-active-line { background: var(--blue); color: #fff; }

.ace-tm .ace_cursor { color: #fff; }

.ace_content { background: #000; filter: saturate(5); }

.ace-tm .ace_print-margin { background-color: var(--color-b4) }

.mw-scribunto-message { background: transparent; color: #34cf34; }

#mw-scribunto-input { background: #000; color: var(--link-color); }

.mw-scribunto-input { color: var(--link-ccurrentColor) }

.mw-scribunto-print { background: var(--color-b4); color: #fff; }

/* Temporary styles */ filter: invert(1) }
 * 1) main-grid div.mb-3 img:first-of-type {

background: #241e1e!important; }
 * 1) main-grid .boxpanel:nth-of-type(2) {

background: #242a32!important; }
 * 1) main-grid .boxpanel:nth-of-type(3) {

border-color: #fff!important; background: #202020!important; color: #fff }
 * 1) main-grid .boxpanel:nth-of-type(4) {

background: #fff!important; color: #000!important; }
 * 1) main-grid .boxpanel:nth-of-type(4) div:first-child {

background: #302b33!important; }
 * 1) main-grid .boxpanel:nth-of-type(5) {

background: #383730!important; }
 * 1) main-grid .boxpanel:nth-of-type(6) {

background: #2e382e!important; }
 * 1) main-grid .boxpanel:nth-of-type(7) {

background: #332c33!important; }
 * 1) main-grid .boxpanel:nth-of-type(8) {

background: #262c2c!important; }
 * 1) main-grid .boxpanel:nth-of-type(9) {