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:Common.css » : différence entre les versions

Page de l’interface de MediaWiki
Aucun résumé des modifications
Aucun résumé des modifications
 
(Une version intermédiaire par le même utilisateur non affichée)
Ligne 1 : Ligne 1 :
/* =====================================================================
/* =====================================================================
   LES INTRÉPIDES Thème MediaWiki, autonome (un seul fichier)
   NAOKO déclarations @font-face (woff2, toutes graisses + italiques)
   ---------------------------------------------------------------------
   ---------------------------------------------------------------------
   POSE : colle TOUT ce fichier dans UNE seule page → MediaWiki:Common.css
   1. Noms de fichiers = gamme réelle (vérifiée). Pas de SemiBold 600 :
          (droits admin / editinterface), Enregistre, puis purge le cache.
      une demande de 600 résoudra vers Bold 700.
   → Rien d'autre à toucher. Il remplace les deux fichiers précédents :
  1bis. Anciennement ls /home/<user>/web/wiki.intrepides.paris/public_html/fonts/
    si tu avais déjà collé quelque chose dans MediaWiki:Citizen.css,
      et ajuste les url() ci-dessous si la casse ou les tirets diffèrent.
    vide cette page-là.
   2. Colle ce bloc EN HAUT de MediaWiki:Common.css, À LA PLACE de la
 
      ancienne ligne @import Google — désormais tout est auto-hébergé,
  Il fait tout : tokens du skin Citizen (accent, surfaces, polices)
      (Naoko est l'unique famille de la charte : display ET corps).
  ET habillage du contenu (titres, liens, tableaux, infobox, code,
   3. Supprime les blocs des graisses que tu n'as pas : chaque fichier
  citations, sommaire, recherche, vignettes). Le mode sombre est préservé
      manquant déclaré = une 404 au chargement (inoffensif mais sale).
   (les fonds clairs sont scoppés au thème jour).
  Toute la charte est en haut — une couleur = une ligne.
   ===================================================================== */
   ===================================================================== */


@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300..800&display=swap');
/* — NAOKO (auto-hébergée, /fonts/ sur le VPS) — display/titres.
    Gamme : 300/350/400/500/700/800/900 (pas de 600 : une demande de
    SemiBold résoudra vers Bold). — */
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-01-light-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-01-light-webfont.woff2') format('woff2');
   font-weight:300; font-style:normal; font-display:swap; }
   font-weight:300; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-01-light-italic-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-01-light-italic-webfont.woff2') format('woff2');
   font-weight:300; font-style:italic; font-display:swap; }
   font-weight:300; font-style:italic; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-02-semilight-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-02-semilight-webfont.woff2') format('woff2');
   font-weight:350; font-style:normal; font-display:swap; }
   font-weight:350; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-02-semilight-italic-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-02-semilight-italic-webfont.woff2') format('woff2');
   font-weight:350; font-style:italic; font-display:swap; }
   font-weight:350; font-style:italic; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-03-regular-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-03-regular-webfont.woff2') format('woff2');
   font-weight:400; font-style:normal; font-display:swap; }
   font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-03-regular-italic-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-03-regular-italic-webfont.woff2') format('woff2');
   font-weight:400; font-style:italic; font-display:swap; }
   font-weight:400; font-style:italic; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-04-medium-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-04-medium-webfont.woff2') format('woff2');
   font-weight:500; font-style:normal; font-display:swap; }
   font-weight:500; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-04-medium-italic-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-04-medium-italic-webfont.woff2') format('woff2');
   font-weight:500; font-style:italic; font-display:swap; }
   font-weight:500; font-style:italic; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-05-bold-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-05-bold-webfont.woff2') format('woff2');
   font-weight:700; font-style:normal; font-display:swap; }
   font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-05-bold-italic-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-05-bold-italic-webfont.woff2') format('woff2');
   font-weight:700; font-style:italic; font-display:swap; }
   font-weight:700; font-style:italic; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-06-extrabold-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-06-extrabold-webfont.woff2') format('woff2');
   font-weight:800; font-style:normal; font-display:swap; }
   font-weight:800; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-06-extrabold-italic-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-06-extrabold-italic-webfont.woff2') format('woff2');
   font-weight:800; font-style:italic; font-display:swap; }
   font-weight:800; font-style:italic; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-07-black-webfont.woff2') format('woff2');
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-07-black-webfont.woff2') format('woff2');
   font-weight:900; font-style:normal; font-display:swap; }
   font-weight:900; font-style:normal; font-display:swap; }
Ligne 49 : Ligne 48 :
   font-weight:900; font-style:italic; font-display:swap; }
   font-weight:900; font-style:italic; font-display:swap; }


:root{
/* =====================================================================
  /* — Charte (pour nos propres règles) — */
   BRANCHEMENT — décommente UNE des deux options dans le :root du thème
  --itr-marine:#103a4a;  --itr-marine-900:#0a2734;
   (remplace les lignes existantes correspondantes) :
  --itr-calanque:#1f9c92; --itr-calanque-600:#178a81; --itr-calanque-100:#e3f4f2;
  --itr-brass:#c2a15a;  --itr-brass-100:#f4ecda;  --itr-coral:#e3845f;
  --itr-sand:#f6f2ea;   --itr-surface:#ffffff;
  --itr-ink:#1d3036;    --itr-muted:#6f8086;
  --itr-line:#e8e1d4;   --itr-line-soft:#f0ebe1;
  --itr-font-ui:"Plus Jakarta Sans",-apple-system,"Segoe UI",sans-serif;
  --itr-font-display:"Naoko","Plus Jakarta Sans",sans-serif;


  /* Tokens Citizen : couleur primaire turquoise (OKLCH, depuis #1f9c92) — */
  OPTION A Naoko en police de TITRES seulement :
  --color-progressive-oklch__l: 62.67%;
  --itr-font-display:"Naoko",Georgia,serif;
  --color-progressive-oklch__c: 0.1032;
  --color-progressive-oklch__h: 186.52;
  /* — Token Citizen : police de base (juste le nom, fallbacks gérés en aval) — */
  --font-family-citizen-base: 'Plus Jakarta Sans';
}


/* === Variables du thème CLAIR ============================================
   OPTION B Naoko en police d'INTERFACE + CORPS :
  Couvre le mode Clair explicite (.day) ET le mode Automatique sur appareil
   --itr-font-ui:"Naoko",-apple-system,"Segoe UI",sans-serif;
   clair (.os + media query) sinon, en mode Auto, rien ne s'applique.
  --font-family-citizen-base:'Naoko';
  Inclut les tokens Citizen (surfaces) ET Codex (rail, pages de config,
    (cette 2e ligne est le token Citizen : elle propage Naoko au rail,
  pages spéciales — la couche design-system de MediaWiki).
      aux menus et à la recherche, pas seulement au contenu)
  Le mode sombre reste intact (non ciblé).
   ------------------------------------------------------------------------ */
:root.skin-theme-clientpref-day{
  /* Surfaces Citizen */
  --color-surface-0:#f6f2ea;  --color-surface-1:#ffffff;  --color-surface-2:#fbf9f4;
  --color-surface-3:#f0ebe1;  --color-surface-4:#e8e1d4;
  /* Texte (commun Citizen + Codex) */
  --color-base:#1d3036;  --color-emphasized:#103a4a;  --color-subtle:#6f8086;  --color-link:#178a81;
  /* Tokens Codex — rail gauche & pages de config/spéciales */
  --background-color-base:#ffffff;
  --background-color-neutral-subtle:#f6f2ea;
  --background-color-neutral:#f0ebe1;
  --background-color-interactive-subtle:#f0ebe1;
  --border-color-base:#e8e1d4;  --border-color-subtle:#f0ebe1;
  --color-progressive:#1f9c92;  --color-progressive--hover:#178a81;  --color-progressive--active:#13716a;
}
@media screen and (prefers-color-scheme:light){
  :root.skin-theme-clientpref-os{
    --color-surface-0:#f6f2ea;  --color-surface-1:#ffffff;  --color-surface-2:#fbf9f4;
    --color-surface-3:#f0ebe1;  --color-surface-4:#e8e1d4;
    --color-base:#1d3036;  --color-emphasized:#103a4a;  --color-subtle:#6f8086;  --color-link:#178a81;
    --background-color-base:#ffffff;
    --background-color-neutral-subtle:#f6f2ea;
    --background-color-neutral:#f0ebe1;
    --background-color-interactive-subtle:#f0ebe1;
    --border-color-base:#e8e1d4;  --border-color-subtle:#f0ebe1;
    --color-progressive:#1f9c92;  --color-progressive--hover:#178a81;  --color-progressive--active:#13716a;
  }
}


/* ---------- Typographie (fallback tous skins) ---------- */
  Les deux à la fois = tout le wiki en Naoko ; supprime alors l'@import
body{ background:var(--itr-sand); }
  Google Fonts entièrement.
.mw-body, .mw-body-content, #content, .mw-parser-output{
  ===================================================================== */
  font-family:var(--itr-font-ui); color:var(--itr-ink); line-height:1.65;
}
 
/* ---------- Titres (Naoko étendue + filet laiton, tous skins) ---------- */
.mw-body h1, .mw-body h2, .mw-body h3, .mw-body h4,
#firstHeading, .mw-first-heading, .firstHeading, .citizen-page-heading{
  font-family:var(--itr-font-display); color:var(--itr-marine);
  font-weight:700; letter-spacing:0; font-size:92%;
}
.mw-body h1, .mw-body h2, #firstHeading, .mw-first-heading, .firstHeading{
  border-bottom:2px solid var(--itr-brass); padding-bottom:.2em;
}
 
/* ---------- Liens ---------- */
a, a:link{ color:var(--itr-calanque-600); }
a:hover{ color:var(--itr-calanque); }
a.new, a.new:visited{ color:var(--itr-coral); }
::selection{ background:var(--itr-calanque-100); }
 
/* ---------- Tableaux (wikitable) ---------- */
.wikitable{
  border:1px solid var(--itr-line) !important; border-radius:12px;
  border-collapse:separate; border-spacing:0; overflow:hidden;
  box-shadow:0 1px 2px rgba(16,58,74,.05);
}
.wikitable > * > tr > th, .wikitable > tr > th{
  background:var(--itr-marine) !important; color:#eef4f5 !important;
  border-color:rgba(255,255,255,.15) !important;
}
.wikitable > * > tr:nth-child(even) > td{ background:var(--itr-sand); }
 
/* ---------- Infobox ---------- */
.infobox{
  background:var(--itr-surface); border:1px solid var(--itr-line-soft) !important;
  border-radius:14px; box-shadow:0 4px 14px rgba(16,58,74,.07); overflow:hidden;
}
.infobox caption, .infobox-title, .infobox > tbody > tr:first-child th{
  background:var(--itr-marine); color:#fff; font-family:var(--itr-font-display);
}
 
/* ---------- Citations ---------- */
blockquote{
  border-left:4px solid var(--itr-calanque); background:var(--itr-sand);
  border-radius:0 10px 10px 0; padding:.6em 1em; font-style:italic;
}
 
/* ---------- Code ---------- */
code, kbd, samp{ background:var(--itr-line-soft); border-radius:5px; padding:.1em .35em; font-size:.92em; }
pre, .mw-code{ background:#f1ece2; border:1px solid var(--itr-line); border-radius:10px; padding:.8em 1em; }
 
/* ---------- Sommaire (TOC) ---------- */
.toc, #toc, .vector-toc, .toccolours{
  background:var(--itr-surface); border:1px solid var(--itr-line-soft) !important;
  border-radius:12px; box-shadow:0 1px 2px rgba(16,58,74,.05);
}
.toctitle h2, .toc-title{ font-family:var(--itr-font-display); color:var(--itr-marine); border:none; }
 
/* ---------- Recherche ---------- */
#searchInput, .mw-searchInput, .cdx-text-input__input{
  border:1px solid var(--itr-line) !important; border-radius:9px !important;
}
#searchInput:focus, .cdx-text-input__input:focus{
  border-color:var(--itr-calanque) !important; box-shadow:0 0 0 3px var(--itr-calanque-100) !important; outline:none;
}
 
/* ---------- Boutons progressifs / vignettes / navboxes / catégories ---------- */
.mw-ui-button.mw-ui-progressive,
.cdx-button--action-progressive.cdx-button--weight-primary{
  background:var(--itr-calanque) !important; border-color:var(--itr-calanque) !important;
  color:#fff !important; border-radius:8px !important;
}
.thumbinner, figure.mw-default-size{
  background:var(--itr-surface); border:1px solid var(--itr-line-soft) !important;
  border-radius:12px; box-shadow:0 4px 14px rgba(16,58,74,.07);
}
.hatnote, .dablink{ background:var(--itr-sand); border-radius:8px; padding:.4em .8em; }
.navbox{ border:1px solid var(--itr-line) !important; border-radius:12px; overflow:hidden; }
.navbox-title, .navbox-group{ background:var(--itr-marine) !important; color:#fff !important; }
.catlinks{ background:var(--itr-sand) !important; border:1px solid var(--itr-line-soft) !important; border-radius:10px; }
 
/* ---------- (OPTIONNEL) En-tête marine — décommente pour tenter la barre ----------
.skin-theme-clientpref-day .citizen-header,
.skin-theme-clientpref-day .mw-header{ background-color:#103a4a; }
.skin-theme-clientpref-day .citizen-header a{ color:#eaf1f2; }
*/

Dernière version du 10 juin 2026 à 21:42

/* =====================================================================
   NAOKO — déclarations @font-face (woff2, toutes graisses + italiques)
   ---------------------------------------------------------------------
   1. Noms de fichiers = gamme réelle (vérifiée). Pas de SemiBold 600 :
      une demande de 600 résoudra vers Bold 700.
   1bis. Anciennement :  ls /home/<user>/web/wiki.intrepides.paris/public_html/fonts/
      et ajuste les url() ci-dessous si la casse ou les tirets diffèrent.
   2. Colle ce bloc EN HAUT de MediaWiki:Common.css, À LA PLACE de la
      ancienne ligne @import Google — désormais tout est auto-hébergé,
      (Naoko est l'unique famille de la charte : display ET corps).
   3. Supprime les blocs des graisses que tu n'as pas : chaque fichier
      manquant déclaré = une 404 au chargement (inoffensif mais sale).
   ===================================================================== */

@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-01-light-webfont.woff2') format('woff2');
  font-weight:300; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-01-light-italic-webfont.woff2') format('woff2');
  font-weight:300; font-style:italic; font-display:swap; }

@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-02-semilight-webfont.woff2') format('woff2');
  font-weight:350; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-02-semilight-italic-webfont.woff2') format('woff2');
  font-weight:350; font-style:italic; font-display:swap; }

@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-03-regular-webfont.woff2') format('woff2');
  font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-03-regular-italic-webfont.woff2') format('woff2');
  font-weight:400; font-style:italic; font-display:swap; }

@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-04-medium-webfont.woff2') format('woff2');
  font-weight:500; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-04-medium-italic-webfont.woff2') format('woff2');
  font-weight:500; font-style:italic; font-display:swap; }

@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-05-bold-webfont.woff2') format('woff2');
  font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-05-bold-italic-webfont.woff2') format('woff2');
  font-weight:700; font-style:italic; font-display:swap; }

@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-06-extrabold-webfont.woff2') format('woff2');
  font-weight:800; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-06-extrabold-italic-webfont.woff2') format('woff2');
  font-weight:800; font-style:italic; font-display:swap; }

@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-07-black-webfont.woff2') format('woff2');
  font-weight:900; font-style:normal; font-display:swap; }
@font-face{ font-family:'Naoko'; src:url('/fonts/naoko-07-black-italic-webfont.woff2') format('woff2');
  font-weight:900; font-style:italic; font-display:swap; }

/* =====================================================================
   BRANCHEMENT — décommente UNE des deux options dans le :root du thème
   (remplace les lignes existantes correspondantes) :

   OPTION A — Naoko en police de TITRES seulement :
   --itr-font-display:"Naoko",Georgia,serif;

   OPTION B — Naoko en police d'INTERFACE + CORPS :
   --itr-font-ui:"Naoko",-apple-system,"Segoe UI",sans-serif;
   --font-family-citizen-base:'Naoko';
     (cette 2e ligne est le token Citizen : elle propage Naoko au rail,
      aux menus et à la recherche, pas seulement au contenu)

   Les deux à la fois = tout le wiki en Naoko ; supprime alors l'@import
   Google Fonts entièrement.
   ===================================================================== */