MediaWiki:Common.css: Difference between revisions

Revision as of 19:22, 4 July 2026

/* CSS placed here will be applied to all skins */
:root {
    --background-color-base: #0b0d10;
    --background-color-neutral: #12161b;
    --background-color-interactive: #315f9d;
    --background-color-interactive-subtle: #1b2430;

    --border-color-base: #2a333d;

    --color-base: #eeeeee;
    --color-subtle: #aca6ad;
    --color-emphasized: #ffffff;
    --color-progressive: #6fa8ff;
    --color-progressive--hover: #9fc4ff;
}

body {
    background: #0b0d10 !important;
    color: #eeeeee !important;
}

.mw-body,
.vector-body {
    background: #10151b !important;
    color: #eeeeee !important;
    border-color: #2a333d !important;
}

#mw-page-base {
    background: linear-gradient(#171b20, #0b0d10) !important;
}

.vector-header-container,
.vector-sticky-header,
#mw-head {
    background: #12161b !important;
    color: #eeeeee !important;
}

.vector-menu,
.vector-menu-content,
.vector-menu-content-list {
    background: #12161b !important;
}

a {
    color: #6fa8ff !important;
}

a:hover {
    color: #9fc4ff !important;
}

.mw-parser-output h1,
.mw-parser-output h2 {
    border-bottom: 2px solid #315f9d !important;
    color: #ffffff !important;
}

.toc,
#toc {
    background: #10151b !important;
    border: 1px solid #2a333d !important;
    color: #eeeeee !important;
}

.infobox,
.wikitable {
    background: #12161b !important;
    border: 1px solid #2a333d !important;
    color: #eeeeee !important;
}

.infobox th,
.wikitable th {
    background: #315f9d !important;
    color: #ffffff !important;
}

.infobox td,
.wikitable td {
    border-color: #2a333d !important;
}

.mw-editsection,
.catlinks {
    background: #10151b !important;
    border-color: #2a333d !important;
    color: #aca6ad !important;
}












/* Top page tabs */

.vector-page-toolbar,
.vector-page-toolbar-container,
.vector-page-toolbar .vector-menu,
.vector-page-toolbar .vector-menu-content {
    background: transparent !important;
}

/* Individual tabs */

.vector-tab-noicon a,
.vector-tab-noicon span,
.vector-tab-noicon {
    background: #1a2028 !important;
    color: #ddd !important;
    border: 1px solid #2a333d !important;
}

.vector-tab-noicon.selected,
.vector-tab-noicon.selected a {
    background: #315f9d !important;
    color: white !important;
}

/* Search */

.cdx-text-input__input {
    background: #161b21 !important;
    color: #eee !important;
    border-color: #2a333d !important;
}

.cdx-search-input {
    background: transparent !important;
}

/* Buttons */

.cdx-button {
    background: #1a2028 !important;
    color: #ddd !important;
    border-color: #2a333d !important;
}

.cdx-button:hover {
    background: #315f9d !important;
}



/* Cleaner Vector legacy tabs */

#p-namespaces li,
#p-views li,
#p-cactions li {
    background: none !important;
}

#p-namespaces li a,
#p-views li a,
#p-cactions li a,
#p-cactions .vector-menu-heading {
    background: #171d24 !important;
    color: #d7dce3 !important;
    border: 0 !important;
    border-left: 1px solid #2a333d !important;
    padding: 0.65em 0.85em !important;
    box-shadow: inset 0 -2px 0 #2a333d;
}

#p-namespaces li.selected a,
#p-views li.selected a {
    background: #315f9d !important;
    color: #ffffff !important;
    box-shadow: inset 0 -2px 0 #6fa8ff;
}

#p-namespaces li a:hover,
#p-views li a:hover,
#p-cactions li a:hover {
    background: #233044 !important;
    color: #ffffff !important;
    text-decoration: none !important;
}