Offer Modal 16 block design & features
A shadcn/ui offer modal that runs a short quiz before revealing a discount. The first question shows four photo tiles for Clothing, Shoes, Jewellery and Home, the second lists three email frequencies, and a small question counter with a back button sits above both. The result screen shows a wide photo for the chosen category, a headline such as Here's 15% off shoes, a dashed code box with a Copy button, a Shop button and a Retake quiz button.
Picking an answer moves straight to the next step with a short fade, and the result copy combines both answers. Copying the code swaps the button to a check and Copied for a moment, and retaking the quiz returns to the first question with the answers cleared. The design is light and compact, with bordered tiles, a divided option list and no decorative chrome.
The block turns a discount popup into a small guided flow and works as a lead in to category pages. It needs one photo per category, and the questions, categories, codes, frequencies and discount label are props. The narrow layout fits phone screens, with the photo tiles staying in two columns.