bender/cd7b7d58-a585-42e5-acb1-390b9bf63cec
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Reposition hero USP cards around the central image

Browse Source
This commit is contained in:
kudinDmitriyUp
2026-05-07 15:00:10 +00:00
parent ebdbfe95c9
commit 4fae7e7d26
1 changed files with 7 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/sections/hero/HeroBillboard.tsx
View File

@@ -80,11 +80,16 @@ const HeroBillboard = ({
<ScrollReveal variant="fade-blur" delay={0.2} className="relative w-full p-3 xl:p-4 2xl:p-5 card rounded overflow-hidden">
<ImageOrVideo imageSrc={imageSrc} videoSrc={videoSrc} className="aspect-4/5 md:aspect-video" />
<div className="absolute inset-0 grid grid-cols-1 md:grid-cols-3 gap-4 p-4 md:p-6">
<div className="absolute inset-0 flex justify-center items-center">
{usps.map((usp, index) => (
<div
key={index}
className="bg-white/10 backdrop-blur-lg rounded-lg p-4 flex flex-col items-center justify-center text-center text-white border border-white/20"
className={`absolute bg-white/10 backdrop-blur-lg rounded-lg p-4 flex flex-col items-center justify-center text-center text-white border border-white/20
${index === 0 ? 'bottom-4 left-4' : ''}
${index === 1 ? 'top-4' : ''}
${index === 2 ? 'bottom-4 right-4' : ''}
`}
style={{ width: '200px', height: '150px' }}
>
<usp.icon className="w-8 h-8 mb-2" />
<h3 className="font-semibold text-lg">{usp.title}</h3>