Blogpost 16 block design & features
Blogpost16 is a discussion thread for the bottom of an article, built with shadcn/ui Avatar, Badge, Button, Tabs, and Textarea components. A centered column holds a heading with the comment count, a pair of Top and Newest sort tabs, and a bordered composer showing the reader's name and avatar. Each comment has a vote column on the left with up and down arrows around the score, followed by a small avatar, the name, an author badge for the writer's own replies, the time, the comment, and reply and hide replies buttons.
Styling is compact and forum-like. The vote column gives the thread a strong left edge, replies nest inside their parent without extra rules, and the composer is one outlined box that lights up with a focus ring when you type. Voting colors the arrow and moves the score, the Top tab reorders comments by score as votes change, and posting a comment switches to Newest so it appears first.
The voting and sorting make it feel closer to a developer community thread than a blog comment box. Complexity is moderate. All state is local for demonstration, and real use needs a comments service that stores votes.
Replies can be collapsed per comment, which keeps long threads short on phones.
