Boxes stay sized; tall/odd-ratio images letterbox cleanly against the
existing slate card background instead of being chopped at the edges.
Applied to FeaturedBento, FeaturedBentoFromDb, ArticleFeed, NewsPageClient,
SpotlightCarousel, FeaturedCarousel, AISuggestedArticles, search/page.tsx.
Avatars (rounded-full) unchanged — still object-cover.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Was 11px mono with no background; now a navy outlined pill with uppercase
bold tracking, light-blue fill, and hover state. Same target route.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
FeaturedBentoFromDb.tsx:119 — hero excerpt size ramp halved:
text-base md:text-lg (16 / 18 px)
→ text-xs md:text-sm (12 / 14 px)
Restores a clear size gap below the (already-shrunk) hero headline; the
excerpt was visually competing with the title at the same breakpoint.
Typography (approved Phase 1 slice only — utility classes + other reclasses deferred):
- src/styles/tailwind.css body rule: re-add smoothing now that the surface palette is locked in — -webkit-font-smoothing antialiased, -moz-osx-font-smoothing grayscale, text-rendering optimizeLegibility, font-feature-settings 'kern','liga', global letter-spacing -0.005em.
- src/components/FeaturedBentoFromDb.tsx:115 cinematic hero headline: text-2xl md:text-4xl lg:text-5xl leading-tight → text-[40px] md:text-[48px] lg:text-[56px] leading-[1.05] tracking-[-0.02em] font-bold. Confident editorial display per the avinteractive reference.
- src/app/news/[slug]/NewsArticleDetailClient.tsx:309 and src/app/articles/[slug]/ArticleDetailClient.tsx:255 article H1: text-[#f0f0f0] → text-[#0F172A]. Fixes the leftover white-on-white readability bug on article pages.
UI:
- src/app/home-page/components/ArticleFeed.tsx: removed the 'Topics:' chip row from Industry News per current design direction; all stories now show without per-topic filter.
- New AvBeatLogo inline-SVG component (rounded-square emblem with
forward-leaning AV monogram + horizontal beam detail) at
src/components/AvBeatLogo.tsx, three variants (full/wordmark/icon).
- Header.tsx now uses the responsive AV BEAT logo lockup in the
top-left, links to /, full lockup on desktop (emblem+wordmark+tagline),
emblem+wordmark on tablet, emblem-only on mobile.
- Removed DualSpeedTicker (the 'RECENT FORUM POSTS' ticker strip);
the news ticker / glow chrome does not match the new aesthetic and the
forum row was the explicit removal target.
- Tailwind theme + globals.css now expose the AV BEAT 2026 palette as
semantic tokens: --brand-blue (#1D4ED8), --brand-blue-bright (#38BDF8),
--brand-navy (#0F172A), --brand-bg (#F8FAFC), --brand-surface, --brand-border,
--brand-text, --brand-text-muted. Legacy --color-* aliases re-point to the
new tokens so any inline-styled component re-themes for free.
- Site-wide hex sweep migrates 2,769 hardcoded color literals across 144
files from the old dark-broadcast palette to the new tokens (orange
-> blue, dark-brown -> white surface / navy text, cream -> navy).
- Layout body class flipped from 'bb-neon' to 'bg-brand-bg text-brand-text'
so the dark glow chrome no longer leaks through the new light theme.
Previously the rail row could drift past the bottom of the Blackmagic
banner by ~17px depending on title length. Left column is now pinned to
lg:h-[600px] (matching the right column 300x600), and the rail grid uses
flex-1 min-h-0 to absorb the remaining vertical space after the hero
takes its natural aspect-ratio height. Each card switches to a flex
column with the image flex-shrink-0 and the text area flex-1
overflow-hidden so the bottom edge lines up perfectly regardless of
title/category length.
Also tightened the title clamp from line-clamp-3 to line-clamp-2 since
the card height is now bounded.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
The 21:9 hero used to span full width and the Blackmagic 300x600 sat
next to the 3-up rail beneath it. Layout request: shrink the hero
horizontally (keep aspect ratio — height shrinks proportionally) so the
300x600 lifts up alongside the hero itself, with the 3-up rail still
under the hero in the left column. Same outer grid, just hero+rail now
live together in the left column.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- FeaturedBentoFromDb: row below the hero is now a 3-up rail on the left
with the Blackmagic 300x600 on the right, aligned with the hero's right
edge. SidebarAdStack skips that 300x600 so the article-feed sidebar
starts with the 300x250 stack instead.
- cleanExcerpt: render-time word-snap for excerpts that were hard-cut at a
byte count (Matrox 50-years showed "Since 1976, the co" mid-word). Used
on the bento hero subhead and the article-feed cards.
- SponsorLogoStrip: now also pulls every tracked_companies.featured=true
brand (Rode, TBC Consoles, Plura, Autocue, Autoscript, Filmcraft,
Lectrosonics, Prompter People, SanDisk, Sennheiser), and logos go from
h-10/h-12 max-w-140 → h-14/h-16 max-w-180 with thicker padding.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Was linking to /news?category=Featured which silently fell back to the
unfiltered /news listing because "Featured" isn't in CATEGORIES and the
filter is tag-based, not category-column-based.
Adds getLegacyFeaturedArticles() that mirrors FeaturedBento's query
(category ILIKE 'featured', featured-flag-first sort) at limit 200, and
a thin /news/featured route that reuses NewsPageClient.
Earlier this evening I bumped the Staff Editorial header to a
font-serif 2xl/3xl bold — too loud, fought with The Latest section
header below it on the same page.
Reverted to the same shape The Latest uses:
<span class="section-label">Staff Editorial</span>
<div class="flex-1 h-px bg-[#2a2a2a]" />
<Link>All featured →</Link>
That's the global .section-label utility (font-body 13px,
font-weight:700, letter-spacing:0.08em, uppercase, color
accent-blue, with a 3px accent border on the left). Now the two
section headers on the homepage are visually consistent.
1. Remove SystemStatusBar from root layout. The "29,220 articles
indexed / 13 events tracked / [v2.0.0]" strip ate vertical space
above the fold without serving readers.
2. /api/newsletter/subscribe was returning 500 "Failed to save
subscription" because:
- The route used the anon-session client and tried to UPSERT on
bb.newsletter_subscribers, but the table's RLS only has an
INSERT policy for the public role. Upsert needs INSERT+UPDATE,
so the second branch failed RLS.
- Switched to createAdminClient (service-role) — bypasses RLS,
which is fine because this is a server-side endpoint with
server-side email validation.
- Welcome email now sends via nodemailer in a non-blocking
background task so a slow SMTP doesn't hold up the response.
Newer HTML template, brand-aligned, with a real CTA back to
/news.
Side work to wire SMTP (done out-of-band):
- Created newsletter@broadcastbeat.com mailbox in Mailcow via
the API (2GB quota, active, no force-pw-update).
- Set SMTP_HOST=mail.onsethost.com, SMTP_PORT=587,
SMTP_USER/PASS/FROM_EMAIL/FROM_NAME in Coolify env so the
welcome email actually fires after the next deploy.
3. FeaturedBentoFromDb section header: "Featured · staff editorial"
(small mono caps) → "Staff Editorial" (font-serif 2xl/3xl, bold,
with a thin metadata line "Selected by our newsroom" beside it
and a 2px bottom rule). Matches the editorial typography on the
article pages.
Dates
- FeaturedBentoFromDb hero + 4-up rail no longer render `ago(wp_published_at)`.
The whole component renders only Featured-category posts (filter is
category ILIKE 'featured'), so dropping the date display globally inside
it satisfies the "Featured posts have no date" requirement.
- /gear and /technology category cards: wrap the existing `{article.date}`
output in `{article.category !== "Featured" && ...}` so only non-Featured
posts continue to show their publish date.
- All other category landing pages, /news/<slug> detail, ArticleFeed, and
LiveWireTicker either don't render a visible article date or only use it
for SEO/structured-data fields (kept).
Trends sidebar
- Remove `BB AI · detected trends` block from the homepage (between
ArticleFeed and NewsletterSignup). Drop the unused import and delete
the orphaned TrendsSidebar.tsx component file. The detect-trends data
fetch and `bb_pulse_dot` mini-widget are gone from the page; nothing
else referenced them.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
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>
Replace the bento's old hero+side-rail layout with a full-width cinematic
21:9 hero on top + 4-up vertical-card rail below. Single DB query, single
component. Standalone FeatureStoryHero component removed (was rendered
above the bento; design now lives inside the bento itself).
- FeaturedBentoFromDb.tsx: new hero (gradient overlay, Feature Story badge,
large overlaid title, "Read full story" cue) + 4-card grid below
- home-page/page.tsx: drop <FeatureStoryHero /> import + JSX block
- src/components/FeatureStoryHero.tsx: deleted (composition replaced by
inline JSX in the bento for single-query efficiency)
Accent uses var(--color-text-info, #60a5fa) — the existing blue from the
codebase, matching the rest of the post-Slice-4-revert site.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Replace the four accent-family hex codes site-wide with the teal palette
(keeps the dark theme; only swaps the accent family, not the dark base):
#3b82f6 (accent primary CTA) → #5B7C8D (teal) [839×]
#2563eb (accent-dark / hover) → #4A6473 (darker teal) [44×]
#60a5fa (info link, lighter) → #8FB0C3 (mid teal) [68×]
#1e3a5f (accent-muted bg) → #2F4F5F (navy) [44×]
tailwind.config.js tokens updated to match (accent/accent-dark/accent-muted).
Sweep also covers tailwind.css. 108 files touched. The dark base (#0d0d0d,
#111, #161616, #1a1a1a etc.) is intentionally untouched.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Replaces the 5-slide FeaturedCarouselServer that lost the Sony hero +
side-rail layout. New FeaturedBentoFromDb pulls every category=Featured
row, sorts featured=true (pinned hero) first then by published date.
- Hero (left, 2 columns): Sony BRC-AM7 + HXC-FZ90 — pinned via featured=true
- Side rail (right): next 4 Featured-category posts (BVM-HX1710, MCRs/NOCs,
Tessera SQ200, Backlight Iconik)
Old carousel kept on disk for future use. Layout matches the prior
FeaturedBento.tsx visual structure (hero + 4 small cards right).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
