MediaWiki:Citizen.css: Unterschied zwischen den Versionen

/* Das folgende CSS wird für Benutzer des Citizen-Skins geladen */

/* =====================================================================
   Cubeside-Farbschema für Citizen
   Grün nur als Akzent (Links, Buttons, Markierungen).
   Hintergründe und Schrift sind neutral – Citizen würde sie sonst
   leicht in der Akzentfarbe einfärben.
   ===================================================================== */

/* ---------- Hell ---------- */
:root {
	/* Akzentfarbe: gedecktes Cubeside-Grün (Kontrast auf Weiß ca. 6:1) */
	--color-progressive-oklch__l: 48%;
	--color-progressive-oklch__c: 0.13;
	--color-progressive-oklch__h: 138;
	--color-primary-oklch__h: 138;
	/* Fallback für ältere Browser ohne OKLCH */
	--color-progressive-hsl__h: 100;
	--color-progressive-hsl__s: 70%;
	--color-progressive-hsl__l: 26%;
	--color-primary__h: 100;
	--color-primary__s: 70%;
	--color-primary__l: 26%;

	/* Hintergründe neutral (keine Grüntönung) */
	--color-surface-0-oklch__c: 0;
	--color-surface-1-oklch__c: 0;
	--color-surface-2-oklch__c: 0;
	--color-surface-3-oklch__c: 0;
	--color-surface-4-oklch__c: 0;
	--shadow-color-oklch__c: 0;

	/* Schrift neutral */
	--color-emphasized-oklch__c: 0;
	--color-base-oklch__c: 0;
	--color-subtle-oklch__c: 0;
	--color-placeholder-oklch__c: 0;
	--color-disabled-oklch__c: 0;
}

/* ---------- Dunkel ---------- */
:root.skin-theme-clientpref-night {
	--color-progressive-oklch__l: 72%;
	--color-progressive-oklch__c: 0.15;
	--color-progressive-hsl__l: 50%;
	--color-primary__l: 50%;
	--color-emphasized-oklch__c: 0;
	--color-base-oklch__c: 0;
	--color-subtle-oklch__c: 0;
	--color-placeholder-oklch__c: 0;
	--color-disabled-oklch__c: 0;
}
@media ( prefers-color-scheme: dark ) {
	:root.skin-theme-clientpref-os {
		--color-progressive-oklch__l: 72%;
		--color-progressive-oklch__c: 0.15;
		--color-progressive-hsl__l: 50%;
		--color-primary__l: 50%;
		--color-emphasized-oklch__c: 0;
		--color-base-oklch__c: 0;
		--color-subtle-oklch__c: 0;
		--color-placeholder-oklch__c: 0;
		--color-disabled-oklch__c: 0;
	}
}

/* Standardbreite des Inhalts (Citizen-Vorgabe: 1080px) */
:root.citizen-feature-custom-width-clientpref-standard {
	--width-layout: 1080px;
}