header+ticker: new menu (HOME/FEATURED/THE LATEST/SHOW COVERAGE/FORUM/ABOUT) + drop reduced-motion rule that was freezing ticker animation
This commit is contained in:
@@ -140,7 +140,7 @@ export default function HomePage() {
|
||||
</div>
|
||||
|
||||
{/* Featured: cinematic hero + 4-up rail below (FeaturedBentoFromDb) */}
|
||||
<ScrollRevealSection className="section-enter section-enter-3">
|
||||
<ScrollRevealSection id="featured" className="section-enter section-enter-3 scroll-mt-32">
|
||||
<Suspense fallback={<BentoSkeleton />}>
|
||||
<FeaturedBentoFromDb />
|
||||
</Suspense>
|
||||
@@ -155,7 +155,7 @@ export default function HomePage() {
|
||||
*/}
|
||||
|
||||
{/* Article feed + sidebar */}
|
||||
<ScrollRevealSection className="section-enter section-enter-5" delay={2}>
|
||||
<ScrollRevealSection id="the-latest" className="section-enter section-enter-5 scroll-mt-32" delay={2}>
|
||||
<Suspense fallback={<FeedSkeleton />}>
|
||||
<ArticleFeed />
|
||||
</Suspense>
|
||||
|
||||
@@ -215,9 +215,6 @@ export default function DualSpeedTicker() {
|
||||
0% { transform: translateX(0); }
|
||||
100% { transform: translateX(-50%); }
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.bbt-track { animation-duration: 0s; }
|
||||
}
|
||||
@media (max-width: 640px) {
|
||||
.bbt-label { font-size: 9px; padding: 0 8px; }
|
||||
.bbt-item { font-size: 11px; padding: 0 10px; }
|
||||
|
||||
@@ -28,8 +28,11 @@ interface NavItem {
|
||||
}
|
||||
|
||||
const navLinks: NavItem[] = [
|
||||
{ label: "Newsletter", href: "/newsletter" },
|
||||
{ label: "Forum", href: "/forum" },
|
||||
{ label: "HOME", href: "/" },
|
||||
{ label: "FEATURED", href: "/#featured" },
|
||||
{ label: "THE LATEST", href: "/news" },
|
||||
{ label: "SHOW COVERAGE", href: "/show-coverage" },
|
||||
{ label: "FORUM", href: "/forum" },
|
||||
];
|
||||
|
||||
export default function Header() {
|
||||
@@ -627,7 +630,6 @@ export default function Header() {
|
||||
|
||||
{/* Menu (right) */}
|
||||
<nav className="bb-browse-menu" aria-label="Main sections">
|
||||
<EventsDropdown />
|
||||
{navLinks.map((link) => (
|
||||
<Link
|
||||
key={link.label}
|
||||
|
||||
@@ -6,6 +6,7 @@ interface ScrollRevealSectionProps {
|
||||
className?: string;
|
||||
delay?: number;
|
||||
variant?: 'default' | 'left' | 'scale';
|
||||
id?: string;
|
||||
}
|
||||
|
||||
export default function ScrollRevealSection({
|
||||
@@ -13,6 +14,7 @@ export default function ScrollRevealSection({
|
||||
className = '',
|
||||
delay = 0,
|
||||
variant = 'default',
|
||||
id,
|
||||
}: ScrollRevealSectionProps) {
|
||||
const ref = useRef<HTMLDivElement>(null);
|
||||
|
||||
@@ -41,7 +43,7 @@ export default function ScrollRevealSection({
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div ref={ref} className={`${variantClass} ${delayClass} ${className}`}>
|
||||
<div ref={ref} id={id} className={`${variantClass} ${delayClass} ${className}`}>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user