Aide:Charte graphique
Autres actions
Cette page documente les conventions visuelles du wiki Nefald. Elle est la référence pour tout contributeur créant des modèles ou des tableaux.
Couleur principale
La couleur de marque est définie via le système OKLCH du skin Citizen. La teinte actuelle est 230 (bleu-acier).
Pour modifier la teinte globale, éditer MediaWiki:Citizen.css et changer
la valeur de --color-progressive-oklch__h.
| Variable | Rôle | Valeur actuelle |
|---|---|---|
--color-progressive-oklch__h |
Teinte principale | 230 |
--color-progressive-oklch__c |
Saturation | 0.1679 |
--color-progressive-oklch__l |
Luminosité | 53.25 % |
Palette sémantique
La palette sémantique Nefald est définie dans MediaWiki:Citizen.css via des
variables --nefald-*. Elle s'adapte automatiquement aux modes
clair, sombre et automatique — aucune couleur n'est codée en dur dans les modèles.
Variables par token
Chaque couleur sémantique expose trois variables :
| Token | Fond | Texte | Bordure |
|---|---|---|---|
success
|
--nefald-success-bg
|
--nefald-success-text
|
--nefald-success-border
|
danger
|
--nefald-danger-bg
|
--nefald-danger-text
|
--nefald-danger-border
|
warning
|
--nefald-warning-bg
|
--nefald-warning-text
|
--nefald-warning-border
|
info
|
--nefald-info-bg
|
--nefald-info-text
|
--nefald-info-border
|
secondary
|
--nefald-neutral-bg
|
--nefald-neutral-text
|
--nefald-neutral-border
|
Classes de cellules
Ces classes s'appliquent directement sur les cellules et
consomment les variables ci-dessus.
| Classe | Rendu | Usage recommandé | |
|---|---|---|---|
table-color-success
|
Succès | Validation, disponibilité, état positif | |
table-color-danger
|
Danger | Erreur, suppression, état critique | |
table-color-warning
|
Avertissement | Attention, déprécié, en cours | |
table-color-info
|
Information | Note, contexte, neutre positif | |
table-color-secondary
|
Neutre | Données secondaires, en-têtes alternés |
Modèle
Le modèle [[Modèle:Couleur|]] est la méthode recommandée pour utiliser la palette sémantique en wikicode. Il gère automatiquement le contexte (cellule ou badge inline).
| {{Couleur|success|En ligne}} <!-- cellule colorée -->
{{Couleur|warning|Dégradé}} <!-- badge inline dans du texte -->
Aliases acceptés : vert, rouge, jaune,
bleu, gris, neutre.
| Nom | Badge | Cellule | Syntaxe |
|---|---|---|---|
| Succès | Succès | Succès | ...
|
| Danger | Danger | Danger | ...
|
| Avertissement | Avertissement | Avertissement | ...
|
| Info | Info | Info | ...
|
| Neutre | Neutre | Neutre | ...
|
Surfaces Citizen
Ces variables sont fournies par le skin Citizen et couvrent tous les arrière-plans.
Surface 0
--color-surface-0
Surface 1
--color-surface-1
Surface 2
--color-surface-2
Surface 3
--color-surface-3
Surface 4
--color-surface-4
Progressive
--color-progressive
Emphasized
--color-emphasized
Subtle
--color-subtle
Link
--color-link
Typographie
| Variable | Police | Usage |
|---|---|---|
--font-family-citizen-base |
Roboto | Corps de texte |
--font-family-citizen-serif |
Roboto Serif | Citations, accents |
--font-family-citizen-monospace |
Roboto Mono | Code, éditeur |
Les titres (h1–h6) utilisent font-weight: medium via Citizen.css.
Modes de thème
| Mode | Classe CSS | Comportement |
|---|---|---|
| Clair | .skin-theme-clientpref-day |
Toujours en clair |
| Sombre | .skin-theme-clientpref-night |
Toujours en sombre |
| Automatique | .skin-theme-clientpref-os |
Suit le système |
| Noir pur | .citizen-feature-pure-black-clientpref-1 |
Variante sombre uniquement |
Les variables --nefald-* sont surchargées pour chaque mode dans
MediaWiki:Citizen.css — aucune intervention manuelle n'est nécessaire dans
les modèles.
Bonnes pratiques
- Utiliser [[Modèle:Couleur|]] pour tout coloriage sémantique dans les tableaux.
- Utiliser les variables
--nefald-*ou--color-*(Citizen) dans les styles inline, jamais de valeurs hex fixes. - Tester chaque modèle en mode clair et sombre avant publication.
- Pour les blocs d'avertissement ou d'information, préférer les modèles dédiés.
Voir aussi
- MediaWiki:Citizen.css — Palette Nefald et surcharges de thème
- Modèle:Couleur — Application de la palette en wikicode
- Aide:Modèles — Bibliothèque des modèles disponibles