xnl-admin/app/routes/_index.tsx

59 lines
1.8 KiB
TypeScript

import { Footer } from '~/components/footer';
import Header from '~/components/header';
import { PageContainer } from '~/components/page';
export const meta = () => {
return [
{
title: 'XNL - Home'
}
];
};
export default function Index() {
return (
<>
<div className="absolute top-0 -z-40 backdrop-blur-sm w-full min-h-screen isolate bg-black" />
<div className="absolute -z-30 min-h-full min-w-full overflow-hidden">
<video
className="min-w-full min-h-full w-auto h-auto absolute top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]"
onLoad={() => {}}
autoPlay
muted
>
<source src="/bg.webm#t=4" type="video/webm" />
</video>
</div>
<div
style={{
background: '#ff660005'
}}
className="absolute top-0 -z-20 backdrop-blur-sm w-full min-h-screen isolate"
/>
<div
style={{
background: 'url("/grain.svg")',
opacity: 0.1
}}
className="absolute top-0 -z-10 backdrop-blur-sm w-full min-h-screen isolate"
/>
<Header />
<PageContainer>
<div
id="middle"
className="flex justify-center items-center w-full min-h-[75vh]"
>
<h1 className="text-7xl text-center">
Pushing the boundaries of what is achievable.
</h1>
</div>
</PageContainer>
<Footer />
</>
);
}