MediaWiki:Common.css
From Descendants of Darkness Wiki
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.
/* Descendants of Darkness – bigger logo in left nav */
.mw-wiki-navigation-logo {
width: 250px !important; /* overall logo area width */
height: 250px !important; /* overall logo area height */
}
.mw-wiki-navigation-logo .mw-wiki-logo,
a.mw-wiki-logo {
display: block !important;
width: 100% !important; /* fill the container width */
height: 100% !important; /* fill the container height */
background-size: contain !important;
background-repeat: no-repeat !important;
background-position: left center !important;
}
/* If the menu looks squashed vertically, give the whole nav a bit more height */
#site-navigation {
min-height: 90px !important;
}
/* ============================================================
DESCENDANTS OF DARKNESS — GOTHIC DARK THEME (MEDIK)
============================================================ */
/* 0. Global reset: stop any skin element from forcing a white background */
.skin-medik *,
.skin-medik *::before,
.skin-medik *::after {
background-color: transparent !important;
}
/* 1. Base page background & text */
.skin-medik html,
.skin-medik body {
background-color: #050509 !important; /* almost black */
color: #dddddd !important;
}
/* 2. Main content area */
.skin-medik .mw-body,
.skin-medik #content,
.skin-medik .mw-content-container {
background-color: #09090f !important; /* slightly lighter panel */
color: #dddddd !important;
border: none !important;
}
/* Headings */
.skin-medik .mw-body h1,
.skin-medik .mw-body h2,
.skin-medik .mw-body h3,
.skin-medik .mw-body h4,
.skin-medik .mw-body h5 {
color: #f0f0f0 !important;
}
/* 3. Top bar / navbar – solid black */
.skin-medik .navbar,
.skin-medik .navbar-default,
.skin-medik #mw-head {
background-color: #000000 !important;
border-bottom: 1px solid #222 !important;
}
/* Top-left wiki name in the bar (white, not red) */
.skin-medik .navbar-brand,
.skin-medik .navbar-brand a {
color: #f5f5f5 !important;
text-shadow: none !important;
}
/* 4. Sidebar – dark, no white behind it */
.skin-medik #mw-panel {
background-color: #050509 !important;
color: #dddddd !important;
border: none !important;
}
/* Sidebar headings (Introduction, HUD Guide, etc.) */
.skin-medik #mw-panel .portal h3 {
color: #d64040 !important; /* red section titles */
}
/* Sidebar links */
.skin-medik #mw-panel a {
color: #f0f0f0 !important;
}
.skin-medik #mw-panel a:hover {
color: #ff5b5b !important;
}
/* 5. Article links (the ones in page content) */
.skin-medik .mw-body a,
.skin-medik .mw-body a:visited {
color: #d64040 !important;
}
.skin-medik .mw-body a:hover {
color: #ff5b5b !important;
}
/* 6. TOC, infoboxes, tables */
.skin-medik .toc,
.skin-medik .infobox,
.skin-medik .wikitable,
.skin-medik table {
background-color: #101018 !important;
border-color: #2a2a3a !important;
color: #dddddd !important;
}
/* 7. Kill any remaining white strips/wrappers explicitly */
.skin-medik #mw-head-base,
.skin-medik #mw-page-base,
.skin-medik #mw-wrapper,
.skin-medik .mw-page-container,
.skin-medik .mw-page-container-inner {
background-color: #050509 !important;
border: none !important;
}
/* 8. Logo – keep its original colours */
.skin-medik .mw-wiki-logo,
.skin-medik #p-logo a,
.skin-medik .mw-logo-icon img {
filter: none !important;
background-color: transparent !important;
}
/* ==== NAV BAR & DROPDOWN FIXES (MEDIK) ==== */
/* Top nav links (Main Page / Discussion / Actions / Tools etc.) */
.skin-medik .navbar-nav > li > a {
color: #f0f0f0 !important; /* light text on black bar */
}
/* Active/open nav item */
.skin-medik .navbar-nav > .open > a,
.skin-medik .navbar-nav > .open > a:focus,
.skin-medik .navbar-nav > .open > a:hover {
background-color: #151520 !important;
color: #ff5b5b !important;
}
/* Dropdown menu panel (for Actions, Tools, etc.) */
.skin-medik .dropdown-menu {
background-color: #101018 !important; /* dark panel, not invisible */
border: 1px solid #2a2a3a !important;
}
/* Links inside dropdown */
.skin-medik .dropdown-menu > li > a,
.skin-medik .dropdown-menu > li > a:link,
.skin-medik .dropdown-menu > li > a:visited {
color: #f0f0f0 !important;
}
/* Hover on dropdown items */
.skin-medik .dropdown-menu > li > a:hover,
.skin-medik .dropdown-menu > li > a:focus {
background-color: #191926 !important;
color: #ff5b5b !important;
}