Blog 11 block design & features
Blog11 pairs a sticky introductory column with a dense grid of story tiles, composed with shadcn/ui Separator dividers and lucide iconography for quick scanning. The header stacks an oversized outline icon, bold “Blog Posts” title, explanatory sentence, horizontal rule, and simple text links for categories before handing off to the grid.
From a motion standpoint each tile begins as darkened photography clipped off-screen and unveils upward on hover while titles and dates lighten for contrast, producing a magazine-like reveal without leaving the grid structure.
Mood reads calm editorial on a soft muted backdrop; uniqueness lands in the sticky sidebar plus animated clipping rather than dense metadata rows.
On smaller breakpoints the sticky behavior releases and links wrap horizontally, while the grid reduces to one column before expanding to two.