Merge version_1 into main #1
423
src/app/page.tsx
423
src/app/page.tsx
@@ -15,305 +15,150 @@ import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCar
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Features",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Keeky"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Keeky"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="Future-Proof Your Brand with Keeky."
|
||||
description="Streamline your digital presence with our innovative software platform designed for the modern creator."
|
||||
tag="Revolutionizing Tech"
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-typing-laptop-sitting-home-with-automation-lighting-system_482257-8729.jpg",
|
||||
imageAlt: "tech dashboard software UI",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/technology-network-background-connection-cyber-space-ai-generative_123827-24187.jpg",
|
||||
imageAlt: "data flow network visualization",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-cabinet-private-clinic-with-laptop-diagnostics_482257-122738.jpg",
|
||||
imageAlt: "Empty medical cabinet in private clinic with a laptop and diagnostics",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-african-american-entrepreneur-analyzing-company-profit_482257-20207.jpg",
|
||||
imageAlt: "Closeup of african american entrepreneur analyzing company profit",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-geometric-glass-shape_23-2150979712.jpg",
|
||||
imageAlt: "3d rendering of geometric glass shape",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="Trusted by 500+ startups"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{ variant: "plain" }}
|
||||
title="Future-Proof Your Brand with Keeky."
|
||||
description="Streamline your digital presence with our innovative software platform designed for the modern creator."
|
||||
tag="Revolutionizing Tech"
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-typing-laptop-sitting-home-with-automation-lighting-system_482257-8729.jpg", imageAlt: "tech dashboard software UI" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/technology-network-background-connection-cyber-space-ai-generative_123827-24187.jpg", imageAlt: "data flow network visualization" }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="Trusted by 500+ startups"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Why Choose Keeky?"
|
||||
description="We build tools that simplify complexity and empower your team to focus on growth and innovation."
|
||||
metrics={[
|
||||
{
|
||||
value: "99%",
|
||||
title: "Uptime Guarantee",
|
||||
},
|
||||
{
|
||||
value: "10x",
|
||||
title: "Performance Boost",
|
||||
},
|
||||
{
|
||||
value: "24/7",
|
||||
title: "Expert Support",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/luxurious-modern-office-space-with-important-reports-laptop-empty-desk-showcasing-important-data_482257-133861.jpg"
|
||||
imageAlt="modern office minimalist tech"
|
||||
mediaAnimation="blur-reveal"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Why Choose Keeky?"
|
||||
description="We build tools that simplify complexity and empower your team to focus on growth and innovation."
|
||||
metrics={[
|
||||
{ value: "99%", title: "Uptime Guarantee" },
|
||||
{ value: "10x", title: "Performance Boost" },
|
||||
{ value: "24/7", title: "Expert Support" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/luxurious-modern-office-space-with-important-reports-laptop-empty-desk-showcasing-important-data_482257-133861.jpg"
|
||||
imageAlt="modern office minimalist tech"
|
||||
mediaAnimation="blur-reveal"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Advanced Analytics",
|
||||
author: "Product Lead",
|
||||
description: "Get deep insights into your business performance instantly.",
|
||||
tags: [
|
||||
"Tech",
|
||||
"Insights",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smart-car-navigator-interface-windshield-hologram_53876-103040.jpg",
|
||||
imageAlt: "tech dashboard software UI",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Scalable Infrastructure",
|
||||
author: "Tech Lead",
|
||||
description: "Designed to grow with your business without limits.",
|
||||
tags: [
|
||||
"Cloud",
|
||||
"SaaS",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-connecting-dots-digital-network-design_53876-160254.jpg",
|
||||
imageAlt: "data flow network visualization",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Collaborative Workspace",
|
||||
author: "UX Design",
|
||||
description: "Connect your team with seamless digital workflow tools.",
|
||||
tags: [
|
||||
"Productivity",
|
||||
"协作",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/building-with-multiple-floors_250224-43.jpg",
|
||||
imageAlt: "modern office minimalist tech",
|
||||
},
|
||||
]}
|
||||
title="Powerful Core Features."
|
||||
description="Experience innovation at every level of your operation."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", title: "Advanced Analytics", author: "Product Lead", description: "Get deep insights into your business performance instantly.", tags: ["Tech", "Insights"], imageSrc: "http://img.b2bpic.net/free-photo/smart-car-navigator-interface-windshield-hologram_53876-103040.jpg", imageAlt: "tech dashboard software UI" },
|
||||
{ id: "f2", title: "Scalable Infrastructure", author: "Tech Lead", description: "Designed to grow with your business without limits.", tags: ["Cloud", "SaaS"], imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-connecting-dots-digital-network-design_53876-160254.jpg", imageAlt: "data flow network visualization" },
|
||||
{ id: "f3", title: "Collaborative Workspace", author: "UX Design", description: "Connect your team with seamless digital workflow tools.", tags: ["Productivity", "协作"], imageSrc: "http://img.b2bpic.net/free-photo/building-with-multiple-floors_250224-43.jpg", imageAlt: "modern office minimalist tech" },
|
||||
]}
|
||||
title="Powerful Core Features."
|
||||
description="Experience innovation at every level of your operation."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "250+",
|
||||
description: "Projects completed",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "50K",
|
||||
description: "Users served daily",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "15M",
|
||||
description: "Revenue generated",
|
||||
},
|
||||
]}
|
||||
title="Proven Impact."
|
||||
description="Data-driven results that speak for themselves."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "m1", value: "250+", description: "Projects completed" },
|
||||
{ id: "m2", value: "50K", description: "Users served daily" },
|
||||
{ id: "m3", value: "15M", description: "Revenue generated" },
|
||||
]}
|
||||
title="Proven Impact."
|
||||
description="Data-driven results that speak for themselves."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Johnson",
|
||||
handle: "@sarahj",
|
||||
testimonial: "Keeky changed the way we handle our data. Simply incredible performance.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-library_23-2149204750.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael Chen",
|
||||
handle: "@mchen",
|
||||
testimonial: "The best platform for scale. Highly recommended for any serious tech firm.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blond-female-dressed-white-shirt-eyeglasses-holds-tablet-pc-grey-background_613910-14708.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily Rodriguez",
|
||||
handle: "@emilyr",
|
||||
testimonial: "Fantastic UI and extremely helpful support team when we needed them.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mature-business-manager-office_1098-21368.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Kim",
|
||||
handle: "@davidk",
|
||||
testimonial: "Keeky brings innovation to the forefront of our business operations daily.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-business-man-posing-with-crossed-arms_23-2149206526.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Alex Smith",
|
||||
handle: "@alexs",
|
||||
testimonial: "An essential toolkit for modern software businesses and startups.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-latin-friends-hanging-out_23-2151139423.jpg",
|
||||
},
|
||||
]}
|
||||
title="What Our Partners Say."
|
||||
description="Client success is our top priority."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Johnson", handle: "@sarahj", testimonial: "Keeky changed the way we handle our data. Simply incredible performance.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-library_23-2149204750.jpg" },
|
||||
{ id: "2", name: "Michael Chen", handle: "@mchen", testimonial: "The best platform for scale. Highly recommended for any serious tech firm.", imageSrc: "http://img.b2bpic.net/free-photo/blond-female-dressed-white-shirt-eyeglasses-holds-tablet-pc-grey-background_613910-14708.jpg" },
|
||||
{ id: "3", name: "Emily Rodriguez", handle: "@emilyr", testimonial: "Fantastic UI and extremely helpful support team when we needed them.", imageSrc: "http://img.b2bpic.net/free-photo/mature-business-manager-office_1098-21368.jpg" },
|
||||
{ id: "4", name: "David Kim", handle: "@davidk", testimonial: "Keeky brings innovation to the forefront of our business operations daily.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-business-man-posing-with-crossed-arms_23-2149206526.jpg" },
|
||||
{ id: "5", name: "Alex Smith", handle: "@alexs", testimonial: "An essential toolkit for modern software businesses and startups.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-latin-friends-hanging-out_23-2151139423.jpg" },
|
||||
]}
|
||||
title="What Our Partners Say."
|
||||
description="Client success is our top priority."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How do I get started?",
|
||||
content: "Sign up on our platform and complete your profile in minutes.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Is there a free trial?",
|
||||
content: "Yes, we offer a 14-day free trial on all premium plans.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Can I cancel anytime?",
|
||||
content: "Absolutely, our subscription model is flexible and you can cancel anytime.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked Questions."
|
||||
description="Find quick answers to common questions about Keeky."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "q1", title: "How do I get started?", content: "Sign up on our platform and complete your profile in minutes." },
|
||||
{ id: "q2", title: "Is there a free trial?", content: "Yes, we offer a 14-day free trial on all premium plans." },
|
||||
{ id: "q3", title: "Can I cancel anytime?", content: "Absolutely, our subscription model is flexible and you can cancel anytime." },
|
||||
]}
|
||||
title="Frequently Asked Questions."
|
||||
description="Find quick answers to common questions about Keeky."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Contact Us."
|
||||
description="Have questions? We are here to help."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/empty-conference-room-within-corporation-designed-productivity_482257-124018.jpg"
|
||||
imageAlt="modern office minimalist tech"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Contact Us."
|
||||
description="Have questions? We are here to help."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email", required: true },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/empty-conference-room-within-corporation-designed-productivity_482257-124018.jpg"
|
||||
imageAlt="modern office minimalist tech"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources",
|
||||
items: [
|
||||
{
|
||||
label: "Blog",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Help",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Keeky"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Careers", href: "#" }] },
|
||||
{ title: "Resources", items: [{ label: "Blog", href: "#" }, { label: "Help", href: "#" }] },
|
||||
]}
|
||||
logoText="Keeky"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user