305 lines
9.5 KiB
TypeScript
305 lines
9.5 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
import { Mail, Sparkles } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="soft"
|
|
contentWidth="smallMedium"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="grid"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="light"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
navItems={[
|
|
{
|
|
name: "Features",
|
|
id: "features",
|
|
},
|
|
{
|
|
name: "Testimonials",
|
|
id: "testimonials",
|
|
},
|
|
{
|
|
name: "FAQ",
|
|
id: "faq",
|
|
},
|
|
{
|
|
name: "Contact",
|
|
id: "contact",
|
|
},
|
|
]}
|
|
brandName="Startup"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardRotatedCarousel
|
|
background={{
|
|
variant: "rotated-rays-animated",
|
|
}}
|
|
title="Innovation Refined."
|
|
description="Experience the next evolution of productivity and design, built from the ground up for the modern creator."
|
|
tag="Introducing Next Gen"
|
|
carouselItems={[
|
|
{
|
|
id: "1",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-perfect-well-lighted-white-corridor_181624-23381.jpg?_wi=1",
|
|
imageAlt: "Product Display 1",
|
|
},
|
|
{
|
|
id: "2",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/defocused-abstract-background-pastel-color-tone_58702-1441.jpg",
|
|
imageAlt: "Product Display 2",
|
|
},
|
|
{
|
|
id: "3",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169854.jpg",
|
|
imageAlt: "Product Display 3",
|
|
},
|
|
{
|
|
id: "4",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-blue-technology-background_23-2148882620.jpg",
|
|
imageAlt: "Product Display 4",
|
|
},
|
|
{
|
|
id: "5",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/candy-eggs-with-blurred-effect_23-2147657996.jpg",
|
|
imageAlt: "Product Display 5",
|
|
},
|
|
{
|
|
id: "6",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-african-american-woman-using-tablet_273609-15526.jpg",
|
|
imageAlt: "Product Display 6",
|
|
},
|
|
]}
|
|
tagIcon={Sparkles}
|
|
buttons={[
|
|
{
|
|
text: "Get Started",
|
|
href: "#contact",
|
|
},
|
|
{
|
|
text: "Learn More",
|
|
href: "#features",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentySeven
|
|
textboxLayout="split"
|
|
gridVariant="bento-grid"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
id: "1",
|
|
title: "Seamless Sync",
|
|
description: "Keep all your devices in perfect harmony with our native cloud integration.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/protection-concept-with-umbrella_23-2149277083.jpg",
|
|
},
|
|
{
|
|
id: "2",
|
|
title: "Precision Tooling",
|
|
description: "Crafted for high performance workflows that demand total control.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/gear-icon-set-isolated-background_53876-71277.jpg",
|
|
},
|
|
{
|
|
id: "3",
|
|
title: "Global Access",
|
|
description: "Access your workspace from anywhere on the planet with sub-millisecond latency.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/renewable-energy-environment-psd-solar-panel-remixed-media_53876-127110.jpg",
|
|
},
|
|
]}
|
|
title="Built for Excellence."
|
|
description="Every component has been meticulously designed to maximize your efficiency and aesthetic experience."
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
names={[
|
|
"TechCorp",
|
|
"InnovateLab",
|
|
"GrowthCo",
|
|
"StartupXYZ",
|
|
"DigitalReach",
|
|
"ModernView",
|
|
"ApexSystems",
|
|
]}
|
|
logos={[
|
|
"http://img.b2bpic.net/free-photo/3d-tiktok-logo_23-2152000226.jpg",
|
|
"http://img.b2bpic.net/free-photo/top-view-world-tourism-day-safety-measures-logos_23-2148608832.jpg",
|
|
"http://img.b2bpic.net/free-vector/blue-holographic-gradient-background-design-set_53876-66938.jpg",
|
|
"http://img.b2bpic.net/free-photo/inspired-youth_53876-176745.jpg",
|
|
"http://img.b2bpic.net/free-photo/burning-phoenix-head-dark-background-generative-ai_8829-2884.jpg",
|
|
"http://img.b2bpic.net/free-vector/modern-minimal-logo-concept-design_1017-33244.jpg",
|
|
"http://img.b2bpic.net/free-photo/eco-friendly-recycling-concept_23-2148737655.jpg",
|
|
]}
|
|
title="Trusted by Visionaries"
|
|
description="Empowering teams across the globe to build the impossible."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Sarah Johnson",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg",
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Michael Chen",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/closeup-serious-businessman-white-shirt-looking-camera-standing-confident_1258-112100.jpg",
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Emily Rodriguez",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-man-posing-black-white-medium-shot_23-2149411423.jpg",
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "David Kim",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-wearing-minimalist-shirt_23-2149317772.jpg",
|
|
},
|
|
{
|
|
id: "5",
|
|
name: "Alex Rivera",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/unshaven-executive-black-white_1098-1182.jpg",
|
|
},
|
|
]}
|
|
cardTitle="Client Voices"
|
|
cardTag="Testimonials"
|
|
cardAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "1",
|
|
title: "How do I get started?",
|
|
content: "Simply sign up through our portal and follow the initial setup guide.",
|
|
},
|
|
{
|
|
id: "2",
|
|
title: "Is there support available?",
|
|
content: "Our team is available 24/7 to assist with any questions you might have.",
|
|
},
|
|
{
|
|
id: "3",
|
|
title: "Can I export data?",
|
|
content: "Yes, we support comprehensive export formats for all your project data.",
|
|
},
|
|
]}
|
|
sideTitle="Questions?"
|
|
sideDescription="We have answers for you."
|
|
faqsAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactFaq
|
|
animationType="slide-up"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "c1",
|
|
title: "What's the pricing model?",
|
|
content: "We offer tiered pricing tailored to your scale.",
|
|
},
|
|
{
|
|
id: "c2",
|
|
title: "Do you offer demos?",
|
|
content: "Yes, book a demo at your convenience.",
|
|
},
|
|
]}
|
|
ctaTitle="Let's build together."
|
|
ctaDescription="Get in touch for a personal demo or any inquiries."
|
|
ctaButton={{
|
|
text: "Contact Us",
|
|
href: "mailto:hello@startup.com",
|
|
}}
|
|
ctaIcon={Mail}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="http://img.b2bpic.net/free-photo/vertical-shot-perfect-well-lighted-white-corridor_181624-23381.jpg?_wi=2"
|
|
columns={[
|
|
{
|
|
title: "Product",
|
|
items: [
|
|
{
|
|
label: "Features",
|
|
href: "#features",
|
|
},
|
|
{
|
|
label: "Integrations",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Company",
|
|
items: [
|
|
{
|
|
label: "About",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Careers",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Legal",
|
|
items: [
|
|
{
|
|
label: "Privacy",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Terms",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
logoText="Startup"
|
|
copyrightText="© 2025 | Startup Inc"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|