Simplify hero backgrounds and add entrance animations
- Replace animated blob/wave/noise backdrop with clean static gradient (radial ellipse highlights + linear fade) in hero-motion-backdrop - Remove all framer-motion from background layer; delete unused CSS classes: hero-blob, hero-sheet-glow, hero-sheet-wave, hero-sheet-noise, hero-title-shift keyframe, and responsive blob media queries - Add framer-motion stagger entrance to HeroContentMotion, HeroMotionItem, and HeroTitle (slide-up + fade on mount) - Refactor coming-soon page to use HeroContentMotion/HeroMotionItem instead of MotionFade (whileInView unreliable above the fold) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -3,7 +3,7 @@ import { HeroContentMotion, HeroMotionItem, HeroShell, HeroTitle, type HeroTitle
|
||||
|
||||
type PageHeroProps = {
|
||||
badge?: string;
|
||||
title: string;
|
||||
title?: string;
|
||||
description?: string;
|
||||
lines?: HeroTitleLineValue[];
|
||||
locale?: string;
|
||||
@@ -33,13 +33,19 @@ function getDefaultLines(title: string): HeroTitleLineValue[] {
|
||||
}
|
||||
|
||||
export function PageHero({ badge, title, description, lines, locale }: PageHeroProps) {
|
||||
const resolvedLines = lines ?? (title ? getDefaultLines(title) : undefined);
|
||||
|
||||
return (
|
||||
<HeroShell compactBackdrop variant="page">
|
||||
<HeroContentMotion variant="page">
|
||||
<HeroMotionItem variant="page">
|
||||
<HeroBadge>{badge ?? title}</HeroBadge>
|
||||
</HeroMotionItem>
|
||||
<HeroTitle lines={lines ?? getDefaultLines(title)} locale={locale} variant="page" />
|
||||
{(badge ?? title) ? (
|
||||
<HeroMotionItem variant="page">
|
||||
<HeroBadge>{badge ?? title}</HeroBadge>
|
||||
</HeroMotionItem>
|
||||
) : null}
|
||||
{resolvedLines ? (
|
||||
<HeroTitle lines={resolvedLines} locale={locale} variant="page" />
|
||||
) : null}
|
||||
{description ? (
|
||||
<HeroMotionItem variant="page">
|
||||
<p className="mx-auto mt-6 max-w-[34rem] text-base leading-7 text-foreground/72">
|
||||
|
||||
Reference in New Issue
Block a user