2026-07-11 00:29:47 +00:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "utf-8" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1" / >
< title > Thermograph — a single day< / title >
2026-07-11 15:59:14 +00:00
< meta name = "description" content = "Pick any point on Earth and see how its recent weather stacks up against ~45 years of local climate history — graded days, calendars, forecasts, and side-by-side comparisons." / >
< meta name = "theme-color" content = "#f0803c" / >
<!-- Link previews (Discord, Slack, iMessage…). The server fills the og:url /
og:image origins in from this request's scheme://host + base path —
crawlers need absolute URLs and don't run JS. -->
< meta property = "og:type" content = "website" / >
< meta property = "og:site_name" content = "Thermograph" / >
< meta property = "og:title" content = "Thermograph — a single day" / >
< meta property = "og:description" content = "Pick any point on Earth and see how its recent weather stacks up against ~45 years of local climate history — graded days, calendars, forecasts, and side-by-side comparisons." / >
< meta property = "og:url" content = "__ORIGIN__/day" / >
< meta property = "og:image" content = "__ORIGIN__/logo.png" / >
< meta property = "og:image:width" content = "512" / >
< meta property = "og:image:height" content = "512" / >
< meta property = "og:image:alt" content = "Thermograph logo" / >
< meta name = "twitter:card" content = "summary" / >
< link rel = "icon" href = "logo.svg" type = "image/svg+xml" / >
< link rel = "apple-touch-icon" href = "logo.png" / >
2026-07-11 00:29:47 +00:00
< link rel = "stylesheet" href = "https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" / >
< link rel = "stylesheet" href = "style.css" / >
< / head >
< body >
< header >
< div class = "brand" >
< span class = "logo" > ▚< / span >
< div >
< h1 > Thermograph · Day< / h1 >
2026-07-11 07:02:19 +00:00
< p class = "tag" > Every percentile boundary for one day vs its typical climate< / p >
2026-07-11 00:29:47 +00:00
< / div >
< nav class = "view-nav" aria-label = "Views" >
< a href = "./" data-view = "map" > Weekly< / a >
< a href = "calendar" data-view = "calendar" > Calendar< / a >
< a href = "day" data-view = "day" class = "active" > Day< / a >
2026-07-11 02:58:56 +00:00
< a href = "compare" data-view = "compare" > Compare< / a >
2026-07-11 00:29:47 +00:00
< / nav >
< / div >
< / header >
< main >
< section class = "controls" >
< div class = "find-bar" >
< button type = "button" id = "find-btn" class = "find-btn" > < / button >
< span id = "loc-label" class = "loc-label" hidden > < / span >
< / div >
< div class = "day-nav" >
< button type = "button" id = "prev-day" class = "day-step" title = "Previous day" aria-label = "Previous day" > ‹ < / button >
< label class = "day-date" > Day
< input id = "date-input" type = "date" / >
< / label >
< button type = "button" id = "next-day" class = "day-step" title = "Next day" aria-label = "Next day" > › < / button >
< / div >
< / section >
< div id = "day-head" class = "cal-head" hidden > < / div >
< div class = "placeholder" id = "day-placeholder" >
< p > Pick a place and a day — or open this from a day on the map or calendar — to see
2026-07-11 07:02:19 +00:00
the value at every tier boundary for that day's typical climate.< / p >
2026-07-11 00:29:47 +00:00
< / div >
< div id = "day-body" > < / div >
< / main >
< script src = "https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" > < / script >
< script src = "nav.js" > < / script >
< script src = "mappicker.js" > < / script >
< script src = "day.js" > < / script >
< / body >
< / html >
