44 lines
1.8 KiB
JavaScript
44 lines
1.8 KiB
JavaScript
import { Button } from '@/components/Button';
|
|
import { Container } from '@/components/Container';
|
|
import { Gradient } from '@/components/Gradient';
|
|
import { ChevronRightIcon } from '@heroicons/react/20/solid'
|
|
|
|
export function Homepage() {
|
|
return (
|
|
<div className="lg:pt-24 pt-24 pb-12 min-h-screen flex items-center justify-center relative">
|
|
<Container>
|
|
{/* Background Video */}
|
|
<video
|
|
autoPlay
|
|
loop
|
|
muted
|
|
playsInline
|
|
className="absolute inset-0 w-full h-full object-cover -z-10"
|
|
>
|
|
<source src="/videos/hero2.mp4" type="video/mp4" />
|
|
Your browser does not support the video tag.
|
|
</video>
|
|
|
|
<div className="mx-auto max-w-xl lg:max-w-6xl text-center">
|
|
<h1 className="font-display lg:max-w-3xl font-bold text-white tracking-tighter lg:text-7xl text-5xl">
|
|
The Future of <span className='text-gradient-light'>Collaboration is Now.</span>
|
|
</h1>
|
|
<div className="lg:max-w-3xl max-w-2xl my-6 space-y-6 font-display font-medium lg:text-2xl text-xl tracking-tight leading-normal text-purple-800">
|
|
</div>
|
|
<div className="mt-10 pb-8 flex items-center justify-center gap-x-6">
|
|
<a
|
|
href="#"
|
|
className="rounded-2xl btn-gradient-dark px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-purple-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-purple-500"
|
|
>
|
|
Join OurVerse
|
|
</a>
|
|
<a href="#" className="text-sm font-semibold leading-6 text-white hover:text-purple-200">
|
|
Learn more <span aria-hidden="true">→</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</Container>
|
|
</div>
|
|
);
|
|
}
|