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

De WikiPerche
Aucun résumé des modifications
Aucun résumé des modifications
Ligne 2 : Ligne 2 :


/* ============================================================
/* ============================================================
   THÈME « PERCHE NOGENTAIS » — VERSION STABLE POUR TIMELESS
   THÈME « PERCHE NOGENTAIS » — BARRE LATÉRALE + BARRE DE RECHERCHE
   ============================================================ */
   ============================================================ */


/* ---------- Fond de page ---------- */
/* ---------- Réinitialisation globale ---------- */
body.skin-timeless {
.skin-timeless body {
   background: linear-gradient(180deg, #dfe7d4 0%, #f7f5ef 340px) !important;
   background: linear-gradient(180deg, #dfe7d4 0%, #f7f5ef 340px) !important;
   color: #26251f !important;
   color: #26251f !important;
Ligne 12 : Ligne 12 :


/* ---------- Barre latérale (fond sombre) ---------- */
/* ---------- Barre latérale (fond sombre) ---------- */
.skin-timeless .ts-sidebar,
.skin-timeless .ts-sidebar .sidebar-inner,
.skin-timeless #site-navigation,
.skin-timeless #site-tools,
.skin-timeless #user-tools {
  background: #1a2018 !important;
  border: none !important;
  padding: 0.5em !important;
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.skin-timeless .ts-sidebar {
.skin-timeless .ts-sidebar {
  background: #1a2018 !important;
   border-right: 1px solid #333b2e !important;
   border-right: 1px solid #333b2e !important;
   padding: 1em !important;
   padding: 1em !important;
Ligne 19 : Ligne 31 :
}
}


.skin-timeless .ts-sidebar .sidebar-inner {
/* ---------- Barre de recherche (dans la barre latérale ou en haut) ---------- */
   background: transparent !important;
.skin-timeless #p-search,
   padding: 0 !important;
.skin-timeless .ts-sidebar #p-search,
.skin-timeless .search-box {
  background: #1a2018 !important;
  border: none !important;
  padding: 0.5em !important;
  margin-bottom: 1em !important;
}
 
.skin-timeless #p-search input[type="search"],
.skin-timeless #p-search input[type="text"] {
   background: #2a3028 !important;
  border: 1px solid #333b2e !important;
  color: #e9e7dc !important;
  width: 100% !important;
   padding: 0.5em !important;
  border-radius: 4px !important;
}
}


.skin-timeless #site-navigation,
.skin-timeless #p-search input[type="submit"],
.skin-timeless #site-tools,
.skin-timeless #p-search button {
.skin-timeless #user-tools {
   background: #8c5a2b !important;
   background: transparent !important;
   border: none !important;
   border: none !important;
   padding: 0.5em !important;
  color: #ffffff !important;
   margin-bottom: 1em !important;
   padding: 0.5em 1em !important;
  border-radius: 4px !important;
   cursor: pointer !important;
}
 
.skin-timeless #p-search input[type="submit"]:hover,
.skin-timeless #p-search button:hover {
  background: #a9c79b !important;
}
}


/* Titres des sections de la barre latérale */
/* ---------- Titres des sections (barre latérale) ---------- */
.skin-timeless #site-navigation .sidebar-chunk h2,
.skin-timeless #site-navigation .sidebar-chunk h2,
.skin-timeless #site-tools .sidebar-chunk h2,
.skin-timeless #site-tools .sidebar-chunk h2,
Ligne 42 : Ligne 75 :
   padding-bottom: 0.3em !important;
   padding-bottom: 0.3em !important;
   margin-bottom: 0.5em !important;
   margin-bottom: 0.5em !important;
  background: transparent !important;
}
}


/* Liens dans la barre latérale */
/* ---------- Liens dans la barre latérale ---------- */
.skin-timeless #site-navigation a,
.skin-timeless #site-navigation a,
.skin-timeless #site-tools a,
.skin-timeless #site-tools a,
Ligne 67 : Ligne 101 :
   border-radius: 8px !important;
   border-radius: 8px !important;
   box-shadow: 0 2px 8px rgba(47, 82, 51, 0.1) !important;
   box-shadow: 0 2px 8px rgba(47, 82, 51, 0.1) !important;
   padding: 1.4em !important;
   padding: 1.4em
  color: #26251f !important;
}
 
/* Titres dans le contenu */
.skin-timeless .mw-body h1,
.skin-timeless .mw-body h2,
.skin-timeless .mw-body h3 {
  color: #2f5233 !important;
}
 
/* ---------- Table des matières ---------- */
.skin-timeless #toc,
.skin-timeless .toc {
  background: transparent !important;
  border: none !important;
  padding-left: 0 !important;
}
 
.skin-timeless #toc::after {
  content: none !important;
}
 
/* ---------- Tableaux ---------- */
.skin-timeless table.wikitable > caption,
.skin-timeless table.infobox .infobox-title {
  background: #2f5233 !important;
  color: #ffffff !important;
  border-radius: 6px 6px 0 0 !important;
}
 
/* ---------- Pied de page ---------- */
.skin-timeless #footer,
.skin-timeless .footer {
  background: transparent !important;
  border-top: 2px solid #8c5a2b !important;
  color: #55524a !important;
}
 
.skin-timeless #footer a {
  color: #2b6cb0 !important;
}
 
/* ---------- Liens [modifier] ---------- */
.skin-timeless .mw-editsection a {
  color: #8c5a2b !important;
}
 
/* ---------- Logo et titre ---------- */
.skin-timeless #mw-header,
.skin-timeless .mw-wiki-title,
.skin-timeless .ts-logo {
  background: transparent !important;
}
 
.skin-timeless .mw-wiki-title a,
.skin-timeless .ts-logo a {
  color: #2f5233 !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px !important;
}
 
/* ---------- Onglets page/discussion ---------- */
.skin-timeless #p-page-tools,
.skin-timeless .toolset {
  border: none !important;
}
 
.skin-timeless #p-page-tools li.selected a,
.skin-timeless .ns-talk .toolset a:hover {
  color: #2f5233 !important;
  font-weight: 600 !important;
}
 
/* ---------- Mode sombre ---------- */
@media (prefers-color-scheme: dark) {
  .skin-timeless body {
    background: linear-gradient(180deg, #171d14 0%, #12160f 340px) !important;
    color: #e9e7dc !important;
  }
 
  .skin-timeless .ts-sidebar {
    background: #12160f !important;
    border-right-color: #2a3028 !important;
  }
 
  .skin-timeless #mw-content,
  .skin-timeless .mw-body {
    background: #1a2018 !important;
    border-color: #333b2e !important;
    color: #e9e7dc !important;
  }
 
  .skin-timeless .mw-body h1,
  .skin-timeless .mw-body h2,
  .skin-timeless .mw-body h3 {
    color: #a9c79b !important;
  }
 
  .skin-timeless #footer {
    color: #9aa292 !important;
  }
}
 
/* ---------- Mobile ---------- */
@media screen and (max-width: 720px) {
  .skin-timeless body {
    background: #f7f5ef !important;
  }
 
  .skin-timeless .ts-sidebar {
    background: #1a2018 !important;
    border-right: none !important;
    width: 100% !important;
    padding: 0.5em !important;
  }
 
  .skin-timeless #mw-content,
  .skin-timeless .mw-body {
    padding: 0.8em !important;
    border-radius: 0 !important;
    border-left: none !important;
    border-right: none !important;
  }
 
  .skin-timeless table.infobox {
    float: none !important;
    width: 100% !important;
    margin: 0 0 1em 0 !important;
  }
}

Version du 22 septembre 2026 à 21:52

/* Tout CSS placé ici sera chargé avec les pages accédées par les utilisateurs de l’habillage Timeless */

/* ============================================================
   THÈME « PERCHE NOGENTAIS » — BARRE LATÉRALE + BARRE DE RECHERCHE
   ============================================================ */

/* ---------- Réinitialisation globale ---------- */
.skin-timeless body {
  background: linear-gradient(180deg, #dfe7d4 0%, #f7f5ef 340px) !important;
  color: #26251f !important;
}

/* ---------- Barre latérale (fond sombre) ---------- */
.skin-timeless .ts-sidebar,
.skin-timeless .ts-sidebar .sidebar-inner,
.skin-timeless #site-navigation,
.skin-timeless #site-tools,
.skin-timeless #user-tools {
  background: #1a2018 !important;
  border: none !important;
  padding: 0.5em !important;
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.skin-timeless .ts-sidebar {
  border-right: 1px solid #333b2e !important;
  padding: 1em !important;
  width: 250px !important;
}

/* ---------- Barre de recherche (dans la barre latérale ou en haut) ---------- */
.skin-timeless #p-search,
.skin-timeless .ts-sidebar #p-search,
.skin-timeless .search-box {
  background: #1a2018 !important;
  border: none !important;
  padding: 0.5em !important;
  margin-bottom: 1em !important;
}

.skin-timeless #p-search input[type="search"],
.skin-timeless #p-search input[type="text"] {
  background: #2a3028 !important;
  border: 1px solid #333b2e !important;
  color: #e9e7dc !important;
  width: 100% !important;
  padding: 0.5em !important;
  border-radius: 4px !important;
}

.skin-timeless #p-search input[type="submit"],
.skin-timeless #p-search button {
  background: #8c5a2b !important;
  border: none !important;
  color: #ffffff !important;
  padding: 0.5em 1em !important;
  border-radius: 4px !important;
  cursor: pointer !important;
}

.skin-timeless #p-search input[type="submit"]:hover,
.skin-timeless #p-search button:hover {
  background: #a9c79b !important;
}

/* ---------- Titres des sections (barre latérale) ---------- */
.skin-timeless #site-navigation .sidebar-chunk h2,
.skin-timeless #site-tools .sidebar-chunk h2,
.skin-timeless #user-tools .sidebar-chunk h2 {
  color: #a9c79b !important;
  border-bottom: 2px solid #8c5a2b !important;
  font-size: 1em !important;
  padding-bottom: 0.3em !important;
  margin-bottom: 0.5em !important;
  background: transparent !important;
}

/* ---------- Liens dans la barre latérale ---------- */
.skin-timeless #site-navigation a,
.skin-timeless #site-tools a,
.skin-timeless #user-tools a {
  color: #e9e7dc !important;
  text-decoration: none !important;
}

.skin-timeless #site-navigation a:hover,
.skin-timeless #site-tools a:hover,
.skin-timeless #user-tools a:hover {
  background: #2a3028 !important;
  border-radius: 4px !important;
  color: #ffffff !important;
}

/* ---------- Contenu principal (fond clair) ---------- */
.skin-timeless #mw-content,
.skin-timeless .mw-body {
  background: #ffffff !important;
  border: 1px solid #d9d5c7 !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(47, 82, 51, 0.1) !important;
  padding: 1.4em