Toggle search
Toggle menu
115
248
25
2.7K
SpiritVale Wiki
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Join the Playtest on Steam Now: SpiritVale

MediaWiki:Common.css: Difference between revisions

MediaWiki interface page
More actions
← Older editNewer edit →
No edit summary
No edit summary
Line 1: Line 1:
/* ============================================================
/* ============================================================
   Global custom additions
   HERO TEMPLATE (Shared Infobox System)
  ========================================================== */
   - Used by Skills + Passives (and future templates)
 
  - Dark mode = default styling
/* Playtest info box (supports:
   - Light mode = overrides via .mw-theme-light (plus optional OS fallback)
  1) class="playtest-info-box"
   2) class="playtest info box"  */
.playtest-info-box,
.playtest.info.box {
  max-width: 100%;
  margin: 0 0 10px 0;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  background: #f0f2f8;
  padding: 10px;
  text-align: center;
  color: #333;
  overflow-wrap: anywhere;
  word-break: break-word;
}
 
/* Header container band (supports:
   1) class="header-container-outer"
  2) class="header container outer"  */
.header-container-outer,
.header.container.outer {
  max-width: 100%;
  margin: 1px;
  border: 2px solid #372b54;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
  background: #f0f2f8;
}
 
.header-container-middle,
.header.container.middle {
  background: #f0f2f8;
  color: white;
  text-align: center;
  padding: 1px;
  border-radius: 8px;
  overflow-wrap: anywhere;
  word-break: break-word;
}
 
.header-container-inner,
.header.container.inner {
  background: linear-gradient(180deg, #5a4e7c, #372b54);
  color: white;
  text-align: center;
  padding: 1px;
  border-radius: 8px;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-size: 300%;
}
 
/* Generic custom table */
table.custom-table {
  float: none;
  border: 2px solid #372b54;
  border-radius: 10px;
  padding: 2px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
  margin: 1em auto;
  text-align: center;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  -webkit-user-select: text;
  user-select: text;
}
 
table.custom-table > tbody > tr:nth-child(1) > th {
  background: linear-gradient(180deg, #7a6fb0, #5a4e7c);
  color: white;
  text-align: center;
  padding: 6px;
  font-size: 120%;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  overflow-wrap: anywhere;
  word-break: break-word;
}
 
table.custom-table > tbody > tr:nth-child(2) > th {
  text-align: center;
  padding: 4px;
  border-bottom: 1px solid #555;
}
 
table.custom-table > tbody > tr > td {
  text-align: center;
  padding: 4px;
  border-bottom: 1px solid #555;
}
 
table.custom-table > tbody > tr.middle-header > th {
  background: linear-gradient(180deg, #7a6fb0, #5a4e7c);
  color: white;
  text-align: center;
  padding: 6px;
  font-size: 110%;
}
 
/* Citizen search hover (transition goes on base state) */
.citizen-search-trigger {
  transition: transform 0.15s ease-in-out;
}
.citizen-search-trigger:hover {
  transform: translateY(-2px);
}
 
 
/* ============================================================
  SpiritVale Infoboxes (Skills + Passives)
   ========================================================== */
   ========================================================== */


/* ------------------------------------------------------------
  Global sizing tokens
  --------------------------------------------------------- */
:root {
:root {
   --sv-passive-width: 540px;
   --sv-infobox-max: 620px;     /* shared fallback cap */
   --sv-skill-width: 660px;
   --sv-skill-width: 660px;     /* skills pages + lists */
   --sv-infobox-max: 620px;
   --sv-passive-width: 540px;   /* passives pages + lists (kept as-is for now) */
}
}


/* Shared base */
/* ------------------------------------------------------------
  Shared base: both Skill + Passive tables
  --------------------------------------------------------- */
table.spiritvale-skill-infobox,
table.spiritvale-skill-infobox,
table.spiritvale-passive-infobox {
table.spiritvale-passive-infobox {
Line 141: Line 34:
}
}


/* Hero band background (supports old main row + new split rows for BOTH) */
/* Hero (title + description) band background */
table.spiritvale-skill-infobox > tbody > tr.spiritvale-infobox-main > th,
table.spiritvale-skill-infobox > tbody > tr.spiritvale-infobox-main > th,
table.spiritvale-skill-infobox > tbody > tr.spiritvale-infobox-main > td,
table.spiritvale-skill-infobox > tbody > tr.spiritvale-infobox-main > td,
Line 157: Line 50:
}
}


/* Row separators (direct children only) */
/* Row separators */
table.spiritvale-skill-infobox > tbody > tr,
table.spiritvale-skill-infobox > tbody > tr,
table.spiritvale-passive-infobox > tbody > tr {
table.spiritvale-passive-infobox > tbody > tr {
   border-bottom: 1px solid rgba(148, 163, 184, 0.4);
   border-bottom: 1px solid rgba(148, 163, 184, 0.40);
}
}
table.spiritvale-skill-infobox > tbody > tr:last-child,
table.spiritvale-skill-infobox > tbody > tr:last-child,
Line 167: Line 60:
}
}


/* Label/value cells (direct children only) */
/* Label/value rows (shared default) */
table.spiritvale-skill-infobox > tbody > tr:not(.spiritvale-infobox-main) > th:not(.spiritvale-infobox-section-header),
table.spiritvale-skill-infobox > tbody > tr:not(.spiritvale-infobox-main) > th:not(.spiritvale-infobox-section-header),
table.spiritvale-passive-infobox > tbody > tr:not(.spiritvale-infobox-main) > th:not(.spiritvale-infobox-section-header) {
table.spiritvale-passive-infobox > tbody > tr:not(.spiritvale-infobox-main) > th:not(.spiritvale-infobox-section-header) {
Line 191: Line 84:
}
}


/* Section headers */
/* Hero helper classes (icon + title + description) */
.spiritvale-infobox-section-header {
  background: linear-gradient(135deg, #5a4e7c, #372b54);
  color: #fff;
  text-align: left;
  padding: 0.5em 0.9em;
  font-size: 0.9em;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
 
/* Hero helper classes */
.spiritvale-infobox-main-left-inner {
.spiritvale-infobox-main-left-inner {
   display: flex;
   display: flex;
Line 231: Line 113:
}
}


 
/* Skill hero split-row tuning */
/* ============================================================
  Skills: split hero rows (tuned)
  ========================================================== */
 
table.spiritvale-skill-infobox > tbody > tr.sv-hero-title-row {
table.spiritvale-skill-infobox > tbody > tr.sv-hero-title-row {
   border-bottom: none !important;
   border-bottom: none !important;
}
}
table.spiritvale-skill-infobox > tbody > tr.sv-hero-title-row > th {
table.spiritvale-skill-infobox > tbody > tr.sv-hero-title-row > th {
   padding-bottom: 0.55em;
   padding-bottom: 0.55em;
}
}
table.spiritvale-skill-infobox > tbody > tr.sv-hero-desc-row > td {
table.spiritvale-skill-infobox > tbody > tr.sv-hero-desc-row > td {
   padding-top: 0.55em;
   padding-top: 0.55em;
Line 249: Line 125:
}
}


 
/* ------------------------------------------------------------
/* ============================================================
  SKILLS: sizing + list wrapper behavior
  Passives
  --------------------------------------------------------- */
  ========================================================== */
 
table.spiritvale-passive-infobox {
  width: var(--sv-passive-width);
  max-width: var(--sv-passive-width);
  margin: 1em auto;
  table-layout: fixed;
}
 
/* Passive split hero rows (match Skills) */
table.spiritvale-passive-infobox > tbody > tr.sv-hero-title-row {
  border-bottom: none !important;
}
table.spiritvale-passive-infobox > tbody > tr.sv-hero-title-row > th {
  padding-bottom: 0.55em;
}
table.spiritvale-passive-infobox > tbody > tr.sv-hero-desc-row > td {
  padding-top: 0.55em;
  padding-bottom: 0.55em;
}
 
/* Center + wrap passive body rows */
table.spiritvale-passive-infobox > tbody > tr:not(.spiritvale-infobox-main) > th,
table.spiritvale-passive-infobox > tbody > tr:not(.spiritvale-infobox-main) > td {
  text-align: center;
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
 
/* Passive section headers centered */
table.spiritvale-passive-infobox .spiritvale-infobox-section-header {
  text-align: center;
}
 
/* Passive list layout */
.spiritvale-passive-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25em;
}
 
/* Remove Citizen wrapper borders/spacing around passive tables in lists */
.spiritvale-passive-list .mw-table-wrapper,
.spiritvale-passive-list .table-overflow,
.spiritvale-passive-list .table-scroll,
.spiritvale-passive-list .citizen-table {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}
 
 
/* ============================================================
  Skills
  ========================================================== */
 
table.spiritvale-skill-infobox {
table.spiritvale-skill-infobox {
  width: 100%;
   max-width: var(--sv-skill-width);
   max-width: var(--sv-skill-width);
   margin: 1.25em auto;
   margin: 1.25em auto;
Line 320: Line 134:
}
}


/* List wrapper */
/* List-mode wrapper: one outer panel, skills become rows inside it */
.sv-skill-collection {
.sv-skill-collection {
   width: 100%;
   width: 100%;
Line 336: Line 150:
}
}


/* Neutralize Citizen wrappers inside the skill collection */
/* Neutralize Citizen wrappers inside the collection */
.sv-skill-collection .mw-table-wrapper,
.sv-skill-collection .mw-table-wrapper,
.sv-skill-collection .table-overflow,
.sv-skill-collection .table-overflow,
Line 348: Line 162:
}
}


/* In list mode, each skill becomes a “row” inside the wrapper */
/* Remove each skill’s individual border/shadow when inside the list wrapper */
.sv-skill-collection table.spiritvale-skill-infobox {
.sv-skill-collection table.spiritvale-skill-infobox {
   width: 100%;
   width: 100%;
Line 359: Line 173:
}
}


/* Divider between skills */
/* Divider between skill entries in list mode */
.sv-skill-collection > * + * {
.sv-skill-collection > * + * {
   border-top: 1px solid rgba(148, 163, 184, 0.25);
   border-top: 1px solid rgba(148, 163, 184, 0.25);
}
}


 
/* ------------------------------------------------------------
/* ============================================================
  SKILLS: Hero Modules (4-slot scaffold)
   Skills top band (nested-table)
   - Replaces the old “top band (nested-table)” system
   ========================================================== */
   - Row contains a 2x2 grid of module boxes
 
  --------------------------------------------------------- */
table.spiritvale-skill-infobox .sv-topband-cell {
table.spiritvale-skill-infobox tr.hero-modules-row > td.hero-modules-cell {
   padding: 0 !important;
   padding: 0 !important;
   background: linear-gradient(
   background: linear-gradient(
Line 378: Line 192:
}
}


table.spiritvale-skill-infobox .sv-topband-table {
/* 2x2 grid of module boxes */
   width: 100% !important;
table.spiritvale-skill-infobox .hero-modules-grid {
   max-width: 100% !important;
  display: grid;
   margin: 0 !important;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}
 
/* Standard module box styling */
table.spiritvale-skill-infobox .hero-module {
   padding: 0.6em 0.75em;
  box-sizing: border-box;
 
   border-top: 1px solid rgba(148, 163, 184, 0.25);
   border-left: 1px solid rgba(148, 163, 184, 0.25);


   border: 0 !important;
   background: rgba(90, 78, 124, 0.18);
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: fixed;
  background: transparent !important;
}
}


table.spiritvale-skill-infobox .sv-topband-table > tbody > tr > td {
/* Grid borders: remove top border on first row; remove left border on first column */
   width: 50%;
table.spiritvale-skill-infobox .hero-module:nth-child(-n + 2) {
  padding: 0 !important;
   border-top: none;
   vertical-align: middle;
}
table.spiritvale-skill-infobox .hero-module:nth-child(odd) {
   border-left: none;
}
}


table.spiritvale-skill-infobox .sv-topband-table > tbody > tr > td:first-child {
/* Empty slots still reserve vertical space for future modules */
   border-right: 1px solid rgba(148, 163, 184, 0.25);
table.spiritvale-skill-infobox .hero-module-empty .hero-module-body {
   min-height: 3.2em;
}
}


/* Level Select (tightened) */
/* ------------------------------------------------------------
table.spiritvale-skill-infobox .sv-level-ui {
  SKILLS: Module 1 – Level Selector (self-contained)
  --------------------------------------------------------- */
table.spiritvale-skill-infobox .module-level-selector .sv-level-ui {
   width: 100%;
   width: 100%;
   margin: 0 !important;
   margin: 0 !important;
  padding: 0.6em 0.75em;
   display: flex;
   display: flex;
   flex-direction: column;
   flex-direction: column;
Line 410: Line 234:
}
}


table.spiritvale-skill-infobox .sv-level-title {
table.spiritvale-skill-infobox .module-level-selector .sv-level-title {
   font-weight: 700;
   font-weight: 700;
   text-transform: uppercase;
   text-transform: uppercase;
Line 418: Line 242:
}
}


table.spiritvale-skill-infobox .sv-level-label {
table.spiritvale-skill-infobox .module-level-selector .sv-level-label {
   font-weight: 600;
   font-weight: 600;
}
}


table.spiritvale-skill-infobox .sv-level-slider input[type="range"] {
table.spiritvale-skill-infobox .module-level-selector .sv-level-slider input[type="range"] {
   width: 100%;
   width: 100%;
   box-sizing: border-box;
   box-sizing: border-box;
Line 428: Line 252:
}
}


 
/* ------------------------------------------------------------
/* ============================================================
   SKILLS: Module 2 – Skill Type (self-contained 2x2 grid)
   Type grid: 4 chunks (2x2), label + value (tightened)
   --------------------------------------------------------- */
   ========================================================== */
table.spiritvale-skill-infobox .module-skill-type .sv-type-grid {
 
   width: 100%;
table.spiritvale-skill-infobox .sv-type-grid {
   width: 100% !important;
   margin: 0 !important;
   margin: 0 !important;
   padding: 0.6em 0.75em;
   padding: 0;
   box-sizing: border-box;
   box-sizing: border-box;


Line 444: Line 266:
}
}


table.spiritvale-skill-infobox .sv-type-chunk {
table.spiritvale-skill-infobox .module-skill-type .sv-type-chunk {
   display: flex;
   display: flex;
   flex-direction: column;
   flex-direction: column;
Line 457: Line 279:
}
}


/* grid borders */
/* Grid borders */
table.spiritvale-skill-infobox .sv-type-chunk:nth-child(-n + 2) {
table.spiritvale-skill-infobox .module-skill-type .sv-type-chunk:nth-child(-n + 2) {
   border-top: none;
   border-top: none;
}
}
table.spiritvale-skill-infobox .sv-type-chunk:nth-child(odd) {
table.spiritvale-skill-infobox .module-skill-type .sv-type-chunk:nth-child(odd) {
   border-left: none;
   border-left: none;
}
}


table.spiritvale-skill-infobox .sv-type-label {
table.spiritvale-skill-infobox .module-skill-type .sv-type-label {
   width: 100%;
   width: 100%;
   padding: 0.18em 0.35em;
   padding: 0.18em 0.35em;
Line 483: Line 305:
}
}


table.spiritvale-skill-infobox .sv-type-value {
table.spiritvale-skill-infobox .module-skill-type .sv-type-value {
   margin-top: 0.2em;
   margin-top: 0.2em;
   font-weight: 600;
   font-weight: 600;
Line 493: Line 315:
}
}


/* Mobile: stack Level + Type, and Type grid becomes 1 column */
/* Mobile: modules stack to 1 column; type grid becomes 1 column */
@media (max-width: 560px) {
@media (max-width: 560px) {
   table.spiritvale-skill-infobox .sv-topband-table > tbody > tr > td {
   table.spiritvale-skill-infobox .hero-modules-grid {
     display: block;
     grid-template-columns: 1fr;
     width: 100%;
  }
 
  table.spiritvale-skill-infobox .hero-module {
     border-left: none;
   }
   }


   table.spiritvale-skill-infobox .sv-topband-table > tbody > tr > td:first-child {
   table.spiritvale-skill-infobox .hero-module:first-child {
     border-right: none;
     border-top: none;
    border-bottom: 1px solid rgba(148, 163, 184, 0.25);
   }
   }


   table.spiritvale-skill-infobox .sv-type-grid {
   table.spiritvale-skill-infobox .module-skill-type .sv-type-grid {
     grid-template-columns: 1fr;
     grid-template-columns: 1fr;
   }
   }


   /* simplify borders for 1-col */
   /* Simplify borders for 1-col type grid */
   table.spiritvale-skill-infobox .sv-type-chunk {
   table.spiritvale-skill-infobox .module-skill-type .sv-type-chunk {
     border-left: none;
     border-left: none;
   }
   }
   table.spiritvale-skill-infobox .sv-type-chunk:first-child {
   table.spiritvale-skill-infobox .module-skill-type .sv-type-chunk:first-child {
     border-top: none;
     border-top: none;
   }
   }
}
}


/* ------------------------------------------------------------
  PASSIVES (kept as-is for now)
  --------------------------------------------------------- */
table.spiritvale-passive-infobox {
  width: var(--sv-passive-width);
  max-width: var(--sv-passive-width);
  margin: 1em auto;
  table-layout: fixed;
}
/* Passive split hero rows (match Skills) */
table.spiritvale-passive-infobox > tbody > tr.sv-hero-title-row {
  border-bottom: none !important;
}
table.spiritvale-passive-infobox > tbody > tr.sv-hero-title-row > th {
  padding-bottom: 0.55em;
}
table.spiritvale-passive-infobox > tbody > tr.sv-hero-desc-row > td {
  padding-top: 0.55em;
  padding-bottom: 0.55em;
}


/* ============================================================
/* Center + wrap passive body rows */
  Light mode tuning (keeps your dark-mode look intact)
table.spiritvale-passive-infobox > tbody > tr:not(.spiritvale-infobox-main) > th,
  - 1) Lighter top band panels (Level Select + Type)
table.spiritvale-passive-infobox > tbody > tr:not(.spiritvale-infobox-main) > td {
  - 2) Stronger borders in top band + type grid
  text-align: center;
  - 3) More apparent zebra striping
  vertical-align: middle;
  ========================================================== */
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
 
/* Passive section headers centered */
table.spiritvale-passive-infobox .spiritvale-infobox-section-header {
  text-align: center;
}
 
/* Passive list layout */
.spiritvale-passive-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25em;
}


/* Prefer MW theme classes, with a safe fallback to prefers-color-scheme */
/* Remove Citizen wrapper borders/spacing around passive tables in lists */
.mw-theme-light table.spiritvale-skill-infobox .sv-topband-cell,
.spiritvale-passive-list .mw-table-wrapper,
@media (prefers-color-scheme: light) {
.spiritvale-passive-list .table-overflow,
  table.spiritvale-skill-infobox .sv-topband-cell {
.spiritvale-passive-list .table-scroll,
    background: linear-gradient(
.spiritvale-passive-list .citizen-table {
      135deg,
  border: none !important;
      rgba(255, 255, 255, 0.92),
  box-shadow: none !important;
      rgba(226, 232, 240, 0.92)
  background: transparent !important;
    ) !important;
  padding: 0 !important;
  }
  margin: 0 !important;
}
}


/* Text + contrast tweaks inside the top band for light mode */
/* ------------------------------------------------------------
.mw-theme-light table.spiritvale-skill-infobox .sv-level-title,
  LIGHT MODE OVERRIDES
.mw-theme-light table.spiritvale-skill-infobox .sv-level-label,
  - Primary: .mw-theme-light (MediaWiki theme flag)
.mw-theme-light table.spiritvale-skill-infobox .sv-type-value,
  - Optional fallback: OS prefers-color-scheme: light
.mw-theme-light table.spiritvale-skill-infobox .sv-type-label {
  --------------------------------------------------------- */
   color: #111827;
 
/* Skills: lighten the hero-modules band + module backgrounds */
.mw-theme-light table.spiritvale-skill-infobox tr.hero-modules-row > td.hero-modules-cell {
   background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.92),
    rgba(226, 232, 240, 0.92)
  ) !important;
}
}


/* Stronger divider between Level + Type panes (light mode) */
.mw-theme-light table.spiritvale-skill-infobox .hero-module {
.mw-theme-light table.spiritvale-skill-infobox .sv-topband-table > tbody > tr > td:first-child {
   background: rgba(255, 255, 255, 0.65);
   border-right: 1px solid rgba(55, 43, 84, 0.28);
}
}


/* Stronger type-grid cell borders (light mode) */
/* Skills: improve text contrast inside modules */
.mw-theme-light table.spiritvale-skill-infobox .sv-type-chunk {
.mw-theme-light table.spiritvale-skill-infobox .module-level-selector .sv-level-title,
  border-top: 1px solid rgba(55, 43, 84, 0.20);
.mw-theme-light table.spiritvale-skill-infobox .module-level-selector .sv-level-label,
   border-left: 1px solid rgba(55, 43, 84, 0.20);
.mw-theme-light table.spiritvale-skill-infobox .module-skill-type .sv-type-value,
.mw-theme-light table.spiritvale-skill-infobox .module-skill-type .sv-type-label {
   color: #111827;
}
}


/* Slightly lighter label pill background in light mode (so it reads cleaner) */
.mw-theme-light table.spiritvale-skill-infobox .module-skill-type .sv-type-label {
.mw-theme-light table.spiritvale-skill-infobox .sv-type-label {
   background: linear-gradient(
   background: linear-gradient(
     180deg,
     180deg,
Line 566: Line 434:
}
}


/* Mobile separator between stacked panes (light mode) */
/* Shared: stronger zebra striping + row separators in light mode */
@media (max-width: 560px) {
  .mw-theme-light table.spiritvale-skill-infobox .sv-topband-table > tbody > tr > td:first-child {
    border-bottom: 1px solid rgba(55, 43, 84, 0.28);
  }
}
 
/* More apparent zebra striping in light mode */
.mw-theme-light table.spiritvale-skill-infobox > tbody > tr:nth-child(odd) > td,
.mw-theme-light table.spiritvale-skill-infobox > tbody > tr:nth-child(odd) > td,
.mw-theme-light table.spiritvale-skill-infobox > tbody > tr:nth-child(odd) > th:not(.spiritvale-infobox-section-header),
.mw-theme-light table.spiritvale-skill-infobox > tbody > tr:nth-child(odd) > th:not(.spiritvale-infobox-section-header),
Line 581: Line 442:
}
}


/* Optional: slightly stronger row separators in light mode (keeps structure crisp) */
.mw-theme-light table.spiritvale-skill-infobox > tbody > tr,
.mw-theme-light table.spiritvale-skill-infobox > tbody > tr,
.mw-theme-light table.spiritvale-passive-infobox > tbody > tr {
.mw-theme-light table.spiritvale-passive-infobox > tbody > tr {
   border-bottom: 1px solid rgba(55, 43, 84, 0.18);
   border-bottom: 1px solid rgba(55, 43, 84, 0.18);
}
/* Optional OS-level fallback (only applies if your wiki doesn't set .mw-theme-light) */
@media (prefers-color-scheme: light) {
  table.spiritvale-skill-infobox tr.hero-modules-row > td.hero-modules-cell {
    background: linear-gradient(
      135deg,
      rgba(255, 255, 255, 0.92),
      rgba(226, 232, 240, 0.92)
    ) !important;
  }
  table.spiritvale-skill-infobox .hero-module {
    background: rgba(255, 255, 255, 0.65);
  }
  table.spiritvale-skill-infobox > tbody > tr:nth-child(odd) > td,
  table.spiritvale-skill-infobox > tbody > tr:nth-child(odd) > th:not(.spiritvale-infobox-section-header),
  table.spiritvale-passive-infobox > tbody > tr:nth-child(odd) > td,
  table.spiritvale-passive-infobox > tbody > tr:nth-child(odd) > th:not(.spiritvale-infobox-section-header) {
    background-color: rgba(148, 163, 184, 0.12);
  }
  table.spiritvale-skill-infobox > tbody > tr,
  table.spiritvale-passive-infobox > tbody > tr {
    border-bottom: 1px solid rgba(55, 43, 84, 0.18);
  }
}
}
Retrieved from "https://spiritvale.info/wiki/MediaWiki:Common.css"