home: add horizontal divider line in Featured section header (matches The Latest)

Switches the Featured header row from justify-between to gap-3 + flex-wrap
so a 1px <div className="flex-1 h-px bg-[#2a2a2a]" /> can fill between the
label and the "All featured →" link. Same rhythm as The Latest header in
ArticleFeed.tsx:276-277.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-05-16 09:36:07 +00:00
parent 24a32b9757
commit e4e74a9059

View File

@@ -60,11 +60,12 @@ export default async function FeaturedBento() {
return (
<section className="max-w-container mx-auto px-4 my-8" aria-label="Featured stories">
<div className="flex items-center justify-between mb-3">
<h2 className="font-mono text-xs uppercase tracking-wider text-[#6b7280]">
<div className="flex items-center gap-3 mb-3 flex-wrap">
<h2 className="font-mono text-xs uppercase tracking-wider text-[#6b7280] whitespace-nowrap">
Featured · staff editorial
</h2>
<Link href="/news?category=Featured" className="text-[11px] font-mono text-[var(--color-text-info,#60a5fa)] hover:underline">
<div className="flex-1 h-px bg-[#2a2a2a]" />
<Link href="/news?category=Featured" className="text-[11px] font-mono text-[var(--color-text-info,#60a5fa)] hover:underline whitespace-nowrap">
All featured
</Link>
</div>