Social Media Trending 7 block design & features
SocialMediaTrending7 is a shoppable stories experience built with shadcn/ui. A floating corner video thumbnail opens a full-screen dialog carousel of product stories. Each story pairs video with product details including rating, price, quantity input, and add-to-cart. On smaller screens, product details move into a drawer while video stays primary, with a progress bar tracking playback.
Dark immersive story chrome with badges and compact product rows. Video play and mute controls sit over the media. The floating trigger keeps the entry point persistent without occupying page layout.
This is an elaborate social commerce pattern closer to short-form shopping than a static UGC grid. Mixed complexity: video assets, product stills, pricing, and ratings are all required. Distinctive for combining stories-style video with a full purchase path.
Desktop uses a split video-and-details layout; mobile stacks into video plus a bottom drawer for buying controls.