MediaWiki:Common.css: Difference between revisions

Revision as of 18:33, 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;
}
span.type-badge {
    display:inline-block; min-width:64px;
    color:#fff; font-weight:bold; text-align:center;
    border-radius:6px; margin:2px 2px; padding:2px 4px 3px;
}
span.type-Bug       { background:#A8B820;}
span.type-Dark      { background:#705848;}
span.type-Dragon    { background:#7038F8;}
span.type-Electric  { background:#F8D030;}
span.type-Fairy     { background:#EE99EE;}
span.type-Fighting  { background:#C03028;}
span.type-Fire      { background:#F08030;}
span.type-Flying    { background:#A890F0;}
span.type-Ghost     { background:#705898;}
span.type-Grass     { background:#78C850;}
span.type-Ground    { background:#E0C068;}
span.type-Ice       { background:#98D8D8;}
span.type-Normal    { background:#A8A878;}
span.type-Poison    { background:#A040A0;}
span.type-Psychic   { background:#F85888;}
span.type-Rock      { background:#B8A038;}
span.type-Steel     { background:#B8B8D0;}
span.type-Water     { background:#6890F0;}
/* ---------- 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-row {
    display:flex;                 /* put boxes in one line   */
    justify-content:center;
    gap:4px;                      /* space between boxes     */
    flex-wrap:wrap;               /* wrap on very narrow screens */
}

span.ev-box {
    display:inline-flex;
    flex-direction:column;
    justify-content:center;
    width:56px;                   /* 6×56 + 5×4 gap = 344 px */
    height:56px;
    border-radius:10px;
    font-weight:bold;
    line-height:18px;
    color:#000;
    font-size:90%;
    box-sizing:border-box;
}

/* 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          */