220 lines
6.8 KiB
TypeScript
220 lines
6.8 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
|
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
|
import { Award, Shield, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="icon-arrow"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="small"
|
|
sizing="mediumLargeSizeLargeTitles"
|
|
background="grid"
|
|
cardStyle="subtle-shadow"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
navItems={[
|
|
{
|
|
name: "Home",
|
|
id: "hero",
|
|
},
|
|
{
|
|
name: "Products",
|
|
id: "products",
|
|
},
|
|
{
|
|
name: "About",
|
|
id: "about",
|
|
},
|
|
{
|
|
name: "Support",
|
|
id: "faq",
|
|
},
|
|
]}
|
|
brandName="NordexTech"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroOverlay
|
|
title="Future-Proof Your Tech."
|
|
description="NordexTech delivers cutting-edge performance gear for those who refuse to compromise. Experience innovation in every click."
|
|
buttons={[
|
|
{
|
|
text: "Shop Now",
|
|
href: "#products",
|
|
},
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BdZlGnSk0sccryFSySdt6tgV9E/futuristic-sleek-tech-website-hero-backg-1774821274687-9fdc56b6.png"
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "p1",
|
|
name: "Precision Core",
|
|
price: "$129.99",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BdZlGnSk0sccryFSySdt6tgV9E/uploaded-1774821248615-67mxw7u8.png",
|
|
},
|
|
{
|
|
id: "p2",
|
|
name: "Infinite Data Array",
|
|
price: "$89.99",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BdZlGnSk0sccryFSySdt6tgV9E/uploaded-1774821248616-xvdqlf1q.png",
|
|
},
|
|
{
|
|
id: "p3",
|
|
name: "Quantum Linker",
|
|
price: "$159.00",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BdZlGnSk0sccryFSySdt6tgV9E/uploaded-1774821248616-9t2j7nr4.png",
|
|
},
|
|
]}
|
|
title="Hero Product Line"
|
|
description="Discover our most advanced tech solutions."
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<AboutMetric
|
|
useInvertedBackground={true}
|
|
title="Our Engineering Standards"
|
|
metrics={[
|
|
{
|
|
icon: Zap,
|
|
label: "Performance Boost",
|
|
value: "200%",
|
|
},
|
|
{
|
|
icon: Shield,
|
|
label: "Reliability Rate",
|
|
value: "99.9%",
|
|
},
|
|
{
|
|
icon: Award,
|
|
label: "Satisfied Geeks",
|
|
value: "100k+",
|
|
},
|
|
]}
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Alex Riv",
|
|
role: "CTO",
|
|
company: "DevSquad",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BdZlGnSk0sccryFSySdt6tgV9E/professional-headshot-of-a-happy-custome-1774821274580-f467dd12.png",
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Sam Low",
|
|
role: "Engineer",
|
|
company: "TechLab",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BdZlGnSk0sccryFSySdt6tgV9E/professional-headshot-of-a-software-deve-1774821274483-4d865728.png",
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Jordan P.",
|
|
role: "Architect",
|
|
company: "BuildFlow",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BdZlGnSk0sccryFSySdt6tgV9E/portrait-of-an-innovative-tech-lead-stud-1774821274563-abb6ca94.png",
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "Casey W.",
|
|
role: "Developer",
|
|
company: "CodeFlow",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BdZlGnSk0sccryFSySdt6tgV9E/professional-headshot-of-a-young-tech-en-1774821274825-104ce45b.png?_wi=1",
|
|
},
|
|
{
|
|
id: "5",
|
|
name: "Morgan D.",
|
|
role: "Lead Designer",
|
|
company: "PixelCorp",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BdZlGnSk0sccryFSySdt6tgV9E/professional-headshot-of-a-young-tech-en-1774821274825-104ce45b.png?_wi=2",
|
|
},
|
|
]}
|
|
title="Trusted by Tech Leaders"
|
|
description="See why professionals choose NordexTech for their critical gear."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{
|
|
id: "f1",
|
|
title: "How fast is delivery?",
|
|
content: "Orders are typically shipped within 24 hours of confirmation.",
|
|
},
|
|
{
|
|
id: "f2",
|
|
title: "What is the warranty?",
|
|
content: "We offer a full 12-month warranty on all hardware products.",
|
|
},
|
|
{
|
|
id: "f3",
|
|
title: "Do you support bulk orders?",
|
|
content: "Yes, contact our sales department for bulk pricing details.",
|
|
},
|
|
]}
|
|
sideTitle="Still Need Help?"
|
|
sideDescription="Reach out to our support team for any technical inquiries."
|
|
faqsAnimation="slide-up"
|
|
title="Common Questions"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoReveal
|
|
logoText="NordexTech"
|
|
leftLink={{
|
|
text: "Privacy Policy",
|
|
href: "#",
|
|
}}
|
|
rightLink={{
|
|
text: "Contact Support",
|
|
href: "#faq",
|
|
}}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|