MediaWiki:Citizen.css: Difference between revisions

/* All CSS here will be loaded for users of the Citizen skin */
:root {
    --font-family-citizen-base: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --color-progressive-oklch__l: 0.5447;
    --color-progressive-oklch__c: 0.2121;
    --color-progressive-oklch__h: 23.85;
    --color-progressive-hsl__h: 352.62;
    --color-progressive-hsl__s: 82.38;
    --color-progressive-hsl__l: 44.51;
    /*--color-surface-0: */
    /*--color-surface-1: */
    /*--color-surface-2: */
    /*--color-surface-3: */
    /*--color-surface-4: */
}

:root.skin-theme-clientpref-day {
    --color-surface-0: white;
    --color-surface-1: #fff5f4;
    --color-surface-2: yellow;
    --color-surface-3: pink;
    --color-surface-4: green;
    --color-base: #000;
    --color-base--emphasized: #cf142b;
    --color-base--subtle: #cf142b;
    --color-subtle: #666;
    --color-emphasized: #000;
}

:root.skin-theme-clientpref-night {
    --color-surface-0: #212529;
    --color-surface-1: #2a272a;
    --color-surface-2: #333;
    --color-surface-3: lime;
    --color-surface-4: green;
    --color-base: #fff;
    --color-base--emphasized: #cf142b;
    --color-base--subtle: #cf142b;
    --color-subtle: #999;
    --color-emphasized: #fff;
}

@media screen and (prefers-color-scheme: dark) {
    :root.skin-theme-clientpref-os {
        --color-surface-0: #212529;
        --color-surface-1: #2a272a;
        --color-surface-2: #333;
        --color-surface-3: lime;
        --color-surface-4: green;
        --color-base: #fff;
        --color-base--emphasized: #cf142b;
        --color-base--subtle: #cf142b;
        --color-subtle: #999;
        --color-emphasized: #fff;
    }
}