Blog 97 block design & features
Blog97 is a tabbed reading list built with shadcn/ui Tabs. A heading and description introduce three underline tabs: Latest, Popular, and Editor's picks. Each tab holds a ruled list of up to five posts with a linked title and a category line, and a browse-all text link with an arrow closes the section.
The three tabs share one row layout but change what leads each row. Latest rows open with a small square thumbnail and end with the publish date. Popular rows replace the thumbnail with a faint two-digit rank and show read counts in place of the date. Editor's picks keep the thumbnail and add a single sentence under the title explaining why the post was chosen. The tab indicator is a thin foreground underline, and rows stay static on hover apart from the title underline.
The result is understated and editorial, a compact way to give one homepage band three different reasons to click. Complexity is low to moderate and content-driven: each tab takes its own list, so the block needs real ranking data and short editor notes to feel genuine.
On wider screens the category and date line moves to the right of each title, while on phones it stacks underneath.