Module:GameInfo/styles.css: Difference between revisions

← Older edit Newer edit →

@@ Line 552: / Line 552: @@
     Column 1: STR, VIT, DEX
     Column 2: AGI, INT, LUK
-    -------------------------------------------------------------------------- */
+    Chip rules:
+   - Active: icon + value (single line), no label
+   - Inactive: en dash only, no icon, no label
+-------------------------------------------------------------------------- */
 .sv_skill_scaling__stats-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
-  gap:6px;
-   /* Hard-ordering regardless of DOM order */
+  /* Tight spacing to match the damage block height */
+  gap:3px;
+   /* Hard ordering regardless of DOM output order */
    grid-template-areas:
      "str agi"
@@ Line 572: / Line 578: @@
 .sv_skill_scaling__stat-pill--int{ grid-area:int; }
 .sv_skill_scaling__stat-pill--luk{ grid-area:luk; }
-/* Shared pill shell (core keeps the old look; stats override below) */
-.sv_skill_scaling__pill{
-  position:relative;
-  min-width:0;
-  border-radius:14px;
-  border:1px solid rgba(59,75,99,0.92);
-  background:#1a2434;
-  background-image:linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.00));
-  box-shadow:inset 0 1px 0 rgba(255,255,255,0.03);
-}
 /* Stat chips: ultra-compact, single-line */
 .sv_skill_scaling__stat-pill{
    border-radius:999px;
-   min-height:30px;
-   padding:6px 10px;
+  /* Compact height + minimal padding */
+   min-height:18px;
+   padding:2px 10px;
    display:flex;
@@ Line 614: / Line 610: @@
    align-items:center;
    justify-content:center;
-   gap:8px;
+  /* tighter than before */
+   gap:6px;
 }
-/* No label text in compact chip mode */
+/* No stat label in chip mode */
 .sv_skill_scaling__stat-label{
    display:none;
 }
-/* Icon sizing */
+/* Icon sizing (small + crisp) */
 .sv_skill_scaling__stat-icon{
-   width:14px;
+   width:12px;
-   height:14px;
+   height:12px;
    display:flex;
@@ Line 644: / Line 642: @@
 .sv_skill_scaling__stat-icon .sv-miss{
-   width:12px;
+   width:10px;
-   height:12px;
+   height:10px;
-   font-size:9px;
+   font-size:8px;
    line-height:1;
 }
-/* Value sizing */
+/* Value sizing (compact but readable) */
 .sv_skill_scaling__stat-value{
    font-weight:900;
-   font-size:16px;
+   font-size:14px;
    line-height:1;
-   letter-spacing:-0.15px;
+   letter-spacing:-0.12px;
    color:rgba(245,249,255,0.98);
 }
-/* Full-pill Definitions interaction overlay */
+/* Full-pill Definitions interaction overlay (active pills) */
 .sv_skill_scaling__stat-hit{
    position:absolute;
@@ Line 676: / Line 674: @@
 }
-/* Inactive chips: dash only (no icon, no value) */
+/* Inactive chips: dash only */
 .sv_skill_scaling__stat-pill.is-inactive{
    border-color:rgba(59,75,99,0.72);
@@ Line 692: / Line 690: @@
    content:"—";
    font-weight:900;
-   font-size:16px;
+   font-size:14px;
    line-height:1;
    color:rgba(140,156,184,0.78);
@@ Line 704: / Line 702: @@
 }
-/* Per-stat color treatments (unchanged, now applied to compact chips) */
+/* Per-stat color treatments (same identity, compact chip-friendly) */
 .sv_skill_scaling__stat-pill--str.is-active{
    border-color:rgba(145,63,82,0.96);
@@ Line 710: / Line 708: @@
    background-image:linear-gradient(180deg, rgba(190,88,113,0.16), rgba(0,0,0,0.00));
 }
 .sv_skill_scaling__stat-pill--str.is-active .sv_skill_scaling__stat-value{ color:#ffdce5; }
@@ Line 718: / Line 715: @@
    background-image:linear-gradient(180deg, rgba(210,144,18,0.15), rgba(0,0,0,0.00));
 }
 .sv_skill_scaling__stat-pill--vit.is-active .sv_skill_scaling__stat-value{ color:#ffefc9; }
@@ Line 726: / Line 722: @@
    background-image:linear-gradient(180deg, rgba(159,194,27,0.16), rgba(0,0,0,0.00));
 }
 .sv_skill_scaling__stat-pill--dex.is-active .sv_skill_scaling__stat-value{ color:#edf8cc; }
@@ Line 734: / Line 729: @@
    background-image:linear-gradient(180deg, rgba(165,82,198,0.17), rgba(0,0,0,0.00));
 }
 .sv_skill_scaling__stat-pill--agi.is-active .sv_skill_scaling__stat-value{ color:#f0dcff; }
@@ Line 742: / Line 736: @@
    background-image:linear-gradient(180deg, rgba(35,140,230,0.18), rgba(0,0,0,0.00));
 }
 .sv_skill_scaling__stat-pill--int.is-active .sv_skill_scaling__stat-value{ color:#d8eeff; }
@@ Line 750: / Line 743: @@
    background-image:linear-gradient(180deg, rgba(234,194,9,0.16), rgba(0,0,0,0.00));
 }
 .sv_skill_scaling__stat-pill--luk.is-active .sv_skill_scaling__stat-value{ color:#fff2ba; }