MediaWiki:Common.css: Difference between revisions

Revision as of 23:52, 18 October 2026

/* Wird als MediaWiki:Common.css ins Wiki übernommen. Baut auf dem Nachtmodus von Vector 2022 auf und
   setzt Farben, Schrift und Flächen wie auf mutigeraffe.com. Die Farben laufen über die Design-Variablen
   des Skins, damit auch Menüs, Suche und Formulare passen. */
:root.skin-theme-clientpref-night,
:root.skin-theme-clientpref-os {
	--background-color-base: #121214;
	--background-color-neutral-subtle: #1b1b1e;
	--background-color-neutral: #222225;
	--background-color-interactive-subtle: #1b1b1e;
	--background-color-interactive: #26262a;
	--background-color-interactive--hover: #2e2e33;
	--background-color-progressive: #fb923c;
	--background-color-progressive--hover: #fdba74;
	--background-color-progressive--active: #f97316;
	--background-color-progressive-subtle: #2a1f17;
	--color-base: #f2f2ef;
	--color-emphasized: #ffffff;
	--color-subtle: #c4c4bd;
	--color-placeholder: #8f8f88;
	--color-progressive: #fb923c;
	--color-progressive--hover: #fdba74;
	--color-progressive--active: #f97316;
	--color-visited: #f5a868;
	--color-inverted: #121214;
	--color-inverted-fixed: #121214;
	--border-color-base: rgba( 255, 255, 255, 0.18 );
	--border-color-subtle: rgba( 255, 255, 255, 0.12 );
	--border-color-muted: rgba( 255, 255, 255, 0.18 );
	--border-color-progressive: #fb923c;
	--border-color-progressive--hover: #fdba74;
	--outline-color-progressive--focus: #fb923c;
}

/* Gleicher Grundton auch unterhalb des Inhalts. Vector setzt hier im Nachtmodus einen helleren Ton
   mit spezifischerem Selektor, daher !important */
html,
body {
	background-color: #121214 !important;
	min-height: 100vh;
}

/* Immer dunkel: den Umschalter für hell und dunkel im Menü "Appearance" ausblenden */
#skin-client-prefs-skin-theme {
	display: none;
}

/* Schrift wie auf der Website, auch für Überschriften statt der Serifenschrift von Vector */
body,
.mw-body h1,
.mw-body-content h1,
.mw-body-content h2,
.mw-body-content h3,
.mw-body-content h4 {
	font-family: 'Noto Sans', 'Open Sans', system-ui, sans-serif;
}
.mw-body h1.firstHeading,
.mw-body-content h2 {
	font-weight: 700;
}
.mw-body-content h3,
.mw-body-content h4 {
	font-weight: 600;
}

/* Kopfzeile mit feiner Trennlinie wie die Navigation der Website */
.vector-header-container {
	border-bottom: 1px solid var( --border-color-base );
}

/* Tabellen als dunkle Flächen mit feinem Rand */
.mw-body-content .wikitable {
	background-color: #1b1b1e;
	color: var( --color-base );
	border: 1px solid var( --border-color-base );
}
.mw-body-content .wikitable > tr > th,
.mw-body-content .wikitable > * > tr > th {
	background-color: #26262a;
	color: var( --color-emphasized );
}
.mw-body-content .wikitable > tr > th,
.mw-body-content .wikitable > tr > td,
.mw-body-content .wikitable > * > tr > th,
.mw-body-content .wikitable > * > tr > td {
	border-color: var( --border-color-base );
}

/* Infobox der Mod-Wikis: abgerundete Karte wie auf der Website */
.mw-body-content .ma-infobox {
	border-collapse: separate;
	border-spacing: 0;
	border-radius: 0.75rem;
	overflow: hidden;
}
.mw-body-content .ma-infobox > caption {
	font-size: 1.15em;
	font-weight: 700;
	padding-bottom: 0.4em;
}

/* Navigationsleiste der Mod-Wikis: orange Kopfzeile, Links in der Akzentfarbe */
.mw-body-content .ma-navbox {
	border-collapse: separate;
	border-spacing: 0;
	border-radius: 0.75rem;
	overflow: hidden;
}
.mw-body-content .ma-navbox > * > tr > th {
	background-color: #fb923c;
	color: #121214;
}
.mw-body-content .ma-navbox > * > tr > th a {
	color: #121214;
	font-size: 1.05em;
}

/* Bildergalerie: Bilder mit runden Ecken und feinem Rand */
.mw-body-content ul.gallery .gallerybox img {
	border-radius: 0.4rem;
	border: 1px solid var( --border-color-base );
}

/* Code und Inline-Code im dunklen Stil */
.mw-body-content code {
	background-color: #222225;
	color: var( --color-base );
	border-color: var( --border-color-subtle );
}