Template:StatTable/styles.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary Tag: Reverted |
||
| Line 1: | Line 1: | ||
/* ── | /* ── column widths ───────────────────────────────── */ | ||
.statbox | .statbox col.col-bar { width: 255px; } | ||
border: | .statbox col.col-range { width: 100px; } /* adjust to taste */ | ||
/* ── header styling ───────────────────────────────── */ | |||
.statbox thead th { | |||
background: #e0e1eb; /* light header background */ | |||
text-align: center; | |||
font-weight: 700; | |||
font-size: 90%; | |||
padding: 4px 8px; | |||
white-space: nowrap; | |||
border-bottom: 2px solid rgba(0,0,0,0.2); | |||
} | |||
/* merge the rounded corners if you like */ | |||
.statbox thead tr:first-child th.hdr-stat { border-top-left-radius:10px; } | |||
.statbox thead tr:first-child th.hdr-range { border-top-right-radius:10px; } | |||
/* ── range cells ────────────────────────────────── */ | |||
.statbox td.range { | |||
text-align: center; | |||
padding: 3px 6px; | |||
vertical-align: middle; | |||
white-space: nowrap; | |||
} | |||
.statbox td.range small { | |||
display: block; | |||
font-size: 90%; | |||
} | |||
/* ── tweak your existing rules as before ───────── */ | |||
.statbox table { | |||
border:3px solid #444; | |||
border-radius:10px; | border-radius:10px; | ||
background:#d7d8e8; | background:#d7d8e8; | ||
| Line 8: | Line 39: | ||
max-width:620px; | max-width:620px; | ||
font-family:inherit; | font-family:inherit; | ||
width:auto; /* let it shrink-to-fit */ | |||
} | } | ||
.lab{ | .lab{ | ||
display:flex; | display:flex; | ||
| Line 19: | Line 49: | ||
white-space:nowrap; | white-space:nowrap; | ||
} | } | ||
td.bar { padding:0 } | |||
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 | background:#777; | ||
} | } | ||
/* your row-colour rules stay the same */ | |||
/* | |||
Revision as of 06:09, 19 May 2025
/* ── column widths ───────────────────────────────── */
.statbox col.col-bar { width: 255px; }
.statbox col.col-range { width: 100px; } /* adjust to taste */
/* ── header styling ───────────────────────────────── */
.statbox thead th {
background: #e0e1eb; /* light header background */
text-align: center;
font-weight: 700;
font-size: 90%;
padding: 4px 8px;
white-space: nowrap;
border-bottom: 2px solid rgba(0,0,0,0.2);
}
/* merge the rounded corners if you like */
.statbox thead tr:first-child th.hdr-stat { border-top-left-radius:10px; }
.statbox thead tr:first-child th.hdr-range { border-top-right-radius:10px; }
/* ── range cells ────────────────────────────────── */
.statbox td.range {
text-align: center;
padding: 3px 6px;
vertical-align: middle;
white-space: nowrap;
}
.statbox td.range small {
display: block;
font-size: 90%;
}
/* ── tweak your existing rules as before ───────── */
.statbox table {
border:3px solid #444;
border-radius:10px;
background:#d7d8e8;
border-collapse:separate;
margin:auto;
max-width:620px;
font-family:inherit;
width:auto; /* let it shrink-to-fit */
}
.lab{
display:flex;
justify-content:space-between;
align-items:center;
font-weight:700;
font-size:110%;
white-space:nowrap;
}
td.bar { padding:0 }
.fill{
height:20px;
border:1px solid rgba(0,0,0,.25);
background:#777;
}
/* your row-colour rules stay the same */