59 lines
2.4 KiB
TypeScript
59 lines
2.4 KiB
TypeScript
import BetaTester from "@/components/BetaTester";
|
||
import Link from 'next/link';
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<div className="bg-white font-sans">
|
||
{/* SVG Grid Background */}
|
||
<div className="relative isolate pt-1">
|
||
<svg
|
||
aria-hidden="true"
|
||
className="absolute inset-0 -z-10 w-full h-full stroke-gray-200 [mask-image:radial-gradient(100%_100%_at_top_right,white,transparent)]"
|
||
>
|
||
<defs>
|
||
<pattern
|
||
id="grid"
|
||
width={200}
|
||
height={200}
|
||
patternUnits="userSpaceOnUse"
|
||
>
|
||
<path d="M100 200V.5M.5 .5H200" fill="none" />
|
||
</pattern>
|
||
</defs>
|
||
<rect fill="url(#grid)" width="100%" height="100%" strokeWidth={0} />
|
||
</svg>
|
||
<div className="mx-auto max-w-7xl px-6 py-24 sm:py-32 lg:flex lg:items-start lg:gap-x-10 lg:px-8 lg:py-40">
|
||
{/* Left: Headline, Subheading, Button */}
|
||
<div className="mx-auto max-w-2xl lg:mx-0 lg:flex-auto">
|
||
<h1 className="mt-10 text-pretty text-5xl font-semibold tracking-tight text-gray-900 sm:text-7xl">
|
||
A better way to plan your next build
|
||
</h1>
|
||
<p className="mt-8 text-pretty text-lg font-medium text-gray-500 sm:text-xl/8">
|
||
Welcome to Pew Builder – the modern way to discover, compare, and assemble firearm parts. Start your build, explore top brands, and find the perfect components for your next project.
|
||
</p>
|
||
<div className="mt-10 flex items-top gap-x-6">
|
||
<Link
|
||
href="/build"
|
||
className="bg-gray-900 hover:bg-gray-950 text-white text-base font-semibold px-6 py-3 transition-colors"
|
||
>
|
||
Get Building
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
{/* Right: Product Image */}
|
||
<div className="mt-16 sm:mt-24 lg:mt-0 lg:shrink-0 lg:grow items-top flex justify-center group">
|
||
<img
|
||
alt="AR-15 Lower Receiver"
|
||
src="https://i.imgur.com/IK8FbaI.png"
|
||
className="max-w-md w-full h-auto object-contain rounded-xl transition-transform duration-500 ease-in-out animate-float group-hover:-translate-y-2"
|
||
style={{ willChange: 'transform' }}
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{/* Beta Tester CTA */}
|
||
|
||
<BetaTester />
|
||
</div>
|
||
);
|
||
}
|