Add a search box, matching NPS's Park Tiles viewer
CI / check (push) Successful in 19s
CI / deploy (push) Successful in 13s

Top-left map control (topmost, above Home/zoom) with a text input:
"lat, lng" is parsed and jumped to directly (same plain-text shape the
topbar's coordinate readout already copies to the clipboard), anything
else is geocoded via Nominatim — OSM's own geocoder, free, no API key,
matching the online basemap's own OSM-derived style. Online only, same
story as this app's other non-basemap online features (Radar, the
Wikipedia layer) — no offline geocoding index to fall back to.
This commit is contained in:
randy committed 2026-09-10 23:59:35 +02:00
1 parent 23a84ac185
commit b4a1c6c0cc
5 files changed
+186

No files matched your search

+66
View File
@@ -879,6 +879,72 @@ html, body {
color: #333;
}
.search-ctrl {
position: relative;
}
.search-ctrl__button svg {
display: block;
margin: 0 auto;
width: 18px;
height: 18px;
}
.search-ctrl__button.active {
background: #dbe9ff;
}
.search-panel {
position: absolute;
top: 0;
left: 100%;
margin-left: 8px;
z-index: 20;
width: 240px;
background: #fff;
border: 1px solid #ddd;
border-radius: 6px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
padding: 6px 8px;
font-size: 13px;
}
.search-panel[hidden] {
display: none;
}
.search-panel__input {
width: 100%;
box-sizing: border-box;
border: 1px solid #ccc;
border-radius: 4px;
padding: 5px 7px;
font: inherit;
}
.search-panel__results {
list-style: none;
margin: 6px 0 0;
padding: 0;
max-height: 220px;
overflow-y: auto;
}
.search-panel__result {
padding: 6px 4px;
border-radius: 4px;
cursor: pointer;
}
.search-panel__result:hover {
background: #f0f0f0;
}
.search-panel__status {
padding: 6px 4px;
color: #888;
}
.notes-ctrl {
position: relative;
}