Template:StatTable/styles.css: Difference between revisions

From I-Pixelmon
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:
/* frame & table */
/* ── frame ─────────────────────────────────────────── */
.statbox table{
.statbox table{
   border:3px solid;
   border:3px solid #444;     /* colour is overridden inline in the template */
   border-radius:10px;
   border-radius:10px;
   background:#d7d8e8;
   background:#d7d8e8;
   border-collapse:separate;
   border-collapse:separate;
   margin:auto;
   margin:auto;
   max-width:620px;
   max-width:620px; width:100%;
  width:100%;
   font-family:inherit;
   font-family:inherit;
}
}
.statbox th{
 
   width:110px;
/* ── first column: label + value ───────────────────── */
   padding:6px 4px;
.lab{
   text-align:left;
   display:flex;
   justify-content:space-between;
   align-items:center;
  padding:6px 8px;
   font-weight:700;
   font-weight:700;
   font-size:110%;
   font-size:110%;
  white-space:nowrap;
}
}
.statbox td.val{
  width:48px;
  text-align:right;
  padding-right:6px;
  font-weight:700;
}
.statbox td.bar{padding:0}
/* row colours + bar colours */
.row-hp  {background:#ff9a9a}  .row-hp  .fill{background:#ff5757}
.row-atk {background:#f6c19e}  .row-atk .fill{background:#e48a39}
.row-def {background:#fff2b3}  .row-def .fill{background:#f2cf45}
.row-spa {background:#bcd0ff}  .row-spa .fill{background:#6d93ff}
.row-spd {background:#cfe8c4}  .row-spd .fill{background:#62b455}
.row-spe {background:#f8bfd8}  .row-spe .fill{background:#f27ab0}


/* ── second column: bar background ─────────────────── */
td.bar{padding:0}
.fill{
.fill{
   height:20px;
   height:20px;
   border:1px solid rgba(0,0,0,.25);
   border:1px solid rgba(0,0,0,.25);
  background:#777;            /* replaced inline per-row */
}
}


.total-lab{padding:6px;font-weight:700;background:#d7d8e8}
/* row colours + bar colours */
.total-val{padding:6px;text-align:right;background:#fff;font-weight:700}
.row-hp  {background:#ff9a9a} .row-hp  .fill{background:#ff5757}
.row-atk {background:#f6c19e} .row-atk .fill{background:#e48a39}
.row-def {background:#fff2b3} .row-def .fill{background:#f2cf45}
.row-spa {background:#bcd0ff} .row-spa .fill{background:#6d93ff}
.row-spd {background:#cfe8c4} .row-spd .fill{background:#62b455}
.row-spe {background:#f8bfd8} .row-spe .fill{background:#f27ab0}
 
/* total row */
.total  {background:#d7d8e8}
.total .lab{padding:6px;font-weight:700}
.total .bar{background:none}

Revision as of 04:07, 19 May 2025

/* ── frame ─────────────────────────────────────────── */
.statbox table{
  border:3px solid #444;      /* colour is overridden inline in the template */
  border-radius:10px;
  background:#d7d8e8;
  border-collapse:separate;
  margin:auto;
  max-width:620px; width:100%;
  font-family:inherit;
}

/* ── first column: label + value ───────────────────── */
.lab{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:6px 8px;
  font-weight:700;
  font-size:110%;
  white-space:nowrap;
}

/* ── second column: bar background ─────────────────── */
td.bar{padding:0}
.fill{
  height:20px;
  border:1px solid rgba(0,0,0,.25);
  background:#777;            /* replaced inline per-row */
}

/* row colours + bar colours */
.row-hp  {background:#ff9a9a} .row-hp  .fill{background:#ff5757}
.row-atk {background:#f6c19e} .row-atk .fill{background:#e48a39}
.row-def {background:#fff2b3} .row-def .fill{background:#f2cf45}
.row-spa {background:#bcd0ff} .row-spa .fill{background:#6d93ff}
.row-spd {background:#cfe8c4} .row-spd .fill{background:#62b455}
.row-spe {background:#f8bfd8} .row-spe .fill{background:#f27ab0}

/* total row */
.total   {background:#d7d8e8}
.total .lab{padding:6px;font-weight:700}
.total .bar{background:none}