Skip to content

Add welcome modal, fix mobile layout, custom zoom FABs - #8

Merged
cafca merged 3 commits into
mainfrom
claude/musing-driscoll
Apr 15, 2026
Merged

Add welcome modal, fix mobile layout, custom zoom FABs#8
cafca merged 3 commits into
mainfrom
claude/musing-driscoll

Conversation

@cafca

@cafca cafca commented Apr 15, 2026

Copy link
Copy Markdown
Owner

Summary

  • Welcome modal: shown to first-time visitors (new anonymous session = no existing session cookie). Contains a short app description, three usage steps, a sign-up nudge, and a greyed-out privacy notice. Dismissed with a single "Start exploring" button.
  • Mobile layout fix: search bar and user bar were independently absolutely-positioned and collided for long usernames / multiple auth buttons. Wrapped in a shared flex container that collapses to a single merged card on mobile (no gap, shared shadow).
  • Custom zoom FABs: replaced MapLibre's built-in NavigationControl with two circular FABs (ZoomControls.svelte) that match the undo/redo FAB style (48 px on mobile, 40 px on desktop, bottom-right).
  • SVG icons: undo, redo, zoom in, and zoom out buttons now use SVGs instead of Unicode characters for reliable centering.

Reviewer notes

  • First-visit detection is purely frontend: auth.isNewSession is set to true in checkSession() when api.me() fails and a new anonymous session is created. No backend or localStorage changes.
  • The welcome modal content was edited by the user directly (intro copy, step 2 wording, sign-up prompt, privacy paragraph).
  • The spec doc lives at docs/superpowers/specs/2026-04-15-welcome-modal-design.md.

cafca added 3 commits April 15, 2026 19:19
- Show a welcome modal to first-time visitors (detected via new anonymous
  session) with app description, usage steps, and a privacy notice
- Merge search bar and user bar into a single card on mobile to prevent
  overlap for long usernames or multiple auth buttons
- Replace MapLibre NavigationControl with custom circular zoom FABs
  (bottom-right, matching undo/redo FAB style on mobile)
- Move zoom controls to bottom-right; double bottom offset on desktop
- Replace text characters in undo/redo and zoom buttons with SVGs for
  reliable centering
@cafca
cafca merged commit bbf0a22 into main Apr 15, 2026
5 checks passed
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.

1 participant