399 lines
12 KiB
TypeScript
399 lines
12 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
|
|
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
import { Award, Users, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="medium"
|
|
sizing="mediumLarge"
|
|
background="none"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="normal"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{
|
|
name: "About",
|
|
id: "#about",
|
|
},
|
|
{
|
|
name: "Services",
|
|
id: "#features",
|
|
},
|
|
{
|
|
name: "Pricing",
|
|
id: "#pricing",
|
|
},
|
|
{
|
|
name: "Contact",
|
|
id: "#contact",
|
|
},
|
|
]}
|
|
brandName="Adaptive"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardTestimonial
|
|
background={{
|
|
variant: "gradient-bars",
|
|
}}
|
|
title="We Design Adaptive Experiences."
|
|
description="Adaptive is a creative agency built for the future. We craft digital identities that evolve, scale, and resonate."
|
|
testimonials={[
|
|
{
|
|
name: "Alex Rivers",
|
|
handle: "@alex",
|
|
testimonial: "Adaptive transformed our digital presence completely.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443503.jpg",
|
|
imageAlt: "creative agency studio aesthetic",
|
|
},
|
|
{
|
|
name: "Sam Taylor",
|
|
handle: "@sam",
|
|
testimonial: "The best creative partners we've ever worked with.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/inclusive-workspace-atmosphere-office-job_23-2149571034.jpg",
|
|
imageAlt: "creative agency studio aesthetic",
|
|
},
|
|
{
|
|
name: "Jamie Lee",
|
|
handle: "@jamie",
|
|
testimonial: "Innovative designs that actually drive results.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/top-view-smartphone-graphics_23-2148080988.jpg",
|
|
imageAlt: "creative agency studio aesthetic",
|
|
},
|
|
{
|
|
name: "Morgan Gray",
|
|
handle: "@morgan",
|
|
testimonial: "Exceptional attention to detail and branding.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/joyful-business-woman-with-coffee-cup_23-2148095746.jpg",
|
|
imageAlt: "creative agency studio aesthetic",
|
|
},
|
|
{
|
|
name: "Jordan P.",
|
|
handle: "@jordan",
|
|
testimonial: "A truly modern creative agency.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/confident-businesswoman-looking-away_23-2148452694.jpg",
|
|
imageAlt: "creative agency studio aesthetic",
|
|
},
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "Start Project",
|
|
href: "#contact",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443503.jpg"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/abstract-arrangement-3d-glasses_23-2149487729.jpg",
|
|
alt: "Abstract arrangement of 3d glasses",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/letter-eyeglasses-smartphone-earphone-coffee-cup-white-desk_23-2148061610.jpg",
|
|
alt: "Letter a; eyeglasses; smartphone; earphone; coffee cup on white desk",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/comparison-different-types-brush-strokes_23-2150105302.jpg",
|
|
alt: "Comparison of different types of brush strokes",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443498.jpg",
|
|
alt: "Top view over career guidance items for designers",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/top-view-career-guidance-items-designers_23-2149443503.jpg",
|
|
alt: "creative agency studio aesthetic",
|
|
},
|
|
]}
|
|
marqueeItems={[
|
|
{
|
|
type: "text",
|
|
text: "Adaptive Strategy",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Digital Transformation",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Brand Evolution",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Modern UX/UI",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Growth Marketing",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<AboutMetric
|
|
useInvertedBackground={false}
|
|
title="Built on Impact"
|
|
metrics={[
|
|
{
|
|
icon: Award,
|
|
label: "Projects Won",
|
|
value: "150+",
|
|
},
|
|
{
|
|
icon: Users,
|
|
label: "Happy Clients",
|
|
value: "85+",
|
|
},
|
|
{
|
|
icon: Zap,
|
|
label: "Years Active",
|
|
value: "10+",
|
|
},
|
|
]}
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyOne
|
|
useInvertedBackground={true}
|
|
title="Our Core Services"
|
|
description="We offer a suite of creative services tailored to your business needs."
|
|
accordionItems={[
|
|
{
|
|
id: "f1",
|
|
title: "Brand Strategy",
|
|
content: "Defining your identity in a cluttered market.",
|
|
},
|
|
{
|
|
id: "f2",
|
|
title: "Digital Design",
|
|
content: "Beautiful, high-conversion interfaces.",
|
|
},
|
|
{
|
|
id: "f3",
|
|
title: "Campaign Growth",
|
|
content: "Marketing strategies that scale.",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/top-view-smartphone-graphics_23-2148080988.jpg"
|
|
mediaAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
names={[
|
|
"TechCorp",
|
|
"InnovateLab",
|
|
"GrowthCo",
|
|
"StartupXYZ",
|
|
"DigitalWave",
|
|
"CloudSync",
|
|
"NexusDesign",
|
|
]}
|
|
title="Trusted by Leaders"
|
|
description="We partner with forward-thinking companies to build greatness."
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
plans={[
|
|
{
|
|
id: "basic",
|
|
price: "$5,000",
|
|
name: "Starter",
|
|
buttons: [
|
|
{
|
|
text: "Get Started",
|
|
href: "#contact",
|
|
},
|
|
],
|
|
features: [
|
|
"Brand Audit",
|
|
"Logo Design",
|
|
"Style Guide",
|
|
],
|
|
},
|
|
{
|
|
id: "pro",
|
|
price: "$12,000",
|
|
name: "Professional",
|
|
buttons: [
|
|
{
|
|
text: "Get Started",
|
|
href: "#contact",
|
|
},
|
|
],
|
|
features: [
|
|
"Full Rebrand",
|
|
"UI/UX Design",
|
|
"Social Assets",
|
|
],
|
|
},
|
|
{
|
|
id: "ent",
|
|
price: "$25,000",
|
|
name: "Enterprise",
|
|
buttons: [
|
|
{
|
|
text: "Contact Us",
|
|
href: "#contact",
|
|
},
|
|
],
|
|
features: [
|
|
"Design Systems",
|
|
"Growth Strategy",
|
|
"Full Support",
|
|
],
|
|
},
|
|
]}
|
|
title="Transparent Pricing"
|
|
description="Flexible plans for every stage of your creative growth."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonial" data-section="testimonial">
|
|
<TestimonialCardTwelve
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "t1",
|
|
name: "Jane D.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/joyful-business-woman-with-coffee-cup_23-2148095746.jpg",
|
|
},
|
|
{
|
|
id: "t2",
|
|
name: "Mark S.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/confident-businesswoman-looking-away_23-2148452694.jpg",
|
|
},
|
|
{
|
|
id: "t3",
|
|
name: "Lisa R.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-woman-with-long-brown-hair-black-t-shirt-white-jacket_613910-8245.jpg",
|
|
},
|
|
{
|
|
id: "t4",
|
|
name: "Tom B.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/grayscale-photo-smiling-woman-wearing-turtleneck-top_250224-182.jpg",
|
|
},
|
|
{
|
|
id: "t5",
|
|
name: "Sarah K.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/smiling-african-american-man-posing-library_74855-1619.jpg",
|
|
},
|
|
]}
|
|
cardTitle="What They Say"
|
|
cardTag="Testimonials"
|
|
cardAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{
|
|
id: "q1",
|
|
title: "How do we start?",
|
|
content: "Just schedule a discovery call through our contact form.",
|
|
},
|
|
{
|
|
id: "q2",
|
|
title: "What's the process?",
|
|
content: "Discovery, Strategy, Design, and Delivery.",
|
|
},
|
|
{
|
|
id: "q3",
|
|
title: "Do you work remotely?",
|
|
content: "Yes, we are a fully remote global studio.",
|
|
},
|
|
]}
|
|
sideTitle="Questions?"
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain",
|
|
}}
|
|
tag="Let's Connect"
|
|
title="Start your journey with Adaptive today."
|
|
description="Share your vision and let's craft something remarkable."
|
|
imageSrc="http://img.b2bpic.net/free-photo/luxurious-modern-office-space-with-important-reports-laptop-empty-desk-showcasing-important-data_482257-133861.jpg"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoEmphasis
|
|
columns={[
|
|
{
|
|
items: [
|
|
{
|
|
label: "About",
|
|
href: "#about",
|
|
},
|
|
{
|
|
label: "Services",
|
|
href: "#features",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{
|
|
label: "Privacy",
|
|
href: "#",
|
|
},
|
|
{
|
|
label: "Terms",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
logoText="Adaptive"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|