bender/cca1001a-245d-4df8-9bf6-a2da2f360bb9
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added 3D and hover animation to hero buttons

Browse Source
This commit is contained in:
kudinDmitriyUp
2026-05-20 21:16:05 +00:00
parent d42bcf5e0c
commit 22a6beff28
1 changed files with 23 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/sections/hero/HeroCenteredLogos.tsx
View File

@@ -68,8 +68,29 @@ const HeroCenteredLogos = ({
/>
<div className="flex flex-wrap justify-center gap-3 mt-2">
<Button text={primaryButton.text} href={primaryButton.href} variant="primary" />
<Button text={secondaryButton.text} href={secondaryButton.href} variant="secondary" animationDelay={0.1} />
<Button
text={primaryButton.text}
href={primaryButton.href}
variant="primary"
className="relative overflow-hidden shadow-lg shadow-primary/50 hover:shadow-xl hover:shadow-primary transition-all duration-300 ease-in-out z-10 group"
>
<span className="relative z-10 text-white group-hover:text-white">
{primaryButton.text}
</span>
<span className="absolute inset-0 bg-gradient-to-br from-primary/80 to-primary/20 transition-transform duration-500 ease-out group-hover:scale-110 group-active:scale-90" />
</Button>
<Button
text={secondaryButton.text}
href={secondaryButton.href}
variant="secondary"
animationDelay={0.1}
className="relative overflow-hidden shadow-lg shadow-background/50 hover:shadow-xl hover:shadow-background transition-all duration-300 ease-in-out z-10 group"
>
<span className="relative z-10 text-foreground group-hover:text-foreground">
{secondaryButton.text}
</span>
<span className="absolute inset-0 bg-gradient-to-br from-background/80 to-background/20 transition-transform duration-500 ease-out group-hover:scale-110 group-active:scale-90" />
</Button>
</div>
</div>
</div>