MediaWiki:Citizen.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.

/* === Citizen dark-mode-aware overrides === */

/* Global image constraint (replaces Foundation CSS behavior) */
img {
    max-width: 100%;
    height: auto;
}

/* Wide content layout */
:root {
    --width-layout: 1440px;
}

/* ---- Infobox ---- */
.infobox {
    background: var(--color-surface-2) !important;
    border: 1px solid var(--color-surface-3) !important;
    color: var(--color-base) !important;
}
.infobox > caption {
    background: var(--color-primary) !important;
    color: var(--color-primary--text, #fff) !important;
}
.infobox th {
    color: var(--color-base) !important;
}
/* Section headers (Properties, Recipes, Logic, Construction, Stage 1, etc.) */
.infobox th:only-child {
    background: var(--color-surface-3) !important;
    color: var(--color-base) !important;
}
.infobox td {
    color: var(--color-base) !important;
}
.infobox tr:nth-of-type(2n) {
    background: var(--color-surface-3) !important;
}
.infobox a {
    color: var(--color-link) !important;
}

/* ---- Description box (Template:Description — inline background-color:white) ---- */
div[style*="background-color:white"],
div[style*="background-color: white"] {
    background-color: var(--color-surface-2) !important;
    border: 1px solid var(--color-surface-3) !important;
    color: var(--color-base) !important;
}
div[style*="background-color:white"] p,
div[style*="background-color: white"] p,
div[style*="background-color:white"] i,
div[style*="background-color: white"] i,
div[style*="background-color:white"] b,
div[style*="background-color: white"] b {
    color: var(--color-base) !important;
}
div[style*="background-color:white"] a,
div[style*="background-color: white"] a {
    color: var(--color-link) !important;
}

/* ---- Stationeers icons ---- */
.stationeers-icon {
    background-color: var(--color-surface-3) !important;
    border-color: var(--color-surface-4, var(--color-surface-3)) !important;
    overflow: hidden;
}

/* ---- Subheader bars (used on some pages) ---- */
.subheader {
    background: var(--color-primary) !important;
    color: var(--color-primary--text, #fff) !important;
}

/* ---- Wikitables ---- */
table.wikitable {
    background: var(--color-surface-1) !important;
    border-color: var(--color-surface-3) !important;
    color: var(--color-base) !important;
}
table.wikitable > tr > th,
table.wikitable > * > tr > th {
    background: var(--color-surface-2) !important;
    color: var(--color-base) !important;
    border-color: var(--color-surface-3) !important;
}
table.wikitable > tr > td,
table.wikitable > * > tr > td {
    border-color: var(--color-surface-3) !important;
}

/* ---- Navboxes ---- */
.navbox {
    background: var(--color-surface-1) !important;
    border-color: var(--color-surface-3) !important;
    color: var(--color-base) !important;
}
.navbox-title {
    background: var(--color-primary) !important;
    color: var(--color-primary--text, #fff) !important;
}
.navbox-group {
    background: var(--color-surface-2) !important;
    color: var(--color-base) !important;
}
.navbox-subgroup {
    background: var(--color-surface-1) !important;
}

/* ---- Collapsible sections ---- */
.mw-collapsible {
    background: var(--color-surface-1) !important;
    border-color: var(--color-surface-3) !important;
}

/* ---- Translation header ---- */
.mw-pt-languages {
    background: var(--color-surface-1) !important;
    border-color: var(--color-surface-3) !important;
    color: var(--color-base) !important;
}