MediaWiki:Common.css: Difference between revisions

Revision as of 19:04, 17 May 2025

/* --- Bulbapedia-style infobox tweaks ---------------------------------- */
table.pkmn-infobox {
    border: 4px solid var(--pkmn-border, #4CAF50);  /* default green */
    border-radius: 12px;
    background: #fefefe;
}
table.pkmn-infobox th.header-main {
    background: var(--pkmn-border, #4CAF50);
    color:#fff;
    font-size: 150%;
    text-align: center;
    padding:6px 0;
}
table.pkmn-infobox th.subhead {
    background:#d8d8d8;
    text-align:center;
    font-size:110%;
    padding:4px 0;
}
table.pkmn-infobox th[scope=row] {
    background:#f0f0f0;
    width:120px;
    text-align:left;
    padding:4px 6px;
}
table.pkmn-infobox td {
    padding:4px 6px;
}
/* ───── Type badge ───────────────────────────────── */
.type-badge{
  display:inline-block;
  padding:2px 6px 0;
  margin:2px 2px 0;
  font-size:85%; font-weight:bold; color:#fff;
  line-height:14px;
  border-radius:4px;
  text-shadow:0 1px 1px rgba(0,0,0,.4);
}
.type-Bug {background:#A8B820}
.type-Dark{background:#705848}
.type-Dragon{background:#7038F8}
.type-Electric{background:#F8D030}
.type-Fairy{background:#EE99EE}
.type-Fighting{background:#C03028}
.type-Fire{background:#F08030}
.type-Flying{background:#A890F0}
.type-Ghost{background:#705898}
.type-Grass{background:#78C850}
.type-Ground{background:#E0C068}
.type-Ice{background:#98D8D8}
.type-Normal{background:#A8A878}
.type-Poison{background:#A040A0}
.type-Psychic{background:#F85888}
.type-Rock{background:#B8A038}
.type-Steel{background:#B8B8D0}
.type-Water{background:#6890F0}

/* ───── 2-column info rows (Abilities & Breeding) ── */
.dual-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.dual-col .cell{
  background:#fff;
  border-radius:10px;
  padding:6px 4px;
  text-align:center;
  font-weight:bold;
}
.dual-col.smalltxt .cell{font-size:90%}

/* tighten TD padding so nested tables fit nicely */
table.pkmn-infobox td{padding:4px 6px}


/* ---------- EV yield bar -------------------------------------------- */
.evbar {                     /* wrapper <td> */
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:nowrap;        /* keep one row */
    gap:4px;
    padding:6px 0;
}

span.ev-box {
    display:inline-block;
    width:46px;              /* 46×6 + gaps ≈ fits 280 px table */
    min-height:46px;
    border-radius:12px;
    font-weight:bold;
    text-align:center;
    line-height:18px;
    color:#000;
    background:#ddd;         /* default */
}
span.ev-box .value { display:block; font-size:110%; padding-top:4px; }
span.ev-box .label { display:block; font-size:80%; }

/* pastel colours per stat (matches Bulbapedia) */
span.ev-HP      { background:#A7DB8D; }
span.ev-Atk     { background:#F5AC78; }
span.ev-Def     { background:#FAE078; }
span.ev-SpAtk   { background:#9DB7F5; }
span.ev-SpDef   { background:#AFAFDC; }
span.ev-Speed   { background:#FA92B2; }

/* ───── Bulbapedia-style EV yield row ──────────────────────────────── */
.ev-wrapper      { text-align:center; }
.ev-wrapper .ttl { font-weight:bold; margin:4px 0; }

/* --- EV flex row  →  now Grid with six equal columns ---------------- */
.ev-row{
    display:grid;
    grid-template-columns:repeat(6,1fr); /* exactly 6 boxes per row   */
    gap:4px;                             /* spacing between boxes     */
    margin-top:4px;                      /* little space under Total  */
}

/* the boxes no longer need fixed width; let them fill the grid cell   */
span.ev-box{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    min-height:36px;                     /* keep the height you like   */
    border-radius:10px;
    font-weight:bold;
    line-height:18px;
    color:#000;
    font-size:90%;
    box-sizing:border-box;
    width:100%;                          /* stretch to cell            */
}


/* pastel colours close to Bulbapedia */
.ev-HP      { background:#A7DB8D; }  /* light green   */
.ev-Atk     { background:#F5AC78; }  /* peach         */
.ev-Def     { background:#FAE078; }  /* light yellow  */
.ev-SpAtk   { background:#9DB7F5; }  /* sky blue      */
.ev-SpDef   { background:#C6C1E5; }  /* periwinkle    */
.ev-Speed   { background:#FA92B2; }  /* pink          */

/* tighten white panel that holds the type badges */
.type-box{
  background:#fff;
  border-radius:10px;
  padding:2px 4px;   /* ↓ from 12-ish */
  display:inline-block;
}

/* Abilities two-col grid */
.abil-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.abil-grid .abil{
  padding:4px 2px;
  font-weight:700;
}
.abil-grid .hidden-small{
  font-size:85%;
  line-height:14px;
  font-weight:400;
}

/* Breeding two-col grid */
.breed-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.breed-grid .breed-cell{
  padding:6px 4px;
  font-weight:700;
}