Deploy-1 fix + P0-6/7/8: Suspense wrap, carousel arrows, banner reposition, search-box removal

Deploy-1 build failed because NewsPageClient now calls useSearchParams.
- src/app/news/page.tsx: wrap NewsPageClient in <Suspense> so static
  generation can bail out to client rendering cleanly.

P0-6 (Featured carousel arrows):
- FeaturedBento: brighten arrow buttons (text-[#ccc] over bg-[#1a1a1a]
  with #3a3a3a border; previously near-invisible #666 over the same
  background), enlarge to w-8 h-8, hover fills to blue. Wrap the
  arrow group with role/aria + Left/Right keyboard nav.

P0-7 (728x90 reposition):
- Header: move the leaderboard block from above the main nav to AFTER
  the sticky nav, so it sits between the nav and The Beat ticker.

P0-8 (remove Latest search box):
- ArticleFeed: drop the in-section search input + clear button. The
  top-right header search is now the sole search UI. searchQuery state
  remains since the active-filter chip code still references it.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Claude Code
2026-05-14 16:39:24 +00:00
parent 70e2aebb83
commit 8be2ccbff2
4 changed files with 34 additions and 47 deletions

View File

@@ -506,39 +506,9 @@ export default function ArticleFeed() {
<span className="font-body text-xs text-[#555]">{sortedFiltered.length?.toLocaleString()} article{sortedFiltered.length !== 1 ? "s" : ""}</span>
</div>
{/* Search + Filters */}
{/* Filters only — site-wide search lives in the top-right header */}
<div className="mb-4 space-y-3">
{/* Search bar row with Advanced Filters toggle */}
<div className="flex items-center gap-2">
<div className="relative flex-1">
<label htmlFor={`${feedId}-search`} className="sr-only">Search articles</label>
<SearchIcon
size={14}
strokeWidth={1.75}
className="absolute left-3 top-1/2 -translate-y-1/2 text-[#555] pointer-events-none"
aria-hidden="true"
/>
<input
id={`${feedId}-search`}
ref={searchRef}
type="search"
value={searchQuery}
onChange={(e) => { setSearchQuery(e.target.value); setPage(1); }}
placeholder="Search articles by title, topic, or author..."
aria-label="Search articles"
aria-controls={`${feedId}-results`}
className="search-input search-input-enhanced w-full pl-9 pr-9 py-2 text-sm"
/>
{searchQuery && (
<button
type="button"
onClick={clearSearch}
aria-label="Clear search"
className="search-clear-btn right-2.5">
<CloseIcon size={11} />
</button>
)}
</div>
{/* Advanced filters toggle button */}
<button
type="button"