MediaWiki:Citizen.css: Unterschied zwischen den Versionen

MediaWiki-Schnittstellenseite
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
Zeile 2: Zeile 2:


:root {
:root {
     /* Pink is the new black */
     --color-primary__h: 33.1;
     --color-primary__h: 36;
     --color-primary__s: 88.5%;
     --color-primary__s: 100%;
     --color-primary__l: 47.8%;
     --color-primary__l: 50%;
}
 
@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%);
    --color-base--emphasized: hsl(var(--color-primary__h),80%,95%);
    --color-base: hsl(var(--color-primary__h),25%,80%);
    --color-base--subtle: hsl(var(--color-primary__h),25%,65%);
     --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;
  }
}