From a9fa1d8344259e9dce730cef6780a5f3cb6210be Mon Sep 17 00:00:00 2001 From: Graham McIntire Date: Wed, 15 Apr 2026 10:06:31 -0500 Subject: [PATCH] Pin propagation legend to top-right on desktop too MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The forecast timeline at the bottom of the map now spans a lot of hours horizontally, and on wide screens it ran into the legend that used to anchor bottom-right — covering the later forecast hours. Move the legend to top-right on every viewport (it was already there on mobile for the same reason). --- assets/js/propagation_map_hook.ts | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/assets/js/propagation_map_hook.ts b/assets/js/propagation_map_hook.ts index a8faba56..dc19c91c 100644 --- a/assets/js/propagation_map_hook.ts +++ b/assets/js/propagation_map_hook.ts @@ -982,8 +982,10 @@ export const PropagationMap: Record & { } }) - // Legend — compact on mobile, moved to top-right to avoid timeline overlap - const legend = L.control({ position: isMobile() ? "topright" : "bottomright" }) + // Legend lives in the top-right on every viewport so the + // forecast timeline at the bottom can stretch to full width + // without the legend covering the later hours. + const legend = L.control({ position: "topright" }) legend.onAdd = () => { const div = L.DomUtil.create("div") const mobile = isMobile()