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

aucun résumé des modifications
Aucun résumé des modifications
Aucun résumé des modifications
Ligne 782 : Ligne 782 :
body.page-Accueil #firstHeading {
body.page-Accueil #firstHeading {
   display: none;
   display: none;
}
/* ============================================================
  NEPHILIM LÉGENDE — CSS tableau des Incarnations
  Classe : neph_table_NL
  À copier dans MediaWiki:Common.css
 
  Charte NL : Pourpre sombre #574B6B / Parchemin mauve #E3DEE8
  Polices : Cinzel (titres), EB Garamond (contenu)
  ============================================================ */
/* ===========================================================
  1. CONTENEUR À DÉFILEMENT HORIZONTAL
 
  USAGE MediaWiki :
  <div class="neph-scroll-table">
  {| class="wikitable neph_table_NL" ...
  |}
  </div>
  =========================================================== */
.neph-scroll-table {
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
  margin: 1.5em 0;
  border: 2px solid #33302A;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 3px 16px rgba(30, 27, 22, 0.2);
  position: relative;
}
/* Scrollbar personnalisée */
.neph-scroll-table::-webkit-scrollbar {
  height: 10px;
}
.neph-scroll-table::-webkit-scrollbar-track {
  background: #E3DEE8;
  border-radius: 0 0 8px 8px;
}
.neph-scroll-table::-webkit-scrollbar-thumb {
  background: #574B6B;
  border-radius: 5px;
  border: 2px solid #E3DEE8;
}
.neph-scroll-table::-webkit-scrollbar-thumb:hover {
  background: #6B5D80;
}
/* ===========================================================
  2. STYLE DU TABLEAU PRINCIPAL
  =========================================================== */
.neph_table_NL {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: #ffffff !important;
  color: #2A2520 !important;
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  border: none !important;
  width: max-content;
  min-width: 100%;
}
/* --- Cellules générales --- */
.neph_table_NL th,
.neph_table_NL td {
  border: 1px solid #c8c0d0 !important;
  padding: 4px 7px !important;
  vertical-align: middle !important;
  background: #ffffff !important;
  color: #2A2520 !important;
  white-space: nowrap;
}
/* --- En-têtes (th) --- */
.neph_table_NL th {
  background: #574B6B !important;
  color: #F7F6F2 !important;
  font-family: 'Cinzel', serif;
  font-weight: 600;
  font-size: 0.85em;
  letter-spacing: 0.04em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  border-color: #473D5B !important;
  border-bottom: 2px solid #33302A !important;
}
/* --- Ligne des Ères (première ligne d'en-tête) --- */
.neph_table_NL tr:first-child th {
  background: #574B6B !important;
  font-size: 0.88em;
  letter-spacing: 0.06em;
  padding: 7px 8px !important;
}
/* --- Ligne des Époques (deuxième ligne) --- */
.neph_table_NL tr:nth-child(2) td,
.neph_table_NL tr:nth-child(2) th {
  background: #E3DEE8 !important;
  color: #574B6B !important;
  font-family: 'Crimson Text', serif;
  font-size: 0.82em;
  font-weight: 600;
  text-shadow: none;
  border-bottom: 2px solid #574B6B !important;
}
/* ===========================================================
  3. COLONNES FIXES — classes explicites
 
  Utiliser class="neph-sticky-1" sur les cellules de la 1ère
  colonne et class="neph-sticky-2" sur celles de la 2ème.
  Ceci évite les bugs liés au rowspan avec :first-child.
 
  MediaWiki :
  | class="neph-sticky-1" rowspan="5" | Vécus
  | class="neph-sticky-2" | Feu
  =========================================================== */
.neph_table_NL .neph-sticky-1 {
  position: sticky !important;
  left: 0 !important;
  z-index: 8;
  background: #E3DEE8 !important;
  color: #574B6B !important;
  font-family: 'Cinzel', serif;
  font-weight: 600;
  font-size: 0.88em;
  border-right: 2px solid #574B6B !important;
  min-width: 70px;
  max-width: 120px;
  white-space: normal;
}
.neph_table_NL .neph-sticky-2 {
  position: sticky !important;
  left: 70px !important;
  z-index: 7;
  background: #E3DEE8 !important;
  color: #574B6B !important;
  font-family: 'Cinzel', serif;
  font-weight: 600;
  font-size: 0.85em;
  border-right: 2px solid #574B6B !important;
  min-width: 55px;
}
/* En-têtes sticky : z-index plus élevé */
.neph_table_NL th.neph-sticky-1 {
  z-index: 15;
  background: #574B6B !important;
  color: #F7F6F2 !important;
}
.neph_table_NL th.neph-sticky-2 {
  z-index: 14;
  background: #574B6B !important;
  color: #F7F6F2 !important;
}
/* ===========================================================
  4. LIGNES DES ÉLÉMENTS (Vécus par Ka)
  Couleurs adaptées au fond clair
  =========================================================== */
/* Feu */
.neph_table_NL .ka-feu .neph-sticky-2 {
  background: #f8e8e4 !important;
  color: #a0352a !important;
}
.neph_table_NL .ka-feu td {
  background: #fdf6f5 !important;
}
/* Air */
.neph_table_NL .ka-air .neph-sticky-2 {
  background: #e4eef6 !important;
  color: #3a6a90 !important;
}
.neph_table_NL .ka-air td {
  background: #f5f8fc !important;
}
/* Eau */
.neph_table_NL .ka-eau .neph-sticky-2 {
  background: #dce8f2 !important;
  color: #2a5a80 !important;
}
.neph_table_NL .ka-eau td {
  background: #f2f6fa !important;
}
/* Terre */
.neph_table_NL .ka-terre .neph-sticky-2 {
  background: #e4f0dc !important;
  color: #3a6a28 !important;
}
.neph_table_NL .ka-terre td {
  background: #f5faf2 !important;
}
/* Lune */
.neph_table_NL .ka-lune .neph-sticky-2 {
  background: #ebe4f2 !important;
  color: #6a4a8a !important;
}
.neph_table_NL .ka-lune td {
  background: #f8f5fc !important;
}
/* Label "Vécus" sticky sur les lignes élémentaires */
.neph_table_NL .ka-feu .neph-sticky-1,
.neph_table_NL .ka-air .neph-sticky-1,
.neph_table_NL .ka-eau .neph-sticky-1,
.neph_table_NL .ka-terre .neph-sticky-1,
.neph_table_NL .ka-lune .neph-sticky-1 {
  background: #E3DEE8 !important;
  color: #574B6B !important;
}
/* ===========================================================
  5. EFFETS INTERACTIFS
  =========================================================== */
/* Survol de ligne */
.neph_table_NL tbody tr:hover td {
  background: #EDE8F0 !important;
  transition: background 0.12s ease;
}
/* Survol élémentaire : rester dans la teinte */
.neph_table_NL tbody tr.ka-feu:hover td  { background: #f3e0dc !important; }
.neph_table_NL tbody tr.ka-air:hover td  { background: #dce8f2 !important; }
.neph_table_NL tbody tr.ka-eau:hover td  { background: #d4e0ec !important; }
.neph_table_NL tbody tr.ka-terre:hover td { background: #dcecd4 !important; }
.neph_table_NL tbody tr.ka-lune:hover td  { background: #e2d8ee !important; }
/* Survol de cellule */
.neph_table_NL td:hover {
  outline: 1px solid #574B6B;
  outline-offset: -1px;
}
/* Liens */
.neph_table_NL a {
  color: #574B6B !important;
  text-decoration: none;
}
.neph_table_NL a:hover {
  color: #7a6a9a !important;
  text-decoration: underline;
}
/* Liens non existants */
.neph_table_NL a.new {
  color: #a0352a !important;
}
/* ===========================================================
  6. LIGNES SPÉCIALES
  =========================================================== */
/* PI (points d'incarnation) */
.neph_table_NL .neph-pi td {
  text-align: center;
  font-weight: 700;
  color: #574B6B !important;
  font-family: 'Cinzel', serif;
  font-size: 1em;
  background: #f0ecf4 !important;
}
.neph_table_NL .neph-pi .neph-sticky-1,
.neph_table_NL .neph-pi .neph-sticky-2 {
  background: #E3DEE8 !important;
}
/* Lignes multi-contenu (texte wrappé) */
.neph_table_NL .neph-so td,
.neph_table_NL .neph-sorts td,
.neph_table_NL .neph-quetes td,
.neph_table_NL .neph-quetes-arcane td,
.neph_table_NL .neph-savoirs td {
  font-size: 0.82em;
  line-height: 1.5;
  white-space: normal;
  min-width: 100px;
}
/* Stases */
.neph_table_NL .neph-stases td {
  font-style: italic;
  color: #6a6060 !important;
  font-size: 0.82em;
  white-space: normal;
  min-width: 150px;
}
/* ===========================================================
  7. SÉPARATIONS DES ÈRES
  Ajouter class="ere-end" sur les cellules en fin d'ère
  =========================================================== */
.neph_table_NL .ere-end {
  border-right: 3px solid #574B6B !important;
}
/* ===========================================================
  8. RESPONSIVE
  =========================================================== */
@media (max-width: 768px) {
  .neph_table_NL {
    font-size: 12px;
  }
  .neph_table_NL th,
  .neph_table_NL td {
    padding: 3px 5px !important;
  }
  /* Sur mobile, ne garder que la 1ère colonne sticky */
  .neph_table_NL .neph-sticky-2 {
    position: static !important;
    left: auto !important;
  }
}
/* ===========================================================
  9. IMPRESSION
  =========================================================== */
@media print {
  .neph-scroll-table {
    overflow: visible;
    box-shadow: none;
    border: 1px solid #999;
  }
  .neph_table_NL th,
  .neph_table_NL td {
    position: static !important;
  }
  .neph_table_NL th {
    background: #ddd !important;
    color: #000 !important;
    text-shadow: none;
  }
}
}