Merge version_2 into main
Merge version_2 into main
This commit was merged in pull request #2.
This commit is contained in:
251
src/app/page.tsx
251
src/app/page.tsx
@@ -9,6 +9,8 @@ import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaA
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';
|
||||
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
||||
import TimelineProcessFlow from '@/components/cardStack/layouts/timelines/TimelineProcessFlow';
|
||||
import { MessageSquare, CalendarCheck, BarChart3 } from 'lucide-react';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -28,22 +30,12 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Booking", id: "booking" },
|
||||
{ name: "Chat", id: "chat" },
|
||||
{ name: "Progress", id: "progress" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="ShopifyPro"
|
||||
/>
|
||||
@@ -51,99 +43,67 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Future of E-Commerce"
|
||||
description="Streamline your retail operations with our high-performance platform designed for scaling."
|
||||
buttons={[
|
||||
{
|
||||
text: "Start Selling",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Start Selling", href: "#products" }]}
|
||||
carouselItems={[
|
||||
{
|
||||
id: "c1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/love-relationships-fashion-style-concept-isolated-vertical-image-fashionable-couple-similar-clothes-posing-barefooted-dominant-man-relaxing-chair-with-his-wife-sitting-floor_343059-3168.jpg",
|
||||
imageAlt: "Fashion",
|
||||
},
|
||||
{
|
||||
id: "c2",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-stationary-collection-arrangement_23-2149309689.jpg",
|
||||
imageAlt: "Tech",
|
||||
},
|
||||
{
|
||||
id: "c3",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-kit-with-jewelry-brushes-modeling-career_52683-109518.jpg",
|
||||
imageAlt: "Accessories",
|
||||
},
|
||||
{
|
||||
id: "c4",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-equipment-arrangement_23-2148531501.jpg",
|
||||
imageAlt: "Fitness",
|
||||
},
|
||||
{
|
||||
id: "c5",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/white-different-shaped-modern-vases_23-2149835523.jpg",
|
||||
imageAlt: "Decor",
|
||||
},
|
||||
{
|
||||
id: "c6",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-body-butter-recipient_23-2148543044.jpg",
|
||||
imageAlt: "Skincare",
|
||||
},
|
||||
{ id: "c1", imageSrc: "http://img.b2bpic.net/free-photo/love-relationships-fashion-style-concept-isolated-vertical-image-fashionable-couple-similar-clothes-posing-barefooted-dominant-man-relaxing-chair-with-his-wife-sitting-floor_343059-3168.jpg" },
|
||||
{ id: "c2", imageSrc: "http://img.b2bpic.net/free-photo/modern-stationary-collection-arrangement_23-2149309689.jpg" },
|
||||
{ id: "c3", imageSrc: "http://img.b2bpic.net/free-photo/view-kit-with-jewelry-brushes-modeling-career_52683-109518.jpg" },
|
||||
{ id: "c4", imageSrc: "http://img.b2bpic.net/free-photo/top-view-equipment-arrangement_23-2148531501.jpg" },
|
||||
{ id: "c5", imageSrc: "http://img.b2bpic.net/free-photo/white-different-shaped-modern-vases_23-2149835523.jpg" },
|
||||
{ id: "c6", imageSrc: "http://img.b2bpic.net/free-photo/close-up-body-butter-recipient_23-2148543044.jpg" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="booking" data-section="booking">
|
||||
<TimelineProcessFlow
|
||||
title="Session Booking"
|
||||
description="Easily schedule your sessions with our experts using our intuitive calendar interface."
|
||||
textboxLayout="split"
|
||||
animationType="slide-up"
|
||||
items={[
|
||||
{ id: '1', content: "Select Service", media: <CalendarCheck size={48}/>, reverse: false },
|
||||
{ id: '2', content: "Pick Date & Time", media: <CalendarCheck size={48}/>, reverse: true },
|
||||
{ id: '3', content: "Confirm Session", media: <CalendarCheck size={48}/>, reverse: false }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="chat" data-section="chat">
|
||||
<TimelineProcessFlow
|
||||
title="Real-Time Chat"
|
||||
description="Connect instantly with tutors or support via our integrated messaging platform."
|
||||
textboxLayout="split"
|
||||
animationType="slide-up"
|
||||
items={[
|
||||
{ id: '1', content: "Send Inquiry", media: <MessageSquare size={48}/>, reverse: false },
|
||||
{ id: '2', content: "Instant Response", media: <MessageSquare size={48}/>, reverse: true },
|
||||
{ id: '3', content: "Collaborate", media: <MessageSquare size={48}/>, reverse: false }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="progress" data-section="progress">
|
||||
<TimelineProcessFlow
|
||||
title="Student Progress"
|
||||
description="Track your learning milestones and performance metrics in real-time."
|
||||
textboxLayout="split"
|
||||
animationType="slide-up"
|
||||
items={[
|
||||
{ id: '1', content: "Initial Assessment", media: <BarChart3 size={48}/>, reverse: false },
|
||||
{ id: '2', content: "Module Completion", media: <BarChart3 size={48}/>, reverse: true },
|
||||
{ id: '3', content: "Final Certification", media: <BarChart3 size={48}/>, reverse: false }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCatalog
|
||||
layout="section"
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Pro Camera",
|
||||
price: "$1299",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-camera-lens-chess-game_23-2149552368.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Studio Headphones",
|
||||
price: "$299",
|
||||
rating: 4,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-tech-device_23-2150722643.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Mechanical Keyboard",
|
||||
price: "$199",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/warm-edge-lighting-open-section-blue-modern_169016-68924.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Analog Watch",
|
||||
price: "$499",
|
||||
rating: 4,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-holds-gold-watch_8353-10462.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Urban Backpack",
|
||||
price: "$149",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gift-box-near-different-decorations_23-2147963793.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Coffee Brewer",
|
||||
price: "$249",
|
||||
rating: 4,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-beer-wheat-seeds-cup_23-2148726871.jpg",
|
||||
},
|
||||
]}
|
||||
products={[]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -151,24 +111,9 @@ export default function LandingPage() {
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Built for Scale"
|
||||
description="Our robust engine ensures that your store stays fast and secure, no matter the traffic volume. We empower creators to focus on products while we handle the technical infrastructure."
|
||||
metrics={[
|
||||
{
|
||||
value: "10x",
|
||||
title: "Speed Increase",
|
||||
},
|
||||
{
|
||||
value: "99.9%",
|
||||
title: "Uptime",
|
||||
},
|
||||
{
|
||||
value: "24/7",
|
||||
title: "Support",
|
||||
},
|
||||
]}
|
||||
description="Our robust engine ensures that your store stays fast and secure."
|
||||
metrics={[{ value: "10x", title: "Speed" }, { value: "99.9%", title: "Uptime" }, { value: "24/7", title: "Support" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/female-customer-reviewing-clothes_482257-84194.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -177,80 +122,18 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alice Wang",
|
||||
role: "CEO",
|
||||
company: "TechInnovate",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-professional-businesswoman-with-glasses-presentation_23-2148824824.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "John Doe",
|
||||
role: "Director",
|
||||
company: "CreativeOps",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-blond-female-dressed-white-shirt-red-eyeglasses_613910-3575.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Sarah Miller",
|
||||
role: "CTO",
|
||||
company: "DataHub",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-cheerful-man-sitting-desk_329181-15290.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Mark Spencer",
|
||||
role: "Manager",
|
||||
company: "FashionStyle",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-middle-aged-caucasian-fair-haired-woman-standing-near-rack-with-clothes-fashion-store-looking-camera-smiling-boutique-customer-shop-assistant-concept_74855-11820.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Elena Ross",
|
||||
role: "Lead",
|
||||
company: "RetailDirect",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-professional-businesswoman-with-glasses-presentation_23-2148824824.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "500k+",
|
||||
label: "Orders Processed",
|
||||
},
|
||||
{
|
||||
value: "95%",
|
||||
label: "Growth Rate",
|
||||
},
|
||||
{
|
||||
value: "150+",
|
||||
label: "Global Stores",
|
||||
},
|
||||
]}
|
||||
testimonials={[]}
|
||||
kpiItems={[{ value: "500k+", label: "Orders" }, { value: "95%", label: "Growth" }, { value: "150+", label: "Stores" }]}
|
||||
title="Trusted by Leaders"
|
||||
description="See why top-tier companies have switched to our platform for their digital sales operations."
|
||||
description="Why top companies choose our platform."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
text="Ready to transform your retail presence? Get in touch with our team today to get started."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Support",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
text="Ready to transform your retail presence?"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -263,4 +146,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user