From 6da2f34b26bbded98d08c9b8d12d6446766259cd Mon Sep 17 00:00:00 2001 From: fraxle Date: Sat, 6 Jun 2026 00:23:42 +0100 Subject: [PATCH] 2.7.6 Style tidy --- assets/about.css | 2 +- assets/css/base.css | 4 ++-- assets/css/header.css | 4 ++-- assets/css/table.css | 13 +++++++++++ assets/css/ui.css | 16 +++++++++---- assets/js/components/DayTabs.js | 41 --------------------------------- 6 files changed, 29 insertions(+), 51 deletions(-) diff --git a/assets/about.css b/assets/about.css index 2c7c023..1b683c7 100644 --- a/assets/about.css +++ b/assets/about.css @@ -42,7 +42,7 @@ header a { padding-bottom: 2px; transition: color 0.2s, border-color 0.2s; } -header a:hover { color: #c8922a; border-bottom-color: rgba(200,146,42,0.5); } +header a:hover { color: #1e1208; border-bottom-color: #1e1208; text-decoration: none; } header a.active { color: #c8922a; } /* Desktop: nav-links renders inline as part of header flex row */ diff --git a/assets/css/base.css b/assets/css/base.css index 948fda6..82fef14 100644 --- a/assets/css/base.css +++ b/assets/css/base.css @@ -112,8 +112,8 @@ body { } .utci-topnav a:hover { - color: #c8922a; /* brass on hover */ - border-bottom-color: #c8922a80; /* faint underline */ + color: #1e1208; + border-bottom-color: #1e1208; } /* Desktop: nav-links renders inline as part of nav flex row */ diff --git a/assets/css/header.css b/assets/css/header.css index bcc121b..ad52d08 100644 --- a/assets/css/header.css +++ b/assets/css/header.css @@ -426,8 +426,8 @@ grid-template-columns: 1fr; /* single column — stack title, dial, search */ grid-template-areas: none; /* flow in DOM order: left, dial, selector, why */ gap: 20px; - padding-bottom: 24px; - margin-bottom: 24px; + padding-bottom: 15px; + margin-bottom: 0px; } /* Clear the desktop area placement so children stack in DOM order */ diff --git a/assets/css/table.css b/assets/css/table.css index dce08cd..237c176 100644 --- a/assets/css/table.css +++ b/assets/css/table.css @@ -12,6 +12,8 @@ .utci-day-tabs-wrap { position: relative; margin-top: 12px; + margin-bottom: 15px; + border: 1px solid #c9b08a; } /* Edge fade gradients — only show when there's content to scroll to. */ @@ -595,6 +597,17 @@ .utci-thead-sticky { top: 72px; } + + /* Shrink the day-tab labels on phones so more days stay readable + within the viewport before the tab strip needs to scroll. */ + .utci-day-tab { + font-size: 9px; + padding: 10px 12px; + } + + .utci-day-date { + font-size: 12px; + } } /* The shifted track inside the sticky header — JS sets transform:translate3d diff --git a/assets/css/ui.css b/assets/css/ui.css index 0f5f80f..4d3cd7f 100644 --- a/assets/css/ui.css +++ b/assets/css/ui.css @@ -1075,13 +1075,13 @@ } .scope-ring { - width: 250px; - height: 250px; + width: 225px; + height: 225px; margin: 0 auto; } .scope-env-row { - width: 250px; + width: 225px; /* kept in step with the dial width above */ } /* Halve the hourly-table cell padding on mobile so more columns fit @@ -1102,17 +1102,23 @@ } /* At ≤640px the top nav becomes position:fixed (72px tall, see base.css), - so the app needs 96px of top padding to clear it. This must come AFTER the + so the app needs top padding to clear it. This must come AFTER the max-width:800px rule above — which sets padding-top:52px for the tablet range where the nav is NOT fixed — so it wins the cascade on true mobile. */ @media (max-width: 640px) { .utci-app { - padding-top: 96px; + padding-top: 80px; } .utci-fetch-time { text-align: center; /* override the default left-align on mobile */ } + + /* Hide the export panel on phones — no room for it, and the export + actions aren't useful at this size. */ + .export-panel { + display: none; + } } diff --git a/assets/js/components/DayTabs.js b/assets/js/components/DayTabs.js index 292d7be..35f72e4 100644 --- a/assets/js/components/DayTabs.js +++ b/assets/js/components/DayTabs.js @@ -349,17 +349,6 @@ export function DayTabs({ filter: isActive ? 'saturate(1.1) brightness(1.04)' : 'none', }} > - ${locked && html` 🔒`} ${dayName} @@ -584,36 +573,6 @@ export function DayTabs({ `; })()} - ${(() => { - const band = confidenceBand(selectedDay); - const isOutlook = selectedDay >= 7; - return html` -
- - Day ${selectedDay + 1} of 14 · Forecast clarity: ${band.label} - - ${isOutlook && html` - - forecast skill is reduced — treat hourly detail as trend, not precision - `} -
`; - })()} - `; }