MediaWiki:Timeless.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 BACKGROUND === */
html, body {
    background: #000 !important;
    color: #fff !important;
}

/* === MAIN CONTENT AREA === */
#mw-content,
#mw-content-container,
#mw-content-block,
#mw-content-text {
    background: #000 !important;
    color: #fff !important;
}

/* === SIDEBAR + NAVIGATION === */
#mw-navigation,
#mw-panel,
#mw-panel .mw-portlet,
#mw-panel .mw-portlet-body {
    background: #000 !important;
    color: #fff !important;
}

/* === RIGHT SIDEBAR (page tools, more, etc.) === */
#mw-related-navigation,
#mw-data-navigation,
#mw-related-navigation .mw-portlet,
#mw-data-navigation .mw-portlet {
    background: #000 !important;
    color: #fff !important;
}

/* === HEADERS, TABS, TOP BAR === */
#mw-header,
#mw-header-container,
#mw-header h1,
#mw-header h2,
#mw-header .mw-portlet {
    background: #000 !important;
    color: #fff !important;
}

/* === SEARCH BAR === */
#searchInput,
#searchInput:focus {
    background: #111 !important;
    color: #fff !important;
    border: 1px solid #444 !important;
}

/* === LINKS === */
a {
    color: #ff0 !important; /* yellow links */
}

a:visited {
    color: #ccc !important; /* silver visited links */
}

/* === GRAY CONTENT BOXES === */
.mw-parser-output .infobox,
.mw-parser-output .toc,
.mw-parser-output table,
.mw-parser-output .thumb,
.mw-parser-output .thumbinner,
.mw-parser-output .navbox,
.mw-parser-output .metadata {
    background: #111 !important;
    color: #fff !important;
    border-color: #333 !important;
}

/* === FIX WHITE GAPS BETWEEN ELEMENTS === */
#mw-content-container,
#mw-content-block,
#mw-content-text,
#mw-content {
    background-color: #000 !important;
}

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

/* === FORCE DARK BACKGROUND ON ALL GENERIC DIVS === */
div {
    background-color: transparent !important;
}



/* --- FORCE THE ENTIRE MENU COLUMN TO BE BLACK, NOT JUST THE TEXT ROWS --- */
#mw-panel,
#mw-panel .portal,
#mw-panel .portal .body,
#mw-panel .portal ul,
#mw-panel .sidebar,
#mw-panel .sidebar ul,
#mw-panel .sidebar li {
    background: #000 !important;
}

/* --- ENSURE NO TRANSPARENT GAPS BETWEEN ITEMS --- */
#mw-panel .portal ul li,
#mw-panel .sidebar ul li {
    background: #000 !important;
    border: none !important; /* Timeless sometimes adds separators */
}

/* --- ENSURE THE OVERLAY IS DARK --- */
#mw-navigation:before,
#mw-panel:before {
    background: rgba(0,0,0,0.85) !important;
}

/* --- TEXT + LINK COLORS --- */
#mw-panel,
#mw-panel * {
    color: #fff !important;
}

#mw-panel a {
    color: #f5d000 !important;
}

#mw-panel a:visited {
    color: #c0c0c0 !important;
}


/* FORCE THE ENTIRE MENU COLUMN TO BE SOLID BLACK */
#mw-panel,
#mw-panel .portal,
#mw-panel .portal .body,
#mw-panel .portal .body ul {
    background-color: #000 !important;
}

/* REMOVE ANY BACKGROUND FROM INDIVIDUAL MENU ITEMS */
#mw-panel .portal .body ul li,
#mw-panel .portal .body ul li a {
    background: transparent !important;
}

/* ENSURE TEXT AND LINKS ARE VISIBLE */
#mw-panel,
#mw-panel * {
    color: #fff !important;
}

#mw-panel a {
    color: #f5d000 !important;
}

#mw-panel a:visited {
    color: #c0c0c0 !important;
}

/* DARKEN THE OVERLAY BEHIND THE MENU */
#mw-navigation:before {
    background: rgba(0,0,0,0.85) !important;
}


/* FORCE THE ENTIRE MOBILE MENU COLUMN TO BE BLACK */
.mw-portlet,
.mw-portlet .mw-portlet-body,
.mw-portlet .mw-portlet-body ul,
.mw-portlet .mw-portlet-body ul li {
    background: #000 !important;
}

/* REMOVE BACKGROUND FROM LINKS SO THEY DON'T CREATE STRIPES */
.mw-portlet .mw-portlet-body ul li a {
    background: transparent !important;
}

/* ENSURE TEXT IS VISIBLE */
.mw-portlet,
.mw-portlet * {
    color: #fff !important;
}

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

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

/* DARKEN THE OVERLAY BEHIND THE MENU */
#mw-navigation:before {
    background: rgba(0,0,0,0.85) !important;
}





/* FORCE THE ENTIRE MOBILE MENU COLUMN TO BE BLACK */
#mw-navigation,
#mw-navigation .mw-accordion,
#mw-navigation .mw-accordion-section,
#mw-navigation .mw-accordion-section .mw-accordion-content,
#mw-navigation .mw-accordion-section .mw-accordion-content ul,
#mw-navigation .mw-accordion-section .mw-accordion-content li {
    background: #000 !important;
}

/* REMOVE BACKGROUND FROM LINKS SO THEY DON'T CREATE STRIPES */
#mw-navigation .mw-accordion-section .mw-accordion-content li a {
    background: transparent !important;
}

/* ENSURE TEXT IS VISIBLE */
#mw-navigation,
#mw-navigation * {
    color: #fff !important;
}

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

#mw-navigation a:visited {
    color: #c0c0c0 !important;
}

/* DARKEN THE OVERLAY BEHIND THE MENU */
#mw-navigation:before {
    background: rgba(0,0,0,0.85) !important;
}


/* FORCE THE ENTIRE MENU COLUMN TO BE BLACK */
#mw-navigation,
#mw-navigation * {
    background-color: #000 !important;
}

/* REMOVE BACKGROUND FROM LINKS SO THEY DON'T CREATE STRIPES */
#mw-navigation li a {
    background: transparent !important;
}

/* REMOVE TRANSPARENT PADDING THAT CREATES THE GAPS */
#mw-navigation li {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    background-color: #000 !important;
}

/* ENSURE THE UL ITSELF IS BLACK */
#mw-navigation ul {
    background-color: #000 !important;
}

/* TEXT + LINK COLORS */
#mw-navigation,
#mw-navigation * {
    color: #fff !important;
}

#mw-navigation a {
    color: #f5d000 !important;
}

#mw-navigation a:visited {
    color: #c0c0c0 !important;
}





/* FORCE THE ENTIRE SIDEBAR COLUMN TO BE BLACK */
#mw-panel,
#mw-panel .portal,
#mw-panel .portal .body,
#mw-panel .portal .body ul {
    background-color: #000 !important;
}

/* REMOVE TRANSPARENT PADDING THAT CREATES THE GAPS */
#mw-panel .portal .body ul li {
    background-color: #000 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
}

/* REMOVE BACKGROUND FROM LINKS SO THEY DON'T CREATE STRIPES */
#mw-panel .portal .body ul li a {
    background: transparent !important;
}

/* TEXT + LINK COLORS */
#mw-panel,
#mw-panel * {
    color: #fff !important;
}

#mw-panel a {
    color: #f5d000 !important;
}

#mw-panel a:visited {
    color: #c0c0c0 !important;
}




/* Timeless mobile hamburger menu icon */
.skin-timeless .mw-ui-icon-element {
    color: #ffff00 !important;   /* forces yellow */
    fill: #ffff00 !important;    /* covers SVG fill */
}