Jump to content

Template:Infobox government agency/styles.css

From the Vrienden Universe, a fictional wiki
Revision as of 10:39, 3 July 2026 by VU-MaintenanceBot (talk | contribs) (Add dark mode infobox styles)
/* Infobox government agency — Dark mode override */
/* Uses MediaWiki client preference dark theme */

html.skin-theme-clientpref-dark .infobox {
    background-color: #1e1e1e !important;
    color: #d0d0d0 !important;
    border-color: #444 !important;
}

/* Main title (e.g., "Bau-Einsatz") */
html.skin-theme-clientpref-dark .infobox caption {
    background-color: #1B223D !important;
    color: #e0f0ff !important;
    border-color: #3a506b !important;
}

/* Section headers like "Agency overview" */
html.skin-theme-clientpref-dark .infobox th.infobox-header,
html.skin-theme-clientpref-dark .infobox .infobox-header,
html.skin-theme-clientpref-dark .infobox .infobox-section-header,
html.skin-theme-clientpref-dark .infobox th[colspan="2"] {
    background-color: #1B223D !important;
    color: #e0f0ff !important;
    border-color: #3a506b !important;
}

/* Label cells (left column) */
html.skin-theme-clientpref-dark .infobox th {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
    border-color: #444 !important;
}

/* Data cells (right column) */
html.skin-theme-clientpref-dark .infobox td {
    background-color: #1e1e1e !important;
    color: #d0d0d0 !important;
    border-color: #444 !important;
}

/* Links inside infobox */
html.skin-theme-clientpref-dark .infobox a {
    color: #8ec5ff !important;
}

/* Keep infobox section headers centered. */
.infobox .infobox-header,
.infobox th.infobox-header {
	text-align: center;
}


@media screen {
	html.skin-theme-clientpref-night .infobox,
	body.skin-theme-clientpref-night .infobox {
		background-color: #1e1e1e;
		color: #d0d0d0;
		border-color: #444;
	}

	html.skin-theme-clientpref-night .infobox th,
	html.skin-theme-clientpref-night .infobox td,
	html.skin-theme-clientpref-night .infobox .infobox-label,
	html.skin-theme-clientpref-night .infobox .infobox-data,
	html.skin-theme-clientpref-night .infobox .infobox-full-data,
	body.skin-theme-clientpref-night .infobox th,
	body.skin-theme-clientpref-night .infobox td,
	body.skin-theme-clientpref-night .infobox .infobox-label,
	body.skin-theme-clientpref-night .infobox .infobox-data,
	body.skin-theme-clientpref-night .infobox .infobox-full-data {
		background-color: #1e1e1e;
		color: #d0d0d0;
		border-color: #444;
	}

	html.skin-theme-clientpref-night .infobox .infobox-above,
	html.skin-theme-clientpref-night .infobox .infobox-title,
	html.skin-theme-clientpref-night .infobox .infobox-header,
	html.skin-theme-clientpref-night .infobox .infobox-subheader,
	html.skin-theme-clientpref-night .infobox .infobox-below,
	html.skin-theme-clientpref-night .infobox caption,
	html.skin-theme-clientpref-night .infobox th[colspan],
	body.skin-theme-clientpref-night .infobox .infobox-above,
	body.skin-theme-clientpref-night .infobox .infobox-title,
	body.skin-theme-clientpref-night .infobox .infobox-header,
	body.skin-theme-clientpref-night .infobox .infobox-subheader,
	body.skin-theme-clientpref-night .infobox .infobox-below,
	body.skin-theme-clientpref-night .infobox caption,
	body.skin-theme-clientpref-night .infobox th[colspan] {
		background-color: #1B223D !important;
		color: #e0f0ff !important;
		border-color: #3a506b;
	}

	html.skin-theme-clientpref-night .infobox a:link,
	html.skin-theme-clientpref-night .infobox a:visited,
	body.skin-theme-clientpref-night .infobox a:link,
	body.skin-theme-clientpref-night .infobox a:visited {
		color: #88ccff;
	}
}

@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .infobox,
	body.skin-theme-clientpref-os .infobox {
		background-color: #1e1e1e;
		color: #d0d0d0;
		border-color: #444;
	}

	html.skin-theme-clientpref-os .infobox th,
	html.skin-theme-clientpref-os .infobox td,
	html.skin-theme-clientpref-os .infobox .infobox-label,
	html.skin-theme-clientpref-os .infobox .infobox-data,
	html.skin-theme-clientpref-os .infobox .infobox-full-data,
	body.skin-theme-clientpref-os .infobox th,
	body.skin-theme-clientpref-os .infobox td,
	body.skin-theme-clientpref-os .infobox .infobox-label,
	body.skin-theme-clientpref-os .infobox .infobox-data,
	body.skin-theme-clientpref-os .infobox .infobox-full-data {
		background-color: #1e1e1e;
		color: #d0d0d0;
		border-color: #444;
	}

	html.skin-theme-clientpref-os .infobox .infobox-above,
	html.skin-theme-clientpref-os .infobox .infobox-title,
	html.skin-theme-clientpref-os .infobox .infobox-header,
	html.skin-theme-clientpref-os .infobox .infobox-subheader,
	html.skin-theme-clientpref-os .infobox .infobox-below,
	html.skin-theme-clientpref-os .infobox caption,
	html.skin-theme-clientpref-os .infobox th[colspan],
	body.skin-theme-clientpref-os .infobox .infobox-above,
	body.skin-theme-clientpref-os .infobox .infobox-title,
	body.skin-theme-clientpref-os .infobox .infobox-header,
	body.skin-theme-clientpref-os .infobox .infobox-subheader,
	body.skin-theme-clientpref-os .infobox .infobox-below,
	body.skin-theme-clientpref-os .infobox caption,
	body.skin-theme-clientpref-os .infobox th[colspan] {
		background-color: #1B223D !important;
		color: #e0f0ff !important;
		border-color: #3a506b;
	}

	html.skin-theme-clientpref-os .infobox a:link,
	html.skin-theme-clientpref-os .infobox a:visited,
	body.skin-theme-clientpref-os .infobox a:link,
	body.skin-theme-clientpref-os .infobox a:visited {
		color: #88ccff;
	}
}