98 lines
3.3 KiB
TypeScript
98 lines
3.3 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-magnetic"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="mediumLarge"
|
|
sizing="large"
|
|
background="none"
|
|
cardStyle="outline"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="medium"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{ name: "Home", id: "/" },
|
|
{ name: "Vehicles", id: "/vehicles" },
|
|
{ name: "Valkyrion", id: "/valkyrion" },
|
|
{ name: "EON GT", id: "/eon-gt" },
|
|
{ name: "Configurator", id: "/configurator" },
|
|
{ name: "About", id: "/about" },
|
|
]}
|
|
brandName="VALOR PERFORMANCE"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboard
|
|
logoText="ENGINEERED WITHOUT COMPROMISE"
|
|
description="Built for those who demand control"
|
|
buttons={[]}
|
|
mediaAnimation="none"
|
|
background={{ variant: "plain" }}
|
|
/>
|
|
</div>
|
|
|
|
<div id="oath" data-section="oath">
|
|
<TextAbout
|
|
title="THE OATH"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="vehicles" data-section="vehicles">
|
|
<ProductCardThree
|
|
title="VEHICLES"
|
|
description="Performance defined."
|
|
animationType="none"
|
|
gridVariant="three-columns-all-equal-width"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{ id: "v1", name: "Valkyrion", price: "", imageSrc: "https://images.unsplash.com/photo-1542362567-b07e542567dc" },
|
|
{ id: "v2", name: "EON GT", price: "", imageSrc: "https://images.unsplash.com/photo-1580273916550-e323be2ae537" },
|
|
{ id: "v3", name: "Custom Builds", price: "", imageSrc: "https://images.unsplash.com/photo-1592198084033-aade902d1aae" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="build" data-section="build">
|
|
<TextAbout
|
|
title="BUILD YOUR PERFORMANCE"
|
|
buttons={[{ text: "Begin Build", href: "/configurator" }]}
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
title="ABOUT VALOR"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
columns={[]}
|
|
logoText="VALOR PERFORMANCE"
|
|
copyrightText="© 2025 Valor Performance"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |