Basculer le menu
Changer de menu des préférences
Basculer le menu personnel
Non connecté(e)
Votre adresse IP sera visible au public si vous faites des modifications.

« MediaWiki:Citizen.css » : différence entre les versions

Page de l’interface de MediaWiki
Hiob (discussion | contributions)
Aucun résumé des modifications
Hiob (discussion | contributions)
Aucun résumé des modifications
Ligne 6 : Ligne 6 :
/* ============================================================
/* ============================================================
  * 1. PALETTE NEFALD — Variables personnalisées
  * 1. PALETTE NEFALD — Variables personnalisées
*    Définies sur :root, surchargées par thème
  * ============================================================ */
  * ============================================================ */


:root {
:root {
/* -- Couleur progressive Citizen (hue = teinte principale) -- */
/* -- Couleur progressive Citizen -- */
/* Bleu-acier Nefald : ajuste __h pour ta teinte de marque */
--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 (couleur de marque directe) */
/* 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
*    Usage : class="wikitable" + class="table-color-success" sur <td>
  * ============================================================ */
  * ============================================================ */


.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-bg) !important;
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;
}
}


/* Transition et hover */
.table-color-success,
.table-color-success,
.table-color-danger,
.table-color-danger,
Ligne 168 : Ligne 184 :
}
}


/* Code dans les cellules colorées */
.table-color-success code,
.table-color-success code,
.table-color-danger code,
.table-color-danger code,
Ligne 191 : Ligne 206 :
}
}


/* Focus accessibilité */
.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 :
  * ============================================================ */
  * ============================================================ */


/* Suppression de l'espace bas géré par le portlet footer */
.citizen-drawer__menu {
.citizen-drawer__menu {
margin-bottom: 0;
margin-bottom: 0;
Ligne 224 : Ligne 235 :
}
}


/* Portlet liens externes — sticky en bas du drawer */
.mw-portlet-External {
.mw-portlet-External {
position: sticky;
position: sticky;
Ligne 251 : Ligne 261 :
}
}


/* Labels de section sidebar */
.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 :
}
}


/* Icônes sidebar (masque SVG) */
.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 :
}
}


/* Icônes réseaux sociaux */
#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 :
}
}


/* Icônes footer custom */
#footer-icons a {
#footer-icons a {
border: 0;
border: 0;
Les témoins (''cookies'') nous aident à fournir nos services. En utilisant nos services, vous acceptez notre utilisation de témoins.