Fix note UX: unreachable wiki link, white Save hover, stale icon preview, invisible new points
CI / check (push) Successful in 41s
CI / deploy (push) Successful in 12s

- "Nearby on Wikipedia" linked to KIWIX_URL, a Docker-internal hostname
  (http://kiwix:8080) no real browser can resolve. Split it: KIWIX_URL
  stays server-side-only for the reachability check, and the link
  itself is built from KIWIX_PUBLIC_PORT (kiwix-serve's newly
  published host port) plus whatever host the visitor already used to
  reach maptool — works regardless of which hostname/IP that is.
- The Save button went white on hover in GTK-themed Chrome: the
  browser's native button skin was painting over the custom
  background because appearance wasn't reset.
- The map preview marker for a pending note always showed a plain red
  pin no matter which icon was picked in the form. NoteSaveForm now
  reports icon changes via onIconChange so NotesControl can update the
  marker's glyph live.
- Saving a note (or a Measure "Save as note") left the new/grown
  .geojson file unchecked and invisible until manually toggled on.
  notifyGpxStoreChanged now carries the affected path so
  GpxPanelControl auto-shows it.
This commit is contained in:
randy committed 2026-09-09 15:11:50 +02:00
1 parent 4f022ec43a
commit 9997a8a8c0
7 files changed
+103 -17

No files matched your search

+28
View File
@@ -930,6 +930,29 @@ html, body {
background: #dbe9ff;
}
/* The pending-note marker shown on the map while the save form is open —
updates live to whatever icon is picked (see notes.js's onIconChange). A
plain round badge (not a drop-pin shape) since MapLibre anchors a custom
marker element at its center, and a pin's usual tip-points-at-the-spot
shape needs a bottom anchor to line up correctly. */
.notes-panel__preview-marker {
width: 26px;
height: 26px;
border-radius: 50%;
background: #c0392b;
border: 2px solid #fff;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
display: flex;
align-items: center;
justify-content: center;
color: #fff;
}
.notes-panel__preview-marker svg {
width: 15px;
height: 15px;
}
.notes-panel__target,
.notes-panel__new-name {
width: 100%;
@@ -948,6 +971,11 @@ html, body {
}
.notes-panel__actions button {
/* Without this, some browsers (GTK-themed Chrome on Linux in
particular) paint their own native hover/active highlight over a
button's background instead of leaving a custom one alone — the
Save button visibly went white on hover because of exactly this. */
appearance: none;
width: auto;
height: auto;
padding: 4px 10px;