Blogpost 21 block design & features
Blogpost21 is a single article page built with shadcn/ui Avatar and Badge components. A wide photograph opens the page, and a bordered title card overlaps its lower edge with a category badge, the date and read time, the headline, a summary, and an author row with avatar and role. Below the card, the first lead paragraph is set large as a standfirst before the full prose article with headings, lists, a quote, a table, and an in-article figure.
The look is layered and magazine-like. The card sits on the photo with a soft shadow and hairline border, so the title reads on a plain surface while the image stays uncovered. Rounded corners repeat on the photo and the card, and the reading column is narrower than the image so the eye drops straight from the title into the text.
The overlapping card is a familiar editorial pattern that gives a single post more presence than a title stacked above a photo. Complexity is low. It needs one landscape feature image, a short lead paragraph, and the article body.
On phones the overlap shrinks so the card still covers only the bottom of the photo, and the standfirst and article follow in one column.