Product Detail 43 block design & features
A product page laid out as a build flow. Two large photos fill the left column. The sticky right column holds the product name and a short description, round finish swatches, storage and memory tiles that say who each option suits and what it adds, and a build summary with the price, any upgrades, a total, an add to cart button and a pickup and next-day delivery note. It uses shadcn/ui buttons with native radio inputs.
Choosing an upgrade slides a new line into the summary, and switching back slides it out while the total and button reflow. The total rolls to its new value with a number ticker. Changing the finish swaps both photos with a soft horizontal parallax, the second trailing the first, and rolls the color name in the summary. Option labels, notes, upgrade prices and images are plain data, so adding a new upgrade is one entry.
On mobile the photos stack above the options and the second photo is hidden. Reduced motion swaps the slides for fades.