Skip to content

feat(web): global deposit methods popup - #20

Merged
stackified merged 6 commits into
mainfrom
dev
Jun 17, 2026
Merged

stackified merged 6 commits into
mainfrom
dev

Conversation

@stackified

@stackified stackified commented Jun 17, 2026 •

Copy link
Copy Markdown
Owner

Summary

  • Adds a global, brand-themed deposit announcement modal that appears on site load across every page
  • Centered modal with two-column layout (copy + AI-generated card/phone image), no auto-dismiss timer
  • Closes via the ✕ symbol, "Close Window" link, backdrop click, or Escape
  • Fixes basePath handling so images load correctly under the /RestroFX GitHub Pages deployment (popup image + the existing support-page hero)

Commits

  • 9c3df8b feat(web): add global deposit methods popup
  • 45f2a78 feat(web): redesign deposit popup as centered modal with branded image
  • edcfd80 fix(web): resolve deposit popup image under GitHub Pages basePath
  • dce7ede fix(web): load deposit support hero image under GitHub Pages basePath
  • 9520438 chore(web): update deposit card images

Test plan

  • Verify popup appears on homepage after load
  • Verify popup appears on internal pages (e.g. /about, /platforms)
  • Verify all close mechanisms work (X, Close Window, backdrop, Esc)
  • Verify image loads (no broken placeholder) on the live /RestroFX/ site
  • Verify support page hero image at /support/how-to-deposit-with-debit-cards renders
  • Verify responsive layout on mobile (image stacks below copy)

laveshparyani and others added 6 commits June 15, 2026 19:46
Add a brand-themed popup announcing debit card, credit card, and Apple Pay deposit support. It slides in on site load, stays for 6 seconds, then auto-dismisses, and can be closed early via the cancel (X) button.

- Mounted once from the root layout so it shows across all pages without re-triggering on client-side navigation
- Responsive: centered banner on mobile, bottom-right toast on desktop
- Includes auto-dismiss progress bar with prefers-reduced-motion support
- Links to the existing how-to-deposit support page
Convert the deposit announcement into a centered, brand-themed modal with a
two-column layout (copy + image). Remove the auto-dismiss timer so it stays
until the user closes it, and use a new AI-generated card/phone graphic.

- No timer: closes via the cancel (X) symbol, Close Window link, backdrop, or Escape
- Adds deposit-cards.png and displays it with object-contain for full clarity
- Responsive two-column layout, smooth fade/scale animations
- Removes the now-unused deposit-progress CSS keyframe
Wrap the popup image src with withBasePath so it loads correctly when the
site is served under the /RestroFX basePath on GitHub Pages. With static
export + unoptimized images, Next.js does not auto-prefix basePath for public
assets, so the image 404'd and rendered as an empty black panel.
Wrap the Debit-Cards.png src with withBasePath so the hero image on the
how-to-deposit support page loads correctly under the /RestroFX basePath
instead of 404'ing.
Update Debit-Cards.png and add Debit-Cards-2.png deposit assets.
feat(web): global deposit methods popup
@stackified stackified self-assigned this Jun 17, 2026
@stackified stackified added the enhancement New feature or request label Jun 17, 2026
@stackified
stackified merged commit 1506b13 into main Jun 17, 2026
2 checks passed

This branch was previously deployed

1 inactive deployment
github-pages — dcf5e4b9 Deployed Jun 17, 2026 by stackified via deploy-github-pages #133
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants