Skip to content

feat: Welcome modal with onboarding guide and bridge integration (fixes #13)#236

Open
jiangyj545 wants to merge 1 commit into
capofficial:mainfrom
jiangyj545:fix/welcome-modal-bridge-issue13
Open

feat: Welcome modal with onboarding guide and bridge integration (fixes #13)#236
jiangyj545 wants to merge 1 commit into
capofficial:mainfrom
jiangyj545:fix/welcome-modal-bridge-issue13

Conversation

@jiangyj545
Copy link
Copy Markdown

Summary

Fixes #13 — Adds a Welcome Modal that displays for new users on first visit, providing a quick onboarding guide to CAP.

What this PR does

New file: src/components/modals/Welcome.svelte

  • 3-step onboarding guide: Connect Wallet → Bridge Funds → Start Trading
  • Bridge integration: Direct link to Uniswap (Arbitrum) for buying CAP tokens
  • Smart display: Auto-shows on first visit, hidden after dismissal via localStorage
  • User control: "Don't show again" checkbox + "Got it!" dismiss button
  • Design consistency: Uses existing CSS variables (--primary, --layer25, etc.), same Modal base component, matches dark theme

Modified files:

File Change
components/layout/Modals.svelte Registered Welcome modal in the modal router
App.svelte Added auto-show logic in onMount with localStorage check

Design decisions

  • Used existing Modal.svelte base component (draggable, consistent header/close)
  • Bridge URL points to Uniswap Arbitrum CAP pool (same link used in Home footer)
  • 800ms delay on mount ensures UI is fully rendered before showing modal
  • No external dependencies added

Bounty

This PR addresses bounty issue #13 ($500, paid in crypto).


⚠️ Generated by AI agent — human-reviewed code quality. Build passes (npx rollup -c).

…ixes capofficial#13)

- New Welcome modal component showing CAP onboarding steps (connect wallet → bridge funds → start trading)
- Integrated Uniswap bridge link for buying CAP tokens on Arbitrum
- Auto-shows on first visit (localStorage flag to dismiss permanently)
- 'Don't show again' checkbox for user preference
- Matches existing design system (dark theme, primary green accent)
- Registered in Modals.svelte and triggered from App.svelte onMount
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.

Welcome modal with integrated bridge and/or instructions

1 participant