MediaWiki:Common.css: Difference between revisions

/* ===================================================== */
/* SFGD Wiki – Global Dark Theme (Vector Legacy Compatible) */
/* ===================================================== */

/* Futuristic font */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700&display=swap');

/* -------------------- */
/* Global base styling */
/* -------------------- */
html,
body {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* Main content container */
.mw-body {
    background-color: #0030c2 !important;
    color: #ffffff !important;
    border-color: #00aaff !important;
}

/* -------------------- */
/* Header bar & tabs */
/* -------------------- */
#mw-head-base,
#mw-head,
div.vectorTabs,
div.vectorTabs ul,
div.vectorTabs li,
div.vectorTabs li.selected,
div.vectorMenu h3,
div.vectorMenu h5 {
    background-color: #000000 !important;
    background-image: none !important;
    color: #ffffff !important;
    border-color: #00aaff !important;
}

div.vectorTabs li,
div.vectorTabs li.selected {
    background: none !important;
    border: none !important;
}

div.vectorTabs li a,
div.vectorTabs li a span,
div.vectorTabs li.selected a,
div.vectorTabs li.selected a span,
#p-personal li a,
#p-namespaces a,
#p-views a {
    color: #7ad7ff !important;
}

div.vectorTabs li a:hover,
#p-personal li a:hover,
#p-namespaces a:hover,
#p-views a:hover {
    color: #00fbff !important;
}

/* -------------------- */
/* Sidebar */
/* -------------------- */
.skin-vector-legacy #mw-panel,
.skin-vector-legacy #mw-panel .portal,
.skin-vector-legacy #mw-panel .portal h3 {
    background-color: #000000 !important;
    background-image: none !important;
    color: #ffffff !important;
}

.skin-vector-legacy #mw-panel .portal .body ul li a,
.skin-vector-legacy #mw-panel .portal .body ul li a:visited {
    color: #7ad7ff !important;
}

.skin-vector-legacy #mw-panel .portal .body ul li a:hover {
    color: #00fbff !important;
}

/* -------------------- */
/* Content links */
/* -------------------- */
.mw-body a {
    color: #7ad7ff !important;
}

.mw-body a:visited {
    color: #cccccc !important;
}

.mw-body a.new {
    color: #ff3300 !important;
}

.mw-body a:hover,
.mw-body a.new:hover {
    color: #00fbff !important;
}

/* -------------------- */
/* Headings */
/* -------------------- */
#firstHeading,
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6,
.mw-parser-output h1,
.mw-parser-output h2,
.mw-parser-output h3,
.mw-parser-output h4,
.mw-parser-output h5,
.mw-parser-output h6 {
	font-family: 'Orbitron', sans-serif !important;
	font-weight: 700 !important;
	color: #ffffff !important;
}

.subpages {
    display: block !important;  /* Ensures it's shown, overriding any hides */
    font-size: 0.85em;  /* Smaller text for subtlety */
    margin: 0.5em 0;  /* Spacing above/below */
    color: #ffffff;  /* White text for dark background visibility */
    background-color: #000000;  /* Matches your black theme */
}

.subpages a {
    color: #00bfff;  /* Blue links to match your headers */
    text-decoration: none;  /* No underline for clean look */
}

.subpages a:hover {
    text-decoration: underline;  /* Underline on hover for usability */
}

/* -------------------- */
/* Tables / Infoboxes */
/* -------------------- */
.mw-parser-output table,
.mw-parser-output table.wikitable,
.mw-parser-output .infobox,
.mw-parser-output .navbox {
    background-color: #0030c2 !important;
    color: #ffffff !important;
    border: 1px solid #00aaff !important;
    border-collapse: collapse !important;
}

.mw-parser-output table th,
.mw-parser-output .infobox th,
.mw-parser-output .navbox th {
    background-color: #00aaff !important;
    color: #ffffff !important;
    border: 1px solid #00aaff !important;
}

.mw-parser-output table td,
.mw-parser-output .infobox td,
.mw-parser-output .navbox td {
    background-color: #0030c2 !important;
    color: #ffffff !important;
    border: 1px solid #00aaff !important;
}

.mw-parser-output table tr:nth-child(even),
.mw-parser-output table tr:nth-child(odd) {
    background-color: #0030c2 !important;
}

/* -------------------- */
/* TOC – Right aligned */
/* -------------------- */
#toc,
.toc {
    float: right !important;
    clear: right !important;
    margin: 0 0 1em 1.5em !important;
    background-color: #0030c2 !important;
    color: #ffffff !important;
    border: 1px solid #00aaff !important;
    padding: 0.6em 0.8em !important;
    max-width: 320px;
}

#toc #toctitle,
.toc #toctitle {
    background-color: #00aaff !important;
    color: #ffffff !important;
    padding: 0.4em 0.6em !important;
    margin: -0.6em -0.8em 0.5em -0.8em !important;
}

#toc .tocnumber {
    color: #00fbff !important;
}

#toc a,
#toc a:visited {
    color: #7ad7ff !important;
}

#toc a:hover {
    color: #00fbff !important;
}

/* TOC hide/show link */
#toc .toctogglelabel,
#toc .toctogglelink {
    color: #7ad7ff !important;
}

#toc .toctogglelabel:hover,
#toc .toctogglelink:hover {
    color: #00fbff !important;
}

/* -------------------- */
/* Inputs & buttons */
/* -------------------- */
#searchInput,
input[type="text"],
input[type="search"],
textarea {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #00aaff !important;
}

input[type="submit"],
button {
    background-color: #0030c2 !important;
    border-color: #00aaff !important;
    color: #ffffff !important;
}

input[type="submit"]:hover,
button:hover {
    background-color: #00fbff !important;
    color: #000000 !important;
}

/* -------------------- */
/* Footer */
/* -------------------- */
#footer,
#footer-info,
#footer-places,
#footer-icons,
#footer ul,
#footer li {
    background-color: #000000 !important;
    color: #d6d6d6 !important;
}

#footer a,
#footer a:visited {
    color: #7ad7ff !important;
}

#footer a:hover {
    color: #00fbff !important;
}

/* Remove Powered by MediaWiki */
#footer-poweredbyico,
#footer-poweredby {
    display: none !important;
}

#footer-icons {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ========================= */
/* REMOVE SEMANTIC MW BADGE  */
/* ========================= */

#footer-smw,
#footer-icons .smw-footer,
#footer-icons img[alt*="Semantic"],
#footer-icons a[href*="semantic-mediawiki"] {
    display: none !important;
}

/* ===================================================== */
/* VECTOR LEGACY – TAB ANCHOR BACKGROUND OVERRIDE */
/* ===================================================== */

/* Namespace + view tabs */
.skin-vector-legacy #p-namespaces li,
.skin-vector-legacy #p-views li {
    background-color: #000000 !important;
    background-image: none !important;
}

/* The ACTUAL white culprit: anchor elements */
.skin-vector-legacy #p-namespaces li a,
.skin-vector-legacy #p-views li a,
.skin-vector-legacy #p-namespaces li a span,
.skin-vector-legacy #p-views li a span {
    background-color: #000000 !important;
    background-image: none !important;
    color: #7ad7ff !important;
}

/* Selected tab */
.skin-vector-legacy #p-namespaces li.selected a,
.skin-vector-legacy #p-views li.selected a,
.skin-vector-legacy #p-namespaces li.selected a span,
.skin-vector-legacy #p-views li.selected a span {
    background-color: #000000 !important;
    color: #00fbff !important;
}

/* Hover state */
.skin-vector-legacy #p-namespaces li a:hover,
.skin-vector-legacy #p-views li a:hover,
.skin-vector-legacy #p-namespaces li a:hover span,
.skin-vector-legacy #p-views li a:hover span {
    background-color: #000000 !important;
    color: #00fbff !important;
}

/* Kill Vector gradients & borders */
.skin-vector-legacy #p-namespaces li,
.skin-vector-legacy #p-views li,
.skin-vector-legacy #p-namespaces li a,
.skin-vector-legacy #p-views li a {
    border: none !important;
    box-shadow: none !important;
}