MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 481: / Line 481: @@
 }
-/* Type table (Option A integrated) */
+/* -------------------------
-table.spiritvale - skill - infobox.sv - type - table {
+   Skill top band: Type grid (4 chunks, label + value)
+   ------------------------- */
+table.spiritvale - skill - infobox.sv - type - grid{
      width: 100 % !important;
      margin: 0!important;
      padding: 0.75em 0.9em;
+    box - sizing: border - box;
+    display: grid;
+    grid - template - columns: 1fr 1fr;
+    gap: 0;
+}
+table.spiritvale - skill - infobox.sv - type - chunk{
+    display: flex;
+    flex - direction: column;
+    align - items: center;
+    justify - content: center;
-     border: 0!important;
+     text - align: center;
-    border - collapse: collapse!important;
+     padding: 0.45em 0.55em;
-     background: transparent!important;
-     table - layout: fixed;
+     border - top: 1px solid rgba(148, 163, 184, 0.18);
+    border - left: 1px solid rgba(148, 163, 184, 0.18);
 }
-table.spiritvale - skill - infobox.sv - type - table th,
+/* remove outer “duplicate” borders for the 2x2 grid */
-     table.spiritvale - skill - infobox.sv - type - table td {
+table.spiritvale - skill - infobox.sv - type - chunk: nth - child(-n + 2){
-    background: transparent!important;
+     border - top: none;
-    padding: 0.2em 0;
+}
-    vertical - align: top;
+table.spiritvale - skill - infobox.sv - type - chunk: nth - child(odd){
-     line - height: 1.25;
+     border - left: none;
 }
-table.spiritvale - skill - infobox.sv - type - table th {
+table.spiritvale - skill - infobox.sv - type - label{
-     width: 6.75em;
+     width: 100 %;
-     font - weight: 700;
+    padding: 0.25em 0.4em;
-     white - space: nowrap;
+    border - radius: 6px;
-     padding - right: 0.6em;
-     text - align: right;
+     font - weight: 800;
+     text - transform: uppercase;
+     letter - spacing: 0.04em;
+     font - size: 0.8em;
+    background: linear - gradient(
+deg,
+        rgba(122, 111, 176, 0.35),
+        rgba(90, 78, 124, 0.20)
+    );
 }
-table.spiritvale - skill - infobox.sv - type - table th::after {
+table.spiritvale - skill - infobox.sv - type - value{
-     content: ":";
+     margin - top: 0.25em;
-     opacity: 0.7;
+     font - weight: 600;
-     margin - left: 0.25em;
+     line - height: 1.25;
-}
-table.spiritvale - skill - infobox.sv - type - table td {
-    text - align: left!important;
      white - space: normal;
      overflow - wrap: anywhere;
@@ Line 523: / Line 544: @@
 }
+/* Mobile: make the 4 chunks stack cleanly */
 @media(max - width: 560px) {
-     table.spiritvale - skill - infobox.sv - topband - table > tbody > tr > td {
+     table.spiritvale - skill - infobox.sv - type - grid{
-         display: block;
+         grid - template - columns: 1fr;
-        width: 100 %;
      }
-     table.spiritvale - skill - infobox.sv - topband - table > tbody > tr > td: first - child {
+     table.spiritvale - skill - infobox.sv - type - chunk{
-         border - right: none;
+        border - left: none;
-         border - bottom: 1px solid rgba(148, 163, 184, 0.25);
+    }
+    table.spiritvale - skill - infobox.sv - type - chunk: nth - child(1){
+         border - top: none;
+    }
+    table.spiritvale - skill - infobox.sv - type - chunk: nth - child(-n + 2){
+         border - top: 1px solid rgba(148, 163, 184, 0.18);
      }
 }