« MediaWiki:Citizen.css » : différence entre les versions
Page de l’interface de MediaWiki
Autres actions
Aucun résumé des modifications |
Aucun résumé des modifications |
||
| Ligne 6 : | Ligne 6 : | ||
/* ============================================================ | /* ============================================================ | ||
* 1. PALETTE NEFALD — Variables personnalisées | * 1. PALETTE NEFALD — Variables personnalisées | ||
* ============================================================ */ | * ============================================================ */ | ||
:root { | :root { | ||
/* -- Couleur progressive Citizen | /* -- Couleur progressive Citizen -- */ | ||
--color-progressive-oklch__l: 53.25%; | --color-progressive-oklch__l: 53.25%; | ||
--color-progressive-oklch__c: 0.1679; | --color-progressive-oklch__c: 0.1679; | ||
| Ligne 17 : | Ligne 15 : | ||
/* -- Palette sémantique Nefald (light par défaut) -- */ | /* -- Palette sémantique Nefald (light par défaut) -- */ | ||
/* Success */ | /* Success */ | ||
--nefald-success-bg: oklch(93% 0.08 145); | --nefald-success-bg: oklch(93% 0.08 145); | ||
--nefald-success-text: oklch(35% 0.12 145); | --nefald-success-text: oklch(35% 0.12 145); | ||
--nefald-success-border: oklch(75% 0.14 145); | --nefald-success-border: oklch(75% 0.14 145); | ||
/* Danger */ | /* Danger */ | ||
--nefald-danger-bg: oklch(93% 0.07 25); | --nefald-danger-bg: oklch(93% 0.07 25); | ||
--nefald-danger-text: oklch(38% 0.14 25); | --nefald-danger-text: oklch(38% 0.14 25); | ||
--nefald-danger-border: oklch(70% 0.16 25); | --nefald-danger-border: oklch(70% 0.16 25); | ||
/* Warning */ | /* Warning */ | ||
--nefald-warning-bg: oklch(95% 0.09 85); | --nefald-warning-bg: oklch(95% 0.09 85); | ||
--nefald-warning-text: oklch(42% 0.13 75); | --nefald-warning-text: oklch(42% 0.13 75); | ||
--nefald-warning-border: oklch(78% 0.15 85); | --nefald-warning-border: oklch(78% 0.15 85); | ||
/* Info */ | /* Info */ | ||
--nefald-info-bg: oklch(93% 0.06 230); | --nefald-info-bg: oklch(93% 0.06 230); | ||
--nefald-info-text: oklch(38% 0.12 230); | --nefald-info-text: oklch(38% 0.12 230); | ||
--nefald-info-border: oklch(72% 0.14 230); | --nefald-info-border: oklch(72% 0.14 230); | ||
/* Neutral */ | /* Neutral */ | ||
--nefald-neutral-bg: oklch(94% 0.01 230); | --nefald-neutral-bg: oklch(94% 0.01 230); | ||
--nefald-neutral-text: oklch(40% 0.02 230); | --nefald-neutral-text: oklch(40% 0.02 230); | ||
--nefald-neutral-border: oklch(78% 0.02 230); | --nefald-neutral-border: oklch(78% 0.02 230); | ||
/* Accent | /* Accent */ | ||
--nefald-accent: oklch(53.25% 0.1679 230); | --nefald-accent: oklch(53.25% 0.1679 230); | ||
--nefald-accent-subtle: oklch(93% 0.05 230); | --nefald-accent-subtle: oklch(93% 0.05 230); | ||
/* -- Variables Roadmap (dérivées de la palette) -- */ | |||
--roadmap-idea-bg: var(--nefald-neutral-bg); | |||
--roadmap-idea-text: var(--nefald-neutral-text); | |||
--roadmap-idea-border: var(--nefald-neutral-border); | |||
--roadmap-planned-bg: var(--nefald-warning-bg); | |||
--roadmap-planned-text: var(--nefald-warning-text); | |||
--roadmap-planned-border: var(--nefald-warning-border); | |||
--roadmap-inprogress-bg: var(--nefald-info-bg); | |||
--roadmap-inprogress-text: var(--nefald-info-text); | |||
--roadmap-inprogress-border: var(--nefald-info-border); | |||
--roadmap-done-bg: var(--nefald-success-bg); | |||
--roadmap-done-text: var(--nefald-success-text); | |||
--roadmap-done-border: var(--nefald-success-border); | |||
--roadmap-cancelled-bg: var(--nefald-danger-bg); | |||
--roadmap-cancelled-text: var(--nefald-danger-text); | |||
--roadmap-cancelled-border: var(--nefald-danger-border); | |||
} | } | ||
/* -- Mode sombre (manuel) -- */ | /* -- Mode sombre (manuel) -- */ | ||
:root.skin-theme-clientpref-night { | :root.skin-theme-clientpref-night { | ||
--nefald-success-bg: oklch(28% 0.09 145); | --nefald-success-bg: oklch(28% 0.09 145); | ||
--nefald-success-text: oklch(82% 0.12 145); | --nefald-success-text: oklch(82% 0.12 145); | ||
--nefald-success-border: oklch(45% 0.12 145); | --nefald-success-border: oklch(45% 0.12 145); | ||
--nefald-danger-bg: oklch(28% 0.09 25); | --nefald-danger-bg: oklch(28% 0.09 25); | ||
--nefald-danger-text: oklch(85% 0.10 25); | --nefald-danger-text: oklch(85% 0.10 25); | ||
--nefald-danger-border: oklch(48% 0.14 25); | --nefald-danger-border: oklch(48% 0.14 25); | ||
--nefald-warning-bg: oklch(30% 0.09 75); | --nefald-warning-bg: oklch(30% 0.09 75); | ||
--nefald-warning-text: oklch(88% 0.12 85); | --nefald-warning-text: oklch(88% 0.12 85); | ||
--nefald-warning-border: oklch(52% 0.14 80); | --nefald-warning-border: oklch(52% 0.14 80); | ||
--nefald-info-bg: oklch(28% 0.07 230); | --nefald-info-bg: oklch(28% 0.07 230); | ||
--nefald-info-text: oklch(84% 0.10 230); | --nefald-info-text: oklch(84% 0.10 230); | ||
--nefald-info-border: oklch(48% 0.12 230); | --nefald-info-border: oklch(48% 0.12 230); | ||
--nefald-neutral-bg: oklch(28% 0.01 230); | --nefald-neutral-bg: oklch(28% 0.01 230); | ||
--nefald-neutral-text: oklch(82% 0.02 230); | --nefald-neutral-text: oklch(82% 0.02 230); | ||
--nefald-neutral-border: oklch(45% 0.02 230); | --nefald-neutral-border: oklch(45% 0.02 230); | ||
--nefald-accent: oklch(65% 0.18 230); | --nefald-accent: oklch(65% 0.18 230); | ||
--nefald-accent-subtle: oklch(28% 0.07 230); | --nefald-accent-subtle: oklch(28% 0.07 230); | ||
} | } | ||
| Ligne 76 : | Ligne 96 : | ||
@media (prefers-color-scheme: dark) { | @media (prefers-color-scheme: dark) { | ||
:root.skin-theme-clientpref-os { | :root.skin-theme-clientpref-os { | ||
--nefald-success-bg: oklch(28% 0.09 145); | --nefald-success-bg: oklch(28% 0.09 145); | ||
--nefald-success-text: oklch(82% 0.12 145); | --nefald-success-text: oklch(82% 0.12 145); | ||
--nefald-success-border: oklch(45% 0.12 145); | --nefald-success-border: oklch(45% 0.12 145); | ||
--nefald-danger-bg: oklch(28% 0.09 25); | --nefald-danger-bg: oklch(28% 0.09 25); | ||
--nefald-danger-text: oklch(85% 0.10 25); | --nefald-danger-text: oklch(85% 0.10 25); | ||
--nefald-danger-border: oklch(48% 0.14 25); | --nefald-danger-border: oklch(48% 0.14 25); | ||
--nefald-warning-bg: oklch(30% 0.09 75); | --nefald-warning-bg: oklch(30% 0.09 75); | ||
--nefald-warning-text: oklch(88% 0.12 85); | --nefald-warning-text: oklch(88% 0.12 85); | ||
--nefald-warning-border: oklch(52% 0.14 80); | --nefald-warning-border: oklch(52% 0.14 80); | ||
--nefald-info-bg: oklch(28% 0.07 230); | --nefald-info-bg: oklch(28% 0.07 230); | ||
--nefald-info-text: oklch(84% 0.10 230); | --nefald-info-text: oklch(84% 0.10 230); | ||
--nefald-info-border: oklch(48% 0.12 230); | --nefald-info-border: oklch(48% 0.12 230); | ||
--nefald-neutral-bg: oklch(28% 0.01 230); | --nefald-neutral-bg: oklch(28% 0.01 230); | ||
--nefald-neutral-text: oklch(82% 0.02 230); | --nefald-neutral-text: oklch(82% 0.02 230); | ||
--nefald-neutral-border: oklch(45% 0.02 230); | --nefald-neutral-border: oklch(45% 0.02 230); | ||
--nefald-accent: oklch(65% 0.18 230); | --nefald-accent: oklch(65% 0.18 230); | ||
--nefald-accent-subtle: oklch(28% 0.07 230); | --nefald-accent-subtle: oklch(28% 0.07 230); | ||
} | } | ||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
| Ligne 114 : | Ligne 133 : | ||
letter-spacing: 0.0125em; | letter-spacing: 0.0125em; | ||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
* 3. TABLEAUX — Classes sémantiques | * 3. TABLEAUX — Classes sémantiques | ||
* ============================================================ */ | * ============================================================ */ | ||
.table-color-success { | .table-color-success { | ||
background-color: var(--nefald-success-bg) !important; | background-color: var(--nefald-success-bg) !important; | ||
color: var(--nefald-success-text) !important; | color: var(--nefald-success-text) !important; | ||
border-left: 3px solid var(--nefald-success-border) !important; | border-left: 3px solid var(--nefald-success-border) !important; | ||
} | } | ||
| Ligne 129 : | Ligne 146 : | ||
.table-color-danger { | .table-color-danger { | ||
background-color: var(--nefald-danger-bg) !important; | background-color: var(--nefald-danger-bg) !important; | ||
color: var(--nefald-danger-text) !important; | color: var(--nefald-danger-text) !important; | ||
border-left: 3px solid var(--nefald-danger-border) !important; | border-left: 3px solid var(--nefald-danger-border) !important; | ||
} | } | ||
| Ligne 135 : | Ligne 152 : | ||
.table-color-warning { | .table-color-warning { | ||
background-color: var(--nefald-warning-bg) !important; | background-color: var(--nefald-warning-bg) !important; | ||
color: var(--nefald-warning- | color: var(--nefald-warning-text) !important; /* corrigé : était --warning-bg */ | ||
border-left: 3px solid var(--nefald-warning-border) !important; | border-left: 3px solid var(--nefald-warning-border) !important; | ||
} | } | ||
| Ligne 141 : | Ligne 158 : | ||
.table-color-info { | .table-color-info { | ||
background-color: var(--nefald-info-bg) !important; | background-color: var(--nefald-info-bg) !important; | ||
color: var(--nefald-info-text) !important; | color: var(--nefald-info-text) !important; | ||
border-left: 3px solid var(--nefald-info-border) !important; | border-left: 3px solid var(--nefald-info-border) !important; | ||
} | } | ||
| Ligne 147 : | Ligne 164 : | ||
.table-color-secondary { | .table-color-secondary { | ||
background-color: var(--nefald-neutral-bg) !important; | background-color: var(--nefald-neutral-bg) !important; | ||
color: var(--nefald-neutral-text) !important; | color: var(--nefald-neutral-text) !important; | ||
border-left: 3px solid var(--nefald-neutral-border) !important; | border-left: 3px solid var(--nefald-neutral-border) !important; | ||
} | } | ||
.table-color-success, | .table-color-success, | ||
.table-color-danger, | .table-color-danger, | ||
| Ligne 168 : | Ligne 184 : | ||
} | } | ||
.table-color-success code, | .table-color-success code, | ||
.table-color-danger code, | .table-color-danger code, | ||
| Ligne 191 : | Ligne 206 : | ||
} | } | ||
.table-color-success:focus-within, | .table-color-success:focus-within, | ||
.table-color-danger:focus-within, | .table-color-danger:focus-within, | ||
| Ligne 200 : | Ligne 214 : | ||
outline-offset: -2px; | outline-offset: -2px; | ||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
| Ligne 212 : | Ligne 225 : | ||
} | } | ||
} | } | ||
/* ============================================================ | /* ============================================================ | ||
| Ligne 218 : | Ligne 230 : | ||
* ============================================================ */ | * ============================================================ */ | ||
.citizen-drawer__menu { | .citizen-drawer__menu { | ||
margin-bottom: 0; | margin-bottom: 0; | ||
| Ligne 224 : | Ligne 235 : | ||
} | } | ||
.mw-portlet-External { | .mw-portlet-External { | ||
position: sticky; | position: sticky; | ||
| Ligne 251 : | Ligne 261 : | ||
} | } | ||
.citizen-drawer__menu [id^="n-sidebar-label-"] a { | .citizen-drawer__menu [id^="n-sidebar-label-"] a { | ||
pointer-events: none; | pointer-events: none; | ||
| Ligne 264 : | Ligne 273 : | ||
} | } | ||
.citizen-drawer__menu [id^="n-sidebar-icon-"] a { | .citizen-drawer__menu [id^="n-sidebar-icon-"] a { | ||
font-size: 0; | font-size: 0; | ||
| Ligne 281 : | Ligne 289 : | ||
} | } | ||
#n-sidebar-icon-bluesky a:before { mask-image: url(https://wiki.nefald.fr/images/2/21/IconButton-bluesky.svg); } | #n-sidebar-icon-bluesky a:before { mask-image: url(https://wiki.nefald.fr/images/2/21/IconButton-bluesky.svg); } | ||
#n-sidebar-icon-discord a:before { mask-image: url(https://wiki.nefald.fr/images/9/9c/Discord_Icons.svg); } | #n-sidebar-icon-discord a:before { mask-image: url(https://wiki.nefald.fr/images/9/9c/Discord_Icons.svg); } | ||
| Ligne 294 : | Ligne 301 : | ||
#n-sidebar-icon-twitter a:before { mask-image: url(https://wiki.nefald.fr/images/3/35/ButtonLink-twitter.svg); } | #n-sidebar-icon-twitter a:before { mask-image: url(https://wiki.nefald.fr/images/3/35/ButtonLink-twitter.svg); } | ||
#n-sidebar-icon-youtube a:before { mask-image: url(https://wiki.nefald.fr/images/6/64/IconButton-youtube.svg); } | #n-sidebar-icon-youtube a:before { mask-image: url(https://wiki.nefald.fr/images/6/64/IconButton-youtube.svg); } | ||
/* ============================================================ | /* ============================================================ | ||
| Ligne 309 : | Ligne 315 : | ||
} | } | ||
#footer-icons a { | #footer-icons a { | ||
border: 0; | border: 0; | ||