MediaWiki:Citizen.css
Page de l’interface de MediaWiki
Autres actions
Note : après avoir publié vos modifications, il se peut que vous deviez forcer le rechargement complet du cache de votre navigateur pour voir les changements.
- Firefox / Safari : maintenez la touche Maj (Shift) en cliquant sur le bouton Actualiser ou appuyez sur Ctrl + F5 ou Ctrl + R (⌘ + R sur un Mac).
- Google Chrome : appuyez sur Ctrl + Maj + R (⌘ + Shift + R sur un Mac).
- Edge : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl + F5.
/* La totalité du CSS placé ici s’appliquera aux utilisateurs de l’habillage Citizen. */
/* Cache le bouton des reading preferences de Citizen */
.citizen-dropdown-summary[aria-details="citizen-preferences-dropdown__card"] {
display: none !important;
}
/* couleur du site.. */
:root.skin-theme-clientpref-day {
--color-progressive-oklch__h: 250;
--color-progressive-oklch__c: 0.20;
--color-progressive-oklch__l: 50%;
--color-surface-0: #f3f4f6; /* fond général */
--color-surface-1: #dcdfe4; /* bas de page */
--color-surface-2: #dcdfe4; /* bloc édition */
--color-surface-3: #f3f4f6; /* jaune d1d5db; inconnu */
--color-surface-4: #f3f4f6; /* orange c4c9d1; inconnu */
--color-base: #2f3440;
--color-emphasized: #111827;
--color-subtle: #6b7280;
--color-link: #0969da;
}
/* Fond de la barre sticky Citizen */
.skin-citizen .citizen-sticky-header-background {
background-color: #dcdfe4!important;
}
/* Liens vers pages inexistantes */
.skin-citizen a.new,
.skin-citizen .mw-parser-output a.new {
color: #b4232a;
}
/* Liens vers pages inexistantes au survol */
.skin-citizen a.new:hover,
.skin-citizen .mw-parser-output a.new:hover {
color: #8f1d24;
}
/* couleur code et pre façon terminal */
pre,
code,
.mw-code {
background: #161b22;
color: #e6edf3;
border: 1px solid #30363d;
border-radius: 10px;
font-family: "SFMono-Regular", "Consolas", "Liberation Mono", monospace;
}
pre {
padding: 14px 16px;
overflow-x: auto;
line-height: 1.5;
}
code {
padding: 0.15em 0.4em;
border-radius: 6px;
}
/* Citizen menus/panneaux gris clair */
.skin-citizen .citizen-menu__card,
.skin-citizen .citizen-menu__card-content,
.skin-citizen .citizen-userInfo,
.skin-citizen .citizen-command-palette,
.skin-citizen .citizen-command-palette-header,
.skin-citizen .citizen-command-palette-empty-state,
.skin-citizen .citizen-command-palette__footer {
background-color: #dcdfe4 !important;
color: #2f3440 !important;
border-color: #c4c9d1 !important;
}
.skin-citizen .citizen-menu__content a,
.skin-citizen .citizen-userInfo a {
color: #2f3440 !important;
}
.skin-citizen .citizen-menu__content a:hover,
.skin-citizen .citizen-userInfo a:hover {
background-color: #d1d5db !important;
color: #111827 !important;
}
/* Barre du haut Citizen en sombre */
.skin-citizen > .citizen-header,
.skin-citizen > .citizen-header .citizen-header__inner,
.skin-citizen > .citizen-header .citizen-header__logo {
background-color: #111827 !important;
color: #f9fafb !important;
}
/* Icônes et boutons visibles directement dans la barre du haut */
.skin-citizen > .citizen-header > .citizen-header__logo .cdx-button,
.skin-citizen > .citizen-header > .citizen-header__logo svg,
.skin-citizen > .citizen-header > .citizen-header__logo .citizen-ui-icon,
.skin-citizen > .citizen-header > .citizen-header__item > .citizen-dropdown-details > .citizen-dropdown-summary,
.skin-citizen > .citizen-header .citizen-header__end > .citizen-header__item > .citizen-dropdown-details > .citizen-dropdown-summary {
color: #f9fafb !important;
}
/* Survol uniquement des boutons de la barre du haut */
.skin-citizen > .citizen-header > .citizen-header__logo .cdx-button:hover,
.skin-citizen > .citizen-header > .citizen-header__item > .citizen-dropdown-details > .citizen-dropdown-summary:hover,
.skin-citizen > .citizen-header .citizen-header__end > .citizen-header__item > .citizen-dropdown-details > .citizen-dropdown-summary:hover {
background-color: #1f2937 !important;
color: #ffffff !important;
}
/* Inverse uniquement le petit logo de la barre du haut */
.skin-citizen > .citizen-header .citizen-header__logo > a > .mw-logo-icon {
filter: invert(1) brightness(1.2);
}
/* Sécurité : logos dans le drawer/menu utilisateur restent normaux */
.skin-citizen .citizen-drawer__logo .mw-logo-icon,
.skin-citizen .citizen-menu__card .mw-logo-icon {
filter: none !important;
}
/* Boutons principaux : noir + blanc */
.skin-citizen .cdx-button--action-progressive.cdx-button--weight-primary,
.skin-citizen .oo-ui-flaggedElement-progressive.oo-ui-flaggedElement-primary .oo-ui-buttonElement-button {
background-color: #111827 !important;
border-color: #111827 !important;
color: #f9fafb !important;
}
/* Icônes des boutons principaux */
.skin-citizen .cdx-button--action-progressive.cdx-button--weight-primary .citizen-ui-icon {
color: #f9fafb !important;
}
/* Survol inversé : blanc + noir */
.skin-citizen .cdx-button--action-progressive.cdx-button--weight-primary:hover,
.skin-citizen .oo-ui-flaggedElement-progressive.oo-ui-flaggedElement-primary .oo-ui-buttonElement-button:hover {
background-color: #f9fafb !important;
border-color: #111827 !important;
color: #111827 !important;
}
/* Icônes au survol */
.skin-citizen .cdx-button--action-progressive.cdx-button--weight-primary:hover .citizen-ui-icon {
color: #111827 !important;
}
/* TEST TEMPORAIRE : survol de tous les boutons quiet */
.skin-citizen .cdx-button--weight-quiet:hover {
background-color: #ff00ff !important;
}