MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 1: / Line 1: @@
 /* ============================================================
     SpiritVale Wiki – Site CSS
     ============================================================ */
@@ Line 113: / Line 113: @@
      --sv-skill-width: 660px;
      --sv-passive-width: 540px;
-     --sv-card-border: rgba(55, 43, 84, 0.65);
+     --sv-base: #0F172B;
-     --sv-row-border: rgba(148, 163, 184, 0.40);
+     --sv-surface: #1b2336;
-     --sv-card-bg: #32284f;
+     --sv-pill: #4B5160;
-     --sv-hero-a: #7a6fb0;
+     --sv-card-border: #4B5160;
-     --sv-hero-b: #372b54;
+     --sv-row-border: rgba(255, 255, 255, 0.18);
-     --sv-tile-a: #5a4e7c;
+     --sv-hero-a: var(--sv-base);
-     --sv-tile-b: #372b54;
+     --sv-hero-b: var(--sv-base);
-     --sv-gridline: rgba(255, 255, 255, 0.10);
+     --sv-tile-a: var(--sv-surface);
-     --sv-pill-a: rgba(90, 135, 255, 0.92);
+     --sv-tile-b: var(--sv-surface);
-     --sv-pill-b: rgba(60, 110, 255, 0.88);
+     --sv-gridline: rgba(255, 255, 255, 0.24);
      --sv-text-soft: rgba(255, 255, 255, 0.92);
      --sv-text-outline: 0 1px 0 rgba(0,0,0,0.55), 0 -1px 0 rgba(0,0,0,0.55), 1px 0 0 rgba(0,0,0,0.55), -1px 0 0 rgba(0,0,0,0.55);
@@ Line 139: / Line 139: @@
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
      font-size: 0.95em;
+    background: var(--sv-base);
 }
@@ Line 182: / Line 183: @@
          table.spiritvale-passive-infobox > tbody > tr.sv-hero-title-row > th,
          table.spiritvale-passive-infobox > tbody > tr.sv-hero-desc-row > td {
-             background: linear-gradient(135deg, var(--sv-hero-a), var(--sv-hero-b));
+             background: var(--sv-hero-b);
              color: #fff;
              padding: 0.9em 1.1em;
@@ Line 249: / Line 250: @@
      .mw-parser-output table.spiritvale-skill-infobox.sv-skill-inlist {
          width: var(--sv-skill-width);
-         max-width: 1080px;
+         max-width: var(--sv-skill-width);
-        min-height: 660px;
-        max-height: 720px;
      }
-     .mw-parser-output table.spiritvale-skill-infobox > tbody > tr > th,
+     table.spiritvale-skill-infobox.sv-skill-inlist {
-    .mw-parser-output table.spiritvale-skill-infobox > tbody > tr > td {
-        padding: 0.35em 0.65em;
      }
 }
@@ Line 275: / Line 272: @@
      justify-content: center;
      text-align: center;
+    background: var(--sv-surface);
+    border: 1px solid var(--sv-gridline);
+    border-radius: 10px;
+}
+table.spiritvale-skill-infobox .hero-bar-module .hero-bar-module-body {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    padding: 0.95em;
 }
@@ Line 295: / Line 305: @@
 table.spiritvale-skill-infobox tr.hero-modules-row > td.hero-modules-cell {
      padding: 0 !important;
-     background: linear-gradient(135deg, var(--sv-tile-a), var(--sv-tile-b)) !important;
+     background: var(--sv-base) !important;
      color: #fff;
 }
@@ Line 309: / Line 319: @@
      padding: 0.40em;
      box-sizing: border-box;
-     background: var(--sv-hero-b) !important;
+     background: var(--sv-surface) !important;
      color: #fff !important;
-     border-top: 1px solid var(--sv-gridline);
+     border: 1px solid var(--sv-gridline);
-    border-left: 1px solid var(--sv-gridline);
+     border-radius: 10px;
-}
-table.spiritvale-skill-infobox .hero-module:nth-child(-n + 2) {
-    border-top: none;
-}
-table.spiritvale-skill-infobox .hero-module:nth-child(odd) {
-     border-left: none;
 }
@@ Line 338: / Line 340: @@
      justify-content: center;
      text-align: center;
+    flex-direction: column;
+    gap: 0.35em;
+}
+@media (min-width: 1024px) {
+    table.spiritvale-skill-infobox .hero-bar-grid {
+        align-items: stretch;
+        grid-auto-rows: minmax(6.5em, auto);
+    }
+    table.spiritvale-skill-infobox .hero-bar-module {
+        height: 100%;
+    }
+    table.spiritvale-skill-infobox .hero-bar-module .hero-bar-module-body {
+        padding: 1.05em;
+    }
+    table.spiritvale-skill-infobox .hero-modules-grid {
+        gap: 0.75em;
+        grid-auto-rows: minmax(8.5em, auto);
+        align-items: stretch;
+    }
+    .mw-parser-output table.spiritvale-skill-infobox .hero-module {
+        padding: 0;
+        display: flex;
+        align-items: stretch;
+    }
+    table.spiritvale-skill-infobox .hero-module .hero-module-body {
+        padding: 1em;
+        min-height: 7.5em;
+    }
 }
@@ Line 427: / Line 463: @@
      font-size: 0.72em;
      line-height: 1.15;
-     background: linear-gradient(180deg, var(--sv-pill-a), var(--sv-pill-b));
+     background: var(--sv-pill);
 }
@@ Line 473: / Line 509: @@
      gap: 0.50em;
      padding: 0.40em;
+    justify-items: center;
+    align-items: center;
 }
@@ Line 531: / Line 569: @@
      display: grid;
      gap: 0.55em;
-     align-items: start;
+     align-items: center;
      justify-items: center;
 }
@@ Line 601: / Line 639: @@
      gap: 0.45em;
      padding: 0.35em;
+    justify-items: center;
+    align-items: center;
 }