Jkuehn (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Jkuehn (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
Zeile 2: | Zeile 2: | ||
:root { | :root { | ||
--color-primary__h: 33.1; | |||
--color- | --color-primary__s: 88.5%; | ||
--color- | --color-primary__l: 47.8%; | ||
--color-primary__l: | } | ||
@media screen { | |||
:root.skin-citizen-dark { | |||
--color-primary__l: 60%; | |||
--color-base: hsl(240, 13.4%, 19%); | |||
--color-base--emphasized: hsl(var(--color-primary__h),80%,95%); | |||
--color-base--subtle: hsl(var(--color-primary__h),25%,65%); | |||
--color-surface-0: hsl(var(--color-primary__h),20%,10%); | --color-surface-0: hsl(var(--color-primary__h),20%,10%); | ||
--color-surface-1: hsl(var(--color-primary__h),25%,12%); | --color-surface-1: hsl(var(--color-primary__h),25%,12%); | ||
Zeile 11: | Zeile 18: | ||
--color-surface-3: hsl(var(--color-primary__h),15%,20%); | --color-surface-3: hsl(var(--color-primary__h),15%,20%); | ||
--color-surface-4: hsl(var(--color-primary__h),15%,25%); | --color-surface-4: hsl(var(--color-primary__h),15%,25%); | ||
--background-color-primary--hover: hsl(var(--color-primary__h),var(--color-primary__s),15%); | --background-color-primary--hover: hsl(var(--color-primary__h),var(--color-primary__s),15%); | ||
--background-color-primary--active: hsl(var(--color-primary__h),var(--color-primary__s),20%); | --background-color-primary--active: hsl(var(--color-primary__h),var(--color-primary__s),20%); | ||
Zeile 24: | Zeile 28: | ||
--filter-invert: invert(1) hue-rotate(180deg); | --filter-invert: invert(1) hue-rotate(180deg); | ||
--font-grade: -25; | --font-grade: -25; | ||
} | |||
} | } |
Version vom 3. November 2024, 14:38 Uhr
/* Das folgende CSS wird für Benutzer des Citizen-Skins geladen */
:root {
--color-primary__h: 33.1;
--color-primary__s: 88.5%;
--color-primary__l: 47.8%;
}
@media screen {
:root.skin-citizen-dark {
--color-primary__l: 60%;
--color-base: hsl(240, 13.4%, 19%);
--color-base--emphasized: hsl(var(--color-primary__h),80%,95%);
--color-base--subtle: hsl(var(--color-primary__h),25%,65%);
--color-surface-0: hsl(var(--color-primary__h),20%,10%);
--color-surface-1: hsl(var(--color-primary__h),25%,12%);
--color-surface-2: hsl(var(--color-primary__h),25%,15%);
--color-surface-3: hsl(var(--color-primary__h),15%,20%);
--color-surface-4: hsl(var(--color-primary__h),15%,25%);
--background-color-primary--hover: hsl(var(--color-primary__h),var(--color-primary__s),15%);
--background-color-primary--active: hsl(var(--color-primary__h),var(--color-primary__s),20%);
--background-color-overlay: hsla(var(--color-primary__h),20%,10%,0.95);
--background-color-overlay--lighter: hsla(var(--color-primary__h),20%,10%,0.6);
--color-surface-2--hover: hsl(var(--color-primary__h),30%,19%);
--color-surface-2--active: hsl(var(--color-primary__h),30%,11%);
--surface-shadow: var(--color-primary__h),50%,3%;
--shadow-strength: 0.8;
--filter-invert: invert(1) hue-rotate(180deg);
--font-grade: -25;
}
}