Skip to content

Add navigation button and improve point overlay layout#80

Merged
yepzdk merged 4 commits intodevelopfrom
feature/navigation-button-point-overlay
Mar 12, 2026
Merged

Add navigation button and improve point overlay layout#80
yepzdk merged 4 commits intodevelopfrom
feature/navigation-button-point-overlay

Conversation

@yepzdk
Copy link
Copy Markdown
Contributor

@yepzdk yepzdk commented Mar 11, 2026

Summary

  • Add a native navigation button to the next-to-unlock point overlay (opens Apple Maps on iOS, Google Maps on Android)
  • Rework overlay layout from absolute-positioned elements to a three-column flex row with descriptive labels (navigation, map, distance)
  • Fix map icon sizing by using inline styles to override FontAwesome's svg-inline--fa class
  • Improve distance display to show rounded km (e.g. "1.2 km") when distance is >= 1000 m

Screenshot

Screenshot 2026-03-11 at 19 02 23

Test plan

  • Open a route's points page and locate the "next to unlock" point
  • Verify all three icons (footprints, map, distance) are visible with labels beneath them
  • Tap the footprints/navigation button — confirm it opens native maps app with correct coordinates
  • Tap the map button — confirm it navigates to the OpenStreetMap view (or prompts for consent)
  • Verify the map icon renders at the correct size (~1.4rem)
  • Verify distance shows meters below 1 km and km at or above 1 km
  • Test on both iOS Safari and Android Chrome

yepzdk and others added 2 commits March 11, 2026 17:46
Rework the next-to-unlock point overlay with a three-column flex layout
containing native navigation, map link, and distance display — each with
a descriptive label. Fix map icon sizing by using inline styles to
override FontAwesome's svg-inline--fa class. Improve distance formatting
to show km when >= 1000 m.

Co-authored-by: Claude <noreply@anthropic.com>
Use daddr/directions URLs for Apple Maps and Google Maps so the
navigation button opens turn-by-turn directions instead of just
dropping a pin. Guard against distance being false (negative computed
value) by displaying "0 m" instead of "false m". Fix prettier
formatting.

Co-authored-by: Claude <noreply@anthropic.com>
@yepzdk yepzdk requested a review from cableman March 11, 2026 17:10
Copy link
Copy Markdown
Contributor

@cableman cableman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If you are using the right classes, you known best. I would have been nice with a screenshot of the changes.

Co-authored-by: Claude <noreply@anthropic.com>
@yepzdk yepzdk requested a review from cableman March 11, 2026 18:12
Use the geo: URI scheme on Android to trigger the OS intent chooser,
letting the user pick their preferred maps app (Google Maps, Waze,
OsmAnd, etc.). Keep Apple Maps on iOS and Google Maps as fallback for
desktop/unknown platforms.

Co-authored-by: Claude <noreply@anthropic.com>
@yepzdk yepzdk merged commit 39765bb into develop Mar 12, 2026
5 checks passed
@yepzdk yepzdk deleted the feature/navigation-button-point-overlay branch March 12, 2026 13:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants