MediaWiki:Citizen.css: Difference between revisions
MediaWiki interface page
More actions
Created page with "→All CSS here will be loaded for users of the Citizen skin: @import url('https://fonts.googleapis.com/css2?family=Inter:[email protected]&display=swap'); :root { --font-family-citizen-base: 'Inter', sans-serif; }" |
No edit summary |
||
| (13 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* All CSS here will be loaded for users of the Citizen skin */ | /* All CSS here will be loaded for users of the Citizen skin */ | ||
/* Generated from Material Theme Builder export 2026-03-11 — seed: #6A7D55 */ | |||
/* ── Global / progressive accent ────────────────────────────────────────── */ | |||
/* primary-50: #6A7D55 */ | |||
:root { | :root { | ||
-- | --color-progressive-oklch__l: 0.5190; | ||
--color-progressive-oklch__c: 0.0820; | |||
--color-progressive-oklch__h: 122.32; | |||
--color-destructive-oklch__l: 0.4440; | |||
--color-destructive-oklch__c: 0.1880; | |||
--color-destructive-oklch__h: 29.23; | |||
--transform-image-hover: none; | |||
} | |||
/* ── Light mode ──────────────────────────────────────────────────────────── */ | |||
/* surface-0 → #FFFFFF */ | |||
/* surface-1 → #F5F4EE surfaceContainerLow */ | |||
/* surface-2 → #EFEEE8 surfaceContainer */ | |||
/* surface-3 → #EAE8E3 surfaceContainerHigh */ | |||
/* surface-4 → #E4E2DD surfaceContainerHighest */ | |||
/* base/emphasized → #1B1C19 onBackground */ | |||
/* subtle → #45483F onSurfaceVariant */ | |||
/* link → #52643E primary */ | |||
:root.skin-theme-clientpref-day { | |||
--color-surface-0-oklch__l: 1.0000; | |||
--color-surface-0-oklch__c: 0.0000; | |||
--color-surface-0-oklch__h: 0.00; | |||
--color-surface-1-oklch__l: 0.9650; | |||
--color-surface-1-oklch__c: 0.0095; | |||
--color-surface-1-oklch__h: 109.60; | |||
--color-surface-2-oklch__l: 0.9420; | |||
--color-surface-2-oklch__c: 0.0115; | |||
--color-surface-2-oklch__h: 109.60; | |||
--color-surface-3-oklch__l: 0.9230; | |||
--color-surface-3-oklch__c: 0.0120; | |||
--color-surface-3-oklch__h: 109.60; | |||
--color-surface-4-oklch__l: 0.9020; | |||
--color-surface-4-oklch__c: 0.0130; | |||
--color-surface-4-oklch__h: 109.60; | |||
--color-base-oklch__l: 0.1480; | |||
--color-base-oklch__c: 0.0075; | |||
--color-base-oklch__h: 109.60; | |||
--color-emphasized-oklch__l: 0.1480; | |||
--color-emphasized-oklch__c: 0.0075; | |||
--color-emphasized-oklch__h: 109.60; | |||
--color-subtle-oklch__l: 0.3180; | |||
--color-subtle-oklch__c: 0.0170; | |||
--color-subtle-oklch__h: 109.60; | |||
--color-link-oklch__l: 0.8120; | |||
--color-link-oklch__c: 0.0490; | |||
--color-link-oklch__h: 192.50; | |||
--color-visited-oklch__l: 0.8120; | |||
--color-visited-oklch__c: 0.0490; | |||
--color-visited-oklch__h: 192.50; | |||
--background-color-progressive-oklch__l: 0.4220; | |||
--background-color-progressive-oklch__c: 0.0720; | |||
--background-color-progressive-oklch__h: 126.50; | |||
--backdrop-filter-frosted-glass: none; | |||
--opacity-glass: 1; | |||
} | |||
/* ── Dark mode ───────────────────────────────────────────────────────────── */ | |||
/* surface-0 → #131411 background/surfaceDim */ | |||
/* surface-1 → #1B1C19 surfaceContainerLow */ | |||
/* surface-2 → #1F201D surfaceContainer */ | |||
/* surface-3 → #292A27 surfaceContainerHigh */ | |||
/* surface-4 → #343531 surfaceContainerHighest */ | |||
/* base/emphasized → #E4E2DD onBackground */ | |||
/* subtle → #C5C8BB onSurfaceVariant */ | |||
/* link → #B9CD9F primary (dark scheme) */ | |||
:root.skin-theme-clientpref-night { | |||
--color-surface-0-oklch__l: 0.0940; | |||
--color-surface-0-oklch__c: 0.0070; | |||
--color-surface-0-oklch__h: 109.60; | |||
--color-surface-1-oklch__l: 0.1480; | |||
--color-surface-1-oklch__c: 0.0075; | |||
--color-surface-1-oklch__h: 109.60; | |||
--color-surface-2-oklch__l: 0.1680; | |||
--color-surface-2-oklch__c: 0.0075; | |||
--color-surface-2-oklch__h: 109.60; | |||
--color-surface-3-oklch__l: 0.2100; | |||
--color-surface-3-oklch__c: 0.0080; | |||
--color-surface-3-oklch__h: 109.60; | |||
--color-surface-4-oklch__l: 0.2560; | |||
--color-surface-4-oklch__c: 0.0085; | |||
--color-surface-4-oklch__h: 109.60; | |||
--color-base-oklch__l: 0.9020; | |||
--color-base-oklch__c: 0.0130; | |||
--color-base-oklch__h: 109.60; | |||
--color-emphasized-oklch__l: 0.9020; | |||
--color-emphasized-oklch__c: 0.0130; | |||
--color-emphasized-oklch__h: 109.60; | |||
--color-subtle-oklch__l: 0.7980; | |||
--color-subtle-oklch__c: 0.0175; | |||
--color-subtle-oklch__h: 109.60; | |||
--color-link-oklch__l: 0.8120; | |||
--color-link-oklch__c: 0.0490; | |||
--color-link-oklch__h: 192.50; | |||
--color-visited-oklch__l: 0.8120; | |||
--color-visited-oklch__c: 0.0490; | |||
--color-visited-oklch__h: 192.50; | |||
--background-color-progressive-oklch__l: 0.8120; | |||
--background-color-progressive-oklch__c: 0.0720; | |||
--background-color-progressive-oklch__h: 126.50; | |||
} | } | ||
Latest revision as of 12:17, 17 March 2026
/* All CSS here will be loaded for users of the Citizen skin */
/* Generated from Material Theme Builder export 2026-03-11 — seed: #6A7D55 */
/* ── Global / progressive accent ────────────────────────────────────────── */
/* primary-50: #6A7D55 */
:root {
--color-progressive-oklch__l: 0.5190;
--color-progressive-oklch__c: 0.0820;
--color-progressive-oklch__h: 122.32;
--color-destructive-oklch__l: 0.4440;
--color-destructive-oklch__c: 0.1880;
--color-destructive-oklch__h: 29.23;
--transform-image-hover: none;
}
/* ── Light mode ──────────────────────────────────────────────────────────── */
/* surface-0 → #FFFFFF */
/* surface-1 → #F5F4EE surfaceContainerLow */
/* surface-2 → #EFEEE8 surfaceContainer */
/* surface-3 → #EAE8E3 surfaceContainerHigh */
/* surface-4 → #E4E2DD surfaceContainerHighest */
/* base/emphasized → #1B1C19 onBackground */
/* subtle → #45483F onSurfaceVariant */
/* link → #52643E primary */
:root.skin-theme-clientpref-day {
--color-surface-0-oklch__l: 1.0000;
--color-surface-0-oklch__c: 0.0000;
--color-surface-0-oklch__h: 0.00;
--color-surface-1-oklch__l: 0.9650;
--color-surface-1-oklch__c: 0.0095;
--color-surface-1-oklch__h: 109.60;
--color-surface-2-oklch__l: 0.9420;
--color-surface-2-oklch__c: 0.0115;
--color-surface-2-oklch__h: 109.60;
--color-surface-3-oklch__l: 0.9230;
--color-surface-3-oklch__c: 0.0120;
--color-surface-3-oklch__h: 109.60;
--color-surface-4-oklch__l: 0.9020;
--color-surface-4-oklch__c: 0.0130;
--color-surface-4-oklch__h: 109.60;
--color-base-oklch__l: 0.1480;
--color-base-oklch__c: 0.0075;
--color-base-oklch__h: 109.60;
--color-emphasized-oklch__l: 0.1480;
--color-emphasized-oklch__c: 0.0075;
--color-emphasized-oklch__h: 109.60;
--color-subtle-oklch__l: 0.3180;
--color-subtle-oklch__c: 0.0170;
--color-subtle-oklch__h: 109.60;
--color-link-oklch__l: 0.8120;
--color-link-oklch__c: 0.0490;
--color-link-oklch__h: 192.50;
--color-visited-oklch__l: 0.8120;
--color-visited-oklch__c: 0.0490;
--color-visited-oklch__h: 192.50;
--background-color-progressive-oklch__l: 0.4220;
--background-color-progressive-oklch__c: 0.0720;
--background-color-progressive-oklch__h: 126.50;
--backdrop-filter-frosted-glass: none;
--opacity-glass: 1;
}
/* ── Dark mode ───────────────────────────────────────────────────────────── */
/* surface-0 → #131411 background/surfaceDim */
/* surface-1 → #1B1C19 surfaceContainerLow */
/* surface-2 → #1F201D surfaceContainer */
/* surface-3 → #292A27 surfaceContainerHigh */
/* surface-4 → #343531 surfaceContainerHighest */
/* base/emphasized → #E4E2DD onBackground */
/* subtle → #C5C8BB onSurfaceVariant */
/* link → #B9CD9F primary (dark scheme) */
:root.skin-theme-clientpref-night {
--color-surface-0-oklch__l: 0.0940;
--color-surface-0-oklch__c: 0.0070;
--color-surface-0-oklch__h: 109.60;
--color-surface-1-oklch__l: 0.1480;
--color-surface-1-oklch__c: 0.0075;
--color-surface-1-oklch__h: 109.60;
--color-surface-2-oklch__l: 0.1680;
--color-surface-2-oklch__c: 0.0075;
--color-surface-2-oklch__h: 109.60;
--color-surface-3-oklch__l: 0.2100;
--color-surface-3-oklch__c: 0.0080;
--color-surface-3-oklch__h: 109.60;
--color-surface-4-oklch__l: 0.2560;
--color-surface-4-oklch__c: 0.0085;
--color-surface-4-oklch__h: 109.60;
--color-base-oklch__l: 0.9020;
--color-base-oklch__c: 0.0130;
--color-base-oklch__h: 109.60;
--color-emphasized-oklch__l: 0.9020;
--color-emphasized-oklch__c: 0.0130;
--color-emphasized-oklch__h: 109.60;
--color-subtle-oklch__l: 0.7980;
--color-subtle-oklch__c: 0.0175;
--color-subtle-oklch__h: 109.60;
--color-link-oklch__l: 0.8120;
--color-link-oklch__c: 0.0490;
--color-link-oklch__h: 192.50;
--color-visited-oklch__l: 0.8120;
--color-visited-oklch__c: 0.0490;
--color-visited-oklch__h: 192.50;
--background-color-progressive-oklch__l: 0.8120;
--background-color-progressive-oklch__c: 0.0720;
--background-color-progressive-oklch__h: 126.50;
}