Switch to version 2: modified src/components/sections/hero/HeroOverlay.tsx

This commit is contained in:
2026-05-08 10:51:17 +00:00
parent 97e2d1f8e8
commit 87f94db9ac

View File

@@ -1,7 +1,6 @@
import Button from "@/components/ui/Button";
import HeroBackgroundSlot from "@/components/ui/HeroBackgroundSlot";
import TextAnimation from "@/components/ui/TextAnimation";
import TestimonialCard from "@/components/custom/TestimonialCard";
import ImageOrVideo from "@/components/ui/ImageOrVideo";
import AvatarGroup from "@/components/ui/AvatarGroup";
@@ -43,51 +42,36 @@ const HeroOverlay = ({
aria-hidden="true"
/>
<div className="relative z-10 w-content-width mx-auto pb-20 md:pb-20">
<div className="flex flex-col md:flex-row justify-between items-end gap-3 w-full">
<div className="flex flex-col gap-3 w-full md:w-6/10 lg:w-1/2 xl:w-45/100 2xl:w-4/10">
<span className="w-fit px-3 py-1 mb-1 text-sm card rounded">{tag}</span>
<div className="relative z-10 w-content-width mx-auto pb-10 md:pb-25">
<div className="flex flex-col gap-3 w-full md:w-6/10 lg:w-1/2 xl:w-45/100 2xl:w-4/10">
<span className="w-fit px-3 py-1 mb-1 text-sm card rounded">{tag}</span>
<TextAnimation
text={title}
variant="fade"
gradientText={true}
tag="h1"
className="text-7xl 2xl:text-8xl font-medium text-primary-cta-text text-balance"
/>
<TextAnimation
text={title}
variant="fade"
gradientText={true}
tag="h1"
className="text-7xl 2xl:text-8xl font-medium text-primary-cta-text text-balance"
/>
<TextAnimation
text={description}
variant="fade"
gradientText={false}
tag="p"
className="text-lg md:text-xl text-primary-cta-text leading-tight text-balance"
/>
<TextAnimation
text={description}
variant="fade"
gradientText={false}
tag="p"
className="text-lg md:text-xl text-primary-cta-text leading-tight text-balance"
/>
<div className="flex flex-wrap gap-3 mt-3">
<Button text={primaryButton.text} href={primaryButton.href} variant="primary" />
<Button
text={secondaryButton.text}
href={secondaryButton.href}
variant="secondary"
animationDelay={0.1}
/>
<div className="flex flex-wrap gap-3 mt-3">
<Button text={primaryButton.text} href={primaryButton.href} variant="primary"/>
<Button text={secondaryButton.text} href={secondaryButton.href} variant="secondary"animationDelay={0.1} />
</div>
{avatars && avatars.length > 0 && (
<div className="mt-4">
<AvatarGroup avatars={avatars} size="lg" label={avatarsLabel} labelClassName="text-primary-cta-text" />
</div>
{avatars && avatars.length > 0 && (
<div className="mt-4">
<AvatarGroup
avatars={avatars}
size="lg"
label={avatarsLabel}
labelClassName="text-primary-cta-text"
/>
</div>
)}
</div>
<div className="w-full md:w-auto">
<TestimonialCard />
</div>
)}
</div>
</div>
</section>