Product Gallery 25 block design & features
An edge-to-edge product gallery where each photo fills the height of the viewport, built with shadcn/ui Carousel, Collapsible and PhotoSwipe. On desktop several tall photos sit side by side with thin gaps between them.
Arrow buttons fade in at the sides when you hover the gallery, and the carousel loops. In the bottom right corner a small tray shows the first thumbnail with a grip handle. Clicking the handle or the thumbnail slides the tray open to reveal the rest of the thumbnails, and clicking one jumps to that photo. Clicking a photo opens a fullscreen lightbox.
On mobile one photo is shown at a time with the arrows always visible, and the thumbnail tray is hidden. The images and gallery ID are props.