bender/2f4a8395-4a4f-4603-ac5f-6cb0700119b7
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
bender
2026-05-08 10:51:55 +00:00
parent c6cb9f7479
commit 606aeb39f5
1 changed files with 42 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
src/components/sections/hero/HeroOverlay.tsx
View File

@@ -1,6 +1,7 @@
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";
@@ -42,36 +43,51 @@ const HeroOverlay = ({
aria-hidden="true"
/>
<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>
<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>
<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>
{avatars && avatars.length > 0 && (
<div className="mt-4">
<AvatarGroup avatars={avatars} size="lg" label={avatarsLabel} labelClassName="text-primary-cta-text" />
<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>
)}
</div>
<div className="w-full md:w-auto">
<TestimonialCard />
</div>
</div>
</div>
</section>