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:
/* one logical row */
/* frame & table */
.stat-row {
.statbox table{
   display: grid;
  border-radius:10px;
   grid-template-columns: 8.5em auto 3.5em;  /* label · bar · value */
   background:#d7d8e8;
   font-weight: 700;
   border-collapse:separate;
  margin:auto;
  max-width:620px;
   width:100%;
   font-family:inherit;
}
}
 
.statbox th{
/* label cell (scope=row) */
  width:110px;
.stat-lbl {
   padding:6px 4px;
   padding: 2px 4px;
   text-align:left;
   text-align: right;
  font-weight:700;
  font-size:110%;
}
}
 
.statbox td.val{
/* numerical value at the far right */
   width:48px;
.stat-val {
   text-align:right;
   padding: 2px 4px;
   padding-right:6px;
   text-align: right;
  font-weight:700;
   background: #dcdce9;           /* same slate-grey as Bulbapedia */
}
}
.statbox td.bar{padding:0}


/* bar container (light tint)  */
/* row background + bar colours */
.stat-bar {
.row-hp  {background:#ff9a9a}  .row-hp  .fill{background:#ff5757}
  position: relative;
.row-atk {background:#f6c19e}  .row-atk .fill{background:#e48a39}
  height: 18px;
.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}


/* coloured inner bar (darker tint) */
.fill{
.stat-fill {
   height:20px;
   position: absolute;
   border:1px solid rgba(0,0,0,.25);
   top: 0; left: 0;
  height: 100%;
}
}


/* tints ----------------------------------------------------------- */
.total-lab{padding:6px;font-weight:700;background:#d7d8e8}
.hp  { background:#ffb1b1; } .hp  .stat-fill{background:#ff6b6b;}
.total-val{padding:6px;text-align:right;background:#fff;font-weight:700}
.atk { background:#f3c29e; } .atk .stat-fill{background:#f0a15b;}
.def { background:#f8eba3; } .def .stat-fill{background:#f3d659;}
.spa { background:#b9c8f5; } .spa .stat-fill{background:#81a0f3;}
.spd { background:#c6e4b6; } .spd .stat-fill{background:#9cd478;}
.spe { background:#f7bdd5; } .spe .stat-fill{background:#f593bd;}
 
/* total row ------------------------------------------------------- */
.total-row {
  background:#dcdce9;
  text-align:center;
  padding:4px;
  font-weight:700;
  border-top:2px solid #555;
}

Revision as of 03:58, 19 May 2025

/* frame & table */
.statbox table{
  border-radius:10px;
  background:#d7d8e8;
  border-collapse:separate;
  margin:auto;
  max-width:620px;
  width:100%;
  font-family:inherit;
}
.statbox th{
  width:110px;
  padding:6px 4px;
  text-align:left;
  font-weight:700;
  font-size:110%;
}
.statbox td.val{
  width:48px;
  text-align:right;
  padding-right:6px;
  font-weight:700;
}
.statbox td.bar{padding:0}

/* row background + 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}

.fill{
  height:20px;
  border:1px solid rgba(0,0,0,.25);
}

.total-lab{padding:6px;font-weight:700;background:#d7d8e8}
.total-val{padding:6px;text-align:right;background:#fff;font-weight:700}
Retrieved from "http://pixelmonwiki.snowbirdmv.com/index.php?title=Template:StatTable/styles.css&oldid=605"