Product Detail 28 block design & features
The block is a product page for a leather sectional sofa, built with shadcn/ui. The left column opens with the product name, a sale price and round color swatches, and a two-column grid of square photos fills the right side.
Below the swatches are a quantity stepper, an add to cart button that briefly crossfades to an "Added to cart" confirmation with a check, and a full-width buy now button, then a description and an accordion. The first panel holds a design note and a striped specifications table, with product details and care in the panels that follow.
The details column stays sticky while the photos scroll, and each photo opens in a PhotoSwipe lightbox. On mobile the photos become a carousel with thumbnails above the details.