MediaWiki:Theme-dark.css
Jump to navigation
Jump to search
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)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/*** Theme with Dark background ***/
body .mw-body
{
background: transparent;
}
:root
{
--theme-site-background: url(/images/9/9a/Site-background-dark.png) top center / cover no-repeat fixed;
--theme-navbar-border-color: transparent;
--theme-navbar-tab-border-color: transparent;
--theme-navbar-tab-selected-background: transparent;
--theme-navbar-tab-border-color-hover: transparent;
/* Dark theme alternating table background */
.wikitable.sortable tr:nth-child(2n),
.wikitable tr:nth-child(2n+1) {
background: #1b1424;
}
.wikitable.sortable tr:nth-child(2n+1),
.wikitable tr:nth-child(2n) {
background: #150f1c;
}
/* Border Background */
#mw-page-base {
background: none;
border-image-source: url(/images/e/e7/Site-border-dark.png);
border-image-slice: 16 13 7 16 fill;
border-image-width: 20px 20px 20px 20px;
border-image-outset: 0px 0px 0px 0px;
border-image-repeat: stretch stretch;
z-index: -1;
image-rendering: pixelated;
image-rendering: crisp-edges;
}
#mw-panel .portal,
#mw-panel #p-logo + .portal {
background: #B00D4F;
}
.vector-menu-dropdown,
#mw-head .vector-menu-dropdown .vector-menu-heading,
.vector-menu-dropdown,
.vectorTabs,
.vectorTabs ul,
.vectorTabs span,
.vectorTabs li,
.vectorTabs li a,
.vectorTabs li.selected a,
.vectorTabs li.selected a:visited {
background-color: #B00D4F;
}
/* Dark theme table border color */
.mw-datatable > * > tr > td,
.mw-datatable > tr > td,
.mw-json > * > tr > td,
.mw-json > tr > td,
.wikitable > * > tr > td,
.wikitable > tr > td {
border-color: #2d2339;
/* ===========================================
Homepage content - Dark theme color changes
=========================================== */
/* Dark theme - Button background, border and color hover */
.home-content-links-wrapper a:hover,
.home-content-links-wrapper a:active,
.home-content-links-wrapper a:focus {
border-color: #F41152;
background: #F41152;
color: #e4bcd6;
}
/* Home content - Button hover */
body .home-content-links-wrapper a:hover,
body .home-content-links-wrapper a:active,
body .home-content-links-wrapper a:focus {
text-decoration: none;
border-color: #F41152;
background: #F41152;
}
/* Title above sections */
body .home-title {
background: #e4bcd6;
}
/* Dark theme - Different text color on hover */
.home-content-links-wrapper a:hover .home-content-link-title,
.home-content-links-wrapper a:active .home-content-link-title,
.home-content-links-wrapper a:focus .home-content-link-title {
color: #e4bcd6;
}
}
#mw-panel .portal,
#mw-panel #p-logo + .portal {
background: #0D0215;
}