Feature 215 B - Stacked rows with side-by-side video and copy

Pro

Centered intro leads into full-width rows where each pairs a video thumbnail with icon, title, summary, and a small outline action.

Shadcn Feature 215 B block

Component Data

  • ID:feature215b
  • Access:pro
  • Created:Jul 1, 2025
  • Type:block

Feature 215 B block design & features

Feature215b opens with the same centered title block as its grid sibling, then switches to a vertical stack of horizontal rows stitched together with Shadcn UI sizing for video thumbnails and small outline actions. Each row carries a wide video frame on one side and a text stack on the other: icon-in-square, headline, paragraph, and a compact outline link for more detail, with hover starting the muted clip and ending it when the pointer leaves.

Hairline dividers separate rows on the narrow stack and the layout relaxes into side-by-side media and copy once space allows. Icon squares pick up solid primary fill while body copy stays in muted gray for contrast against black titles.

The pattern is a catalog walkthrough rather than a dense grid, so it suits long copy per item and feels more editorial. Complexity comes from clip length and writing quality more than from layout code.

On small screens the video block stacks above the text so gestures still reach the play-on-hover target without cramping the button row.