Skip to content

Add preview lightbox with layout morph and mobile accordion#32

Draft
austinmrobinson wants to merge 2 commits into
mainfrom
austin/preview-lightbox-mobile-96e0
Draft

Add preview lightbox with layout morph and mobile accordion#32
austinmrobinson wants to merge 2 commits into
mainfrom
austin/preview-lightbox-mobile-96e0

Conversation

@austinmrobinson

@austinmrobinson austinmrobinson commented Jul 1, 2026

Copy link
Copy Markdown
Owner

Summary

Adds preview lightbox with layout morph on desktop and accordion-based inline previews on mobile.

Follow-up fixes

  • Lightbox no longer auto-closes when focus moves to the dialog (deselect timer paused while open)
  • Accordion row typography/alignment matches desktop list items (text-base, proper padding)
  • First work item opens by default on mobile
  • Swipe left/right navigates media on mobile; keyboard < > controls hidden below lg
  • Lightbox media no longer shows blurred duplicate layers or backdrop blur on content

Test plan

  • Desktop: open lightbox from side preview — stays open until backdrop click
  • Mobile: accordion text matches desktop list sizing
  • Mobile: first work item expanded on load
  • Mobile: swipe between carousel slides; no arrow key buttons visible
  • Mobile: lightbox media is sharp, not blurred
Open in Web Open in Cursor 

- Install shadcn Accordion and add PreviewLightbox using Dialog + framer-motion layoutId
- Make MediaCarousel and ProfileCardStack viewports clickable to expand into lightbox
- Add MobilePreviewAccordion for one-at-a-time inline previews below lg breakpoint
- Split homepage list into desktop hover panel and mobile accordion layouts

Co-authored-by: Austin Robinson <austinrobinsondesign@gmail.com>
@vercel

vercel Bot commented Jul 1, 2026

Copy link
Copy Markdown
Contributor

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
dotcom Ready Ready Preview, Comment Jul 1, 2026 2:04am

Request Review

- Prevent deselect timer and panel dismissal while lightbox is open
- Ignore focus moves to dialog when leaving list items
- Reset accordion trigger typography to match desktop list rows
- Default first work accordion item open on mobile
- Add swipe navigation on mobile; hide keyboard arrow controls below lg
- Remove ambient blur layers and overlay backdrop blur in lightbox

Co-authored-by: Austin Robinson <austinrobinsondesign@gmail.com>
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