MediaWiki:Common.css

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.

/* === GLOBAL OVERRIDE: FORCE DARK EVERYTHING === */
html, body, * {
    background-color: #000 !important;
    color: #fff !important;
    border-color: #333 !important;
}

/* === LINKS === */
a {
    color: #ff0 !important;
}
a:visited {
    color: #ccc !important;
}

/* === TABLES, INFOBOXES, THUMBS, TOC === */
table,
.infobox,
.toc,
.thumb,
.thumbinner,
.mw-parser-output table,
.mw-parser-output .thumb,
.mw-parser-output .thumbinner {
    background-color: #111 !important;
    color: #fff !important;
    border-color: #333 !important;
}

/* === FORMS, INPUTS, BUTTONS === */
input,
textarea,
select,
button {
    background-color: #111 !important;
    color: #fff !important;
    border: 1px solid #444 !important;
}

/* === SPECIAL PAGES (Preferences, Upload, RecentChanges, etc.) === */
.mw-specialpage,
.mw-htmlform,
.mw-htmlform-field,
.mw-htmlform-submit,
.mw-htmlform-field-HTMLTextField,
.mw-htmlform-field-HTMLSelectField,
.mw-htmlform-field-HTMLCheckField {
    background-color: #000 !important;
    color: #fff !important;
}

/* === EDITOR === */
.wikiEditor-ui,
.wikiEditor-ui textarea,
#wpTextbox1 {
    background-color: #000 !important;
    color: #fff !important;
}

/* === FIX RANDOM WHITE GAPS === */
div,
section,
article,
header,
footer,
nav {
    background-color: transparent !important;
}


/* === FORCE DARK ON ALL CONTENT BLOCKS === */
.mw-parser-output,
.mw-parser-output h1,
.mw-parser-output h2,
.mw-parser-output h3,
.mw-parser-output p,
.mw-parser-output ul,
.mw-parser-output li,
.mw-parser-output table,
.mw-parser-output td,
.mw-parser-output th,
.mw-parser-output .mw-message-box,
.mw-parser-output .plainlinks,
.mw-parser-output .mw-headline {
    background-color: #000 !important;
    color: #fff !important;
    border-color: #333 !important;
}

/* === FIX WHITE TABS AND PAGE HEADER === */
#contentSub,
#mw-content-subtitle,
#mw-page-base,
#mw-head-base,
#mw-content-text,
#mw-content,
#firstHeading {
    background-color: #000 !important;
    color: #fff !important;
    border-color: #333 !important;
}


/* --- MAKE THE HAMBURGER ICON VISIBLE ON BLACK --- */
#mw-header .mw-ui-icon-mf-menu,
#mw-header .mw-ui-icon-mf-menu:before {
    color: #fff !important; /* white icon */
    fill: #fff !important;
}

/* --- FORCE THE MOBILE MENU PANEL TO BE OPAQUE --- */
#mw-mf-page-left,
#mw-mf-page-left .menu,
#mw-mf-page-left .menu__content {
    background: #000 !important; /* solid black */
}

/* --- DARKEN THE OVERLAY BEHIND THE MENU --- */
#mw-mf-page-left-overlay {
    background: rgba(0,0,0,0.85) !important;
}

/* --- MENU LINK COLORS (YOUR PALETTE) --- */
#mw-mf-page-left a {
    color: #f5d000 !important; /* yellow */
}

#mw-mf-page-left a:visited {
    color: #c0c0c0 !important; /* silver */
}

/* --- ENSURE MENU TEXT IS READABLE --- */
#mw-mf-page-left,
#mw-mf-page-left * {
    color: #fff !important;
}



#mw-header .mw-ui-icon,
#mw-header .mw-ui-icon:before {
    color: #f5d000 !important;
    fill: #f5d000 !important;
}



/* --- MAKE THE MOBILE MENU BACKGROUND SOLID BLACK --- */
.mw-extended-menu,
.mw-extended-menu .mw-extended-menu-content {
    background: #000 !important;
}

/* --- DARKEN THE OVERLAY BEHIND THE MENU --- */
.mw-extended-menu-overlay {
    background: rgba(0,0,0,0.85) !important;
}

/* --- ENSURE MENU TEXT IS READABLE --- */
.mw-extended-menu,
.mw-extended-menu * {
    color: #fff !important;
}

/* --- YOUR LINK COLORS --- */
.mw-extended-menu a {
    color: #f5d000 !important;
}

.mw-extended-menu a:visited {
    color: #c0c0c0 !important;
}