1.8.0
New table column order Table groups and colouring Chance of rain column
This commit is contained in:
@@ -710,6 +710,64 @@
|
||||
border-left: 2px solid rgba(74, 50, 24, 0.18);
|
||||
}
|
||||
|
||||
/* ── COLUMN GROUP COLOURS — header cell tints per group ─────────────────
|
||||
Each grp-* class gives the th a distinct background + text colour.
|
||||
The hover state darkens slightly. The col-unit underneath inherits
|
||||
a matching accent colour. */
|
||||
|
||||
.utci-table th.grp-felt { background: #dff3ec; color: #075c3a; }
|
||||
.utci-table th.grp-surface { background: #ddeaf8; color: #0b3e72; }
|
||||
.utci-table th.grp-ambient { background: #eceae3; color: #3c3a35; }
|
||||
.utci-table th.grp-precip { background: #f7e4ee; color: #6b1e3a; }
|
||||
.utci-table th.grp-sky { background: #eae8fc; color: #352e7a; }
|
||||
.utci-table th.grp-wind { background: #fae6e0; color: #6a2210; }
|
||||
.utci-table th.grp-airqual { background: #e5f0d8; color: #244408; }
|
||||
.utci-table th.grp-solar { background: #faeacc; color: #5a3004; }
|
||||
|
||||
.utci-table th.grp-felt.col-info-th:hover { background: #c8ead9; }
|
||||
.utci-table th.grp-surface.col-info-th:hover { background: #c5d9f0; }
|
||||
.utci-table th.grp-ambient.col-info-th:hover { background: #d8d6ce; }
|
||||
.utci-table th.grp-precip.col-info-th:hover { background: #eecfdf; }
|
||||
.utci-table th.grp-sky.col-info-th:hover { background: #d4d0f5; }
|
||||
.utci-table th.grp-wind.col-info-th:hover { background: #f0cfc5; }
|
||||
.utci-table th.grp-airqual.col-info-th:hover { background: #d0e4bc; }
|
||||
.utci-table th.grp-solar.col-info-th:hover { background: #f0d5a8; }
|
||||
|
||||
.utci-table th.grp-felt .col-unit { color: #0f9e63; }
|
||||
.utci-table th.grp-surface .col-unit { color: #2672c8; }
|
||||
.utci-table th.grp-ambient .col-unit { color: #7a7870; }
|
||||
.utci-table th.grp-precip .col-unit { color: #b03060; }
|
||||
.utci-table th.grp-sky .col-unit { color: #6058c8; }
|
||||
.utci-table th.grp-wind .col-unit { color: #b04030; }
|
||||
.utci-table th.grp-airqual .col-unit { color: #4a8018; }
|
||||
.utci-table th.grp-solar .col-unit { color: #b07820; }
|
||||
|
||||
/* ── GROUP LABEL ROW — spans above the column header row ────────────────
|
||||
A second tr in the thead. Each cell spans all visible columns in its
|
||||
group. The Hour column gets a blank matching-background cell. */
|
||||
|
||||
.grp-label-row th {
|
||||
font-family: Manrope, sans-serif;
|
||||
font-size: 9px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.10em;
|
||||
padding: 4px 8px 2px;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
border-bottom: 1px solid rgba(0,0,0,0.06);
|
||||
}
|
||||
|
||||
.grp-label-hour { background: #f0e4c4; }
|
||||
.grp-label-felt { background: #dff3ec; color: #075c3a; border-left: 2px solid rgba(74,50,24,0.18); }
|
||||
.grp-label-surface { background: #ddeaf8; color: #0b3e72; border-left: 2px solid rgba(74,50,24,0.18); }
|
||||
.grp-label-ambient { background: #eceae3; color: #3c3a35; border-left: 2px solid rgba(74,50,24,0.18); }
|
||||
.grp-label-precip { background: #f7e4ee; color: #6b1e3a; border-left: 2px solid rgba(74,50,24,0.18); }
|
||||
.grp-label-sky { background: #eae8fc; color: #352e7a; border-left: 2px solid rgba(74,50,24,0.18); }
|
||||
.grp-label-wind { background: #fae6e0; color: #6a2210; border-left: 2px solid rgba(74,50,24,0.18); }
|
||||
.grp-label-airqual { background: #e5f0d8; color: #244408; border-left: 2px solid rgba(74,50,24,0.18); }
|
||||
.grp-label-solar { background: #faeacc; color: #5a3004; border-left: 2px solid rgba(74,50,24,0.18); }
|
||||
|
||||
/* ── FILTER PROFILES + COLUMN TOGGLES — mobile fixes ───────────────── */
|
||||
@media (max-width: 640px) {
|
||||
|
||||
|
||||
Reference in New Issue
Block a user