Files
asset-homepage/components/HeroSection.tsx

45 lines
1.1 KiB
TypeScript

'use client';
import HeroTitle from './HeroTitle';
import HeroButtons from './HeroButtons';
export default function HeroSection() {
return (
<section className="relative w-full" style={{ overflow: 'hidden' }}>
<video
autoPlay
loop
muted
playsInline
className="absolute inset-0 w-full h-full object-cover"
style={{
zIndex: 0,
objectFit: 'cover',
objectPosition: 'center center',
minWidth: '100%',
minHeight: '100%',
transform: 'scale(1.1)'
}}
>
<source src="/hero-background.mp4" type="video/mp4" />
</video>
<div
className="flex flex-col items-start justify-center flex-shrink-0 relative"
style={{
background: 'linear-gradient(to left, rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.55))',
padding: '114px 85px 164px 85px',
minHeight: '670px',
zIndex: 1
}}
>
<div className="flex flex-col gap-[60px] flex-shrink-0 w-[926px] relative">
<HeroTitle />
<HeroButtons />
</div>
</div>
</section>
);
}