Feature 167 block design & features
Feature167 frames AI productivity messaging using shadcn/ui Badge and Tabs inside a section book-ended by full-width horizontal rules with bordered container stripes. The upper band stacks a small outline badge with icon, a very large H2 about smart productivity, and a short muted paragraph before the interactive region begins.
In the tab region, the list column keeps left-aligned triggers with Lucide icons, dense titles, and smaller explanatory text, each with a thin animated gradient bar that grows when active. The companion column fixes image height and layers absolutely positioned tab panels that fade and block pointer events when inactive, so photography fills the viewport without jumping layout.
This is a polished, editorial tab pattern with stronger motion cues than a basic underline tab. It is moderately elaborate due to the layered imagery, gradient indicator, and multi-line triggers, while still relying on three static data entries.
On large screens the list and image sit side by side with vertical dividers; on small screens the stack compresses with dividers rotated to horizontal spacing cues.