352 lines
11 KiB
TypeScript
352 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleMinimal from "@/components/navbar/NavbarStyleMinimal";
|
|
import HeroSplitLarge from "@/components/sections/hero/HeroSplitLarge";
|
|
import TagMediaSplitAbout from "@/components/sections/about/TagMediaSplitAbout";
|
|
import ProductCardFive from "@/components/sections/product/ProductCardFive";
|
|
import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
|
|
import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
|
|
import ContactSplit from "@/components/sections/contact/ContactSplit";
|
|
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
|
|
import { Sparkles } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="sharp"
|
|
contentWidth="mediumLarge"
|
|
sizing="large"
|
|
background="animatedAurora"
|
|
cardStyle="layered-gradient"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleMinimal
|
|
brandName="ShopHub"
|
|
button={{
|
|
text: "Shop Now",
|
|
href: "#products"
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitLarge
|
|
title="Discover Your Next Favorite Purchase"
|
|
description="Shop premium products with unbeatable prices and lightning-fast delivery. Find everything you need in one place."
|
|
tag="Limited Time Offers"
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709678757-46d11bk8.jpg"
|
|
imageAlt="E-commerce shopping showcase"
|
|
buttons={[
|
|
{
|
|
text: "Start Shopping",
|
|
href: "#products"
|
|
},
|
|
{
|
|
text: "View Deals",
|
|
href: "#pricing"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TagMediaSplitAbout
|
|
title="Why Choose ShopHub"
|
|
description="We bring you quality products at competitive prices with exceptional customer service"
|
|
textboxLayout="default"
|
|
contentTag="OUR MISSION"
|
|
contentTagIcon={Sparkles}
|
|
contentTitle="Quality meets affordability"
|
|
contentDescription="At ShopHub, we curate the finest selection of products from trusted brands worldwide. Every item is carefully selected to ensure quality, value, and customer satisfaction. We believe shopping should be convenient, affordable, and enjoyable."
|
|
contentButtons={[
|
|
{
|
|
text: "Learn More",
|
|
href: "#"
|
|
}
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709680193-2907fw80.jpg"
|
|
imageAlt="ShopHub quality products"
|
|
imagePosition="right"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFive
|
|
title="Featured Products"
|
|
description="Browse our handpicked collection of premium items available for immediate purchase"
|
|
tag="Best Sellers"
|
|
products={[
|
|
{
|
|
id: "prod-1",
|
|
button: {
|
|
text: "Add to Cart"
|
|
},
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709680193-2907fw80.jpg",
|
|
imageAlt: "Premium product 1",
|
|
isFavorited: false
|
|
},
|
|
{
|
|
id: "prod-2",
|
|
button: {
|
|
text: "Add to Cart"
|
|
},
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709681005-b82boj6b.jpg",
|
|
imageAlt: "Premium product 2",
|
|
isFavorited: false
|
|
},
|
|
{
|
|
id: "prod-3",
|
|
button: {
|
|
text: "Add to Cart"
|
|
},
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709681666-yp4g4947.jpg",
|
|
imageAlt: "Premium product 3",
|
|
isFavorited: false
|
|
},
|
|
{
|
|
id: "prod-4",
|
|
button: {
|
|
text: "Add to Cart"
|
|
},
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709682564-xysrv0b7.jpg",
|
|
imageAlt: "Premium product 4",
|
|
isFavorited: false
|
|
}
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardEight
|
|
title="Choose Your Shopping Plan"
|
|
description="Select the perfect membership to unlock exclusive benefits and savings"
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
plans={[
|
|
{
|
|
id: "basic",
|
|
badge: "Popular",
|
|
price: "$0",
|
|
subtitle: "Standard shopping experience",
|
|
buttons: [
|
|
{
|
|
text: "Get Started",
|
|
href: "#"
|
|
}
|
|
],
|
|
features: [
|
|
"Access to all products",
|
|
"Standard shipping (5-7 days)",
|
|
"Order tracking",
|
|
"Basic customer support"
|
|
]
|
|
},
|
|
{
|
|
id: "premium",
|
|
badge: "Best Value",
|
|
price: "$9.99/mo",
|
|
subtitle: "Premium member exclusive",
|
|
buttons: [
|
|
{
|
|
text: "Upgrade Now",
|
|
href: "#"
|
|
}
|
|
],
|
|
features: [
|
|
"Free shipping on all orders",
|
|
"Express delivery (2-3 days)",
|
|
"Early access to sales",
|
|
"Priority customer support",
|
|
"Exclusive member discounts"
|
|
]
|
|
},
|
|
{
|
|
id: "elite",
|
|
badge: "Elite",
|
|
price: "$19.99/mo",
|
|
subtitle: "Maximum savings and benefits",
|
|
buttons: [
|
|
{
|
|
text: "Join Elite",
|
|
href: "#"
|
|
}
|
|
],
|
|
features: [
|
|
"Free overnight shipping",
|
|
"Concierge shopping service",
|
|
"VIP sale access",
|
|
"24/7 dedicated support",
|
|
"Double reward points"
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardOne
|
|
title="What Our Customers Say"
|
|
description="Real reviews from satisfied shoppers who trust ShopHub"
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
gridVariant="uniform-all-items-equal"
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Sarah Johnson",
|
|
role: "Regular Shopper",
|
|
company: "Fashion Enthusiast",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709683499-55c81eek.jpg",
|
|
imageAlt: "Sarah Johnson"
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Michael Chen",
|
|
role: "Tech Buyer",
|
|
company: "Electronics Collector",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709684254-yzpxnfgq.jpg",
|
|
imageAlt: "Michael Chen"
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Emily Rodriguez",
|
|
role: "Home Decor Lover",
|
|
company: "Interior Designer",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709684802-htkm1plj.jpg",
|
|
imageAlt: "Emily Rodriguez"
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "David Kim",
|
|
role: "Corporate Buyer",
|
|
company: "Business Manager",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709685467-q0ul42in.jpg",
|
|
imageAlt: "David Kim"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
tag="Newsletter"
|
|
title="Stay in the Loop"
|
|
description="Get exclusive deals, product launches, and shopping tips delivered to your inbox weekly. Join thousands of happy shoppers."
|
|
useInvertedBackground="noInvert"
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766709686262-ntlf926p.jpg"
|
|
imageAlt="Newsletter signup"
|
|
mediaPosition="right"
|
|
inputPlaceholder="Enter your email"
|
|
buttonText="Subscribe"
|
|
termsText="We respect your privacy. Unsubscribe anytime from our marketing emails."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoEmphasis
|
|
logoText="ShopHub"
|
|
columns={[
|
|
{
|
|
items: [
|
|
{
|
|
label: "Shop",
|
|
href: "#products"
|
|
},
|
|
{
|
|
label: "New Arrivals",
|
|
href: "#"
|
|
},
|
|
{
|
|
label: "Best Sellers",
|
|
href: "#"
|
|
},
|
|
{
|
|
label: "Sale",
|
|
href: "#"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
items: [
|
|
{
|
|
label: "About Us",
|
|
href: "#about"
|
|
},
|
|
{
|
|
label: "Contact",
|
|
href: "#contact"
|
|
},
|
|
{
|
|
label: "FAQs",
|
|
href: "#"
|
|
},
|
|
{
|
|
label: "Blog",
|
|
href: "#"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
items: [
|
|
{
|
|
label: "Shipping Info",
|
|
href: "#"
|
|
},
|
|
{
|
|
label: "Returns",
|
|
href: "#"
|
|
},
|
|
{
|
|
label: "Track Order",
|
|
href: "#"
|
|
},
|
|
{
|
|
label: "Size Guide",
|
|
href: "#"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
items: [
|
|
{
|
|
label: "Privacy Policy",
|
|
href: "#"
|
|
},
|
|
{
|
|
label: "Terms & Conditions",
|
|
href: "#"
|
|
},
|
|
{
|
|
label: "Cookie Policy",
|
|
href: "#"
|
|
},
|
|
{
|
|
label: "Accessibility",
|
|
href: "#"
|
|
}
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|