Merge version_1 into main #1
@@ -11,8 +11,8 @@ import { Source_Sans_3 } from "next/font/google";
|
||||
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'ShopBase | Your Premium Shopping Boutique',
|
||||
description: 'Discover handpicked, high-quality products at ShopBase. Fast shipping, secure payments, and excellent support.',
|
||||
title: 'ShopBase | Curated Lifestyle Products',
|
||||
description: 'Discover curated products delivered to your door. Experience seamless shopping for your everyday lifestyle.',
|
||||
openGraph: {
|
||||
"siteName": "ShopBase",
|
||||
"type": "website"
|
||||
|
||||
409
src/app/page.tsx
409
src/app/page.tsx
@@ -15,293 +15,148 @@ import TestimonialCardSixteen from '@/components/sections/testimonial/Testimonia
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-shift"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="rounded"
|
||||
defaultButtonVariant="text-shift"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="ShopBase"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
brandName="ShopBase"
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="ShopBase"
|
||||
description="Discover curated products delivered to your door. Experience seamless shopping for your everyday lifestyle."
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Now",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
slides={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-blur-defocused-shopping-mall-department-store_74190-6650.jpg",
|
||||
imageAlt: "Fashion boutique",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-store-with-abstract-concept-architecture_23-2150862066.jpg",
|
||||
imageAlt: "Luxury accessory",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blurred-background-store-shopping-mall-blur-background-with-bokeh-vintage-filtered-image_1253-1605.jpg",
|
||||
imageAlt: "Home decor",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-shoe-rack-with-storage-space-footwear_23-2150839942.jpg",
|
||||
imageAlt: "Sneaker display",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-buys-dishes-store_1157-36692.jpg",
|
||||
imageAlt: "Jewelry store",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-blur-bokeh-defocused-shopping-mall-interior-department-store_1203-9451.jpg",
|
||||
imageAlt: "Shopping mall",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="ShopBase"
|
||||
description="Discover curated products delivered to your door. Experience seamless shopping for your everyday lifestyle."
|
||||
buttons={[{ text: "Shop Now", href: "#products" }]}
|
||||
slides={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/abstract-blur-defocused-shopping-mall-department-store_74190-6650.jpg", imageAlt: "Fashion boutique" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/futuristic-store-with-abstract-concept-architecture_23-2150862066.jpg", imageAlt: "Luxury accessory" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/blurred-background-store-shopping-mall-blur-background-with-bokeh-vintage-filtered-image_1253-1605.jpg", imageAlt: "Home decor" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/view-shoe-rack-with-storage-space-footwear_23-2150839942.jpg", imageAlt: "Sneaker display" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-buys-dishes-store_1157-36692.jpg", imageAlt: "Jewelry store" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/abstract-blur-bokeh-defocused-shopping-mall-interior-department-store_1203-9451.jpg", imageAlt: "Shopping mall" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Fast Shipping",
|
||||
description: "Get your orders delivered within 2-3 business days.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-toy-delivery-truck-boxes_23-2148790049.jpg",
|
||||
},
|
||||
{
|
||||
title: "Secure Payments",
|
||||
description: "Your transactions are protected with encrypted payment gateways.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-online-payment-transaction-security_107791-16637.jpg",
|
||||
},
|
||||
{
|
||||
title: "Easy Returns",
|
||||
description: "Not happy with your order? Send it back hassle-free within 30 days.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/economy-representative-arrows_23-2148541978.jpg",
|
||||
},
|
||||
]}
|
||||
title="Why Choose Us?"
|
||||
description="We prioritize your shopping experience with fast delivery, security, and quality assurance."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Why Choose Us?"
|
||||
description="We prioritize your shopping experience with fast delivery, security, and quality assurance."
|
||||
features={[
|
||||
{ title: "Fast Shipping", description: "Get your orders delivered within 2-3 business days.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-toy-delivery-truck-boxes_23-2148790049.jpg" },
|
||||
{ title: "Secure Payments", description: "Your transactions are protected with encrypted payment gateways.", imageSrc: "http://img.b2bpic.net/free-photo/3d-render-online-payment-transaction-security_107791-16637.jpg" },
|
||||
{ title: "Easy Returns", description: "Not happy with your order? Send it back hassle-free within 30 days.", imageSrc: "http://img.b2bpic.net/free-photo/economy-representative-arrows_23-2148541978.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Classic Denim Jacket",
|
||||
price: "$89",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-teenager-posing_23-2148495540.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Leather Handbag",
|
||||
price: "$120",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-red-stapler_23-2147688605.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Athletic Sneakers",
|
||||
price: "$95",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cropped-shot-fit-woman-runner-wearing-violet-running-shoes-space-print-leggings-standing-stone-concrete-while-getting-ready-jogging-workout_273609-6470.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Gold Wristwatch",
|
||||
price: "$150",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/businessman-hand-pants-pocket_1262-18152.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Wireless Headphones",
|
||||
price: "$199",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/white-headphones_93675-133847.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Modern Sunglasses",
|
||||
price: "$45",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-stylish-woman-with-red-lips_158538-4168.jpg",
|
||||
},
|
||||
]}
|
||||
title="Featured Products"
|
||||
description="Handpicked favorites for every season."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Featured Products"
|
||||
description="Handpicked favorites for every season."
|
||||
products={[
|
||||
{ id: "p1", name: "Classic Denim Jacket", price: "$89", imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-teenager-posing_23-2148495540.jpg" },
|
||||
{ id: "p2", name: "Leather Handbag", price: "$120", imageSrc: "http://img.b2bpic.net/free-photo/close-up-red-stapler_23-2147688605.jpg" },
|
||||
{ id: "p3", name: "Athletic Sneakers", price: "$95", imageSrc: "http://img.b2bpic.net/free-photo/cropped-shot-fit-woman-runner-wearing-violet-running-shoes-space-print-leggings-standing-stone-concrete-while-getting-ready-jogging-workout_273609-6470.jpg" },
|
||||
{ id: "p4", name: "Gold Wristwatch", price: "$150", imageSrc: "http://img.b2bpic.net/free-photo/businessman-hand-pants-pocket_1262-18152.jpg" },
|
||||
{ id: "p5", name: "Wireless Headphones", price: "$199", imageSrc: "http://img.b2bpic.net/free-photo/white-headphones_93675-133847.jpg" },
|
||||
{ id: "p6", name: "Modern Sunglasses", price: "$45", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-stylish-woman-with-red-lips_158538-4168.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Miller",
|
||||
role: "Creative",
|
||||
company: "DesignCo",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/merry-young-adult-enjoying-christmas-conversation-video-call-room-decorated-festivity-celebration-talking-woman-preparing-drink-wine-kitchen-with-joyful-ornaments_482257-28400.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark Evans",
|
||||
role: "Engineer",
|
||||
company: "TechLab",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-with-full-shopping-bags_329181-5027.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Elena Rodriguez",
|
||||
role: "CEO",
|
||||
company: "GrowthIn",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-pleased-africanamerican-girl-wearing-white-tshirt-showing-okay-signs-praise_1258-131001.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Kim",
|
||||
role: "Product Mgr",
|
||||
company: "StartupX",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/positive-curly-haired-woman-shopper-rests-after-making-purchases-mall-dressed-fashionable-clothes-surrounded-by-shopping-bags-looks-gladfully-away-poses-against-blurred-urban-background_273609-59142.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Anna Petrova",
|
||||
role: "Marketing",
|
||||
company: "BrandCo",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/teen-age-youth-style-self-expression-concept-portrait-positive-happy-teenage-girl-with-bob-pinkish-hairstyle-facial-piercing-relaxing-indoors_343059-3781.jpg",
|
||||
},
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "10k+",
|
||||
label: "Happy Customers",
|
||||
},
|
||||
{
|
||||
value: "5k+",
|
||||
label: "Orders Shipped",
|
||||
},
|
||||
{
|
||||
value: "4.9",
|
||||
label: "Rating",
|
||||
},
|
||||
]}
|
||||
title="Customer Stories"
|
||||
description="See why thousands of shoppers love our store."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Customer Stories"
|
||||
description="See why thousands of shoppers love our store."
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Miller", role: "Creative", company: "DesignCo", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/merry-young-adult-enjoying-christmas-conversation-video-call-room-decorated-festivity-celebration-talking-woman-preparing-drink-wine-kitchen-with-joyful-ornaments_482257-28400.jpg" },
|
||||
{ id: "2", name: "Mark Evans", role: "Engineer", company: "TechLab", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-with-full-shopping-bags_329181-5027.jpg" },
|
||||
{ id: "3", name: "Elena Rodriguez", role: "CEO", company: "GrowthIn", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-pleased-africanamerican-girl-wearing-white-tshirt-showing-okay-signs-praise_1258-131001.jpg" },
|
||||
{ id: "4", name: "David Kim", role: "Product Mgr", company: "StartupX", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/positive-curly-haired-woman-shopper-rests-after-making-purchases-mall-dressed-fashionable-clothes-surrounded-by-shopping-bags-looks-gladfully-away-poses-against-blurred-urban-background_273609-59142.jpg" },
|
||||
{ id: "5", name: "Anna Petrova", role: "Marketing", company: "BrandCo", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/teen-age-youth-style-self-expression-concept-portrait-positive-happy-teenage-girl-with-bob-pinkish-hairstyle-facial-piercing-relaxing-indoors_343059-3781.jpg" }
|
||||
]}
|
||||
kpiItems={[
|
||||
{ value: "10k+", label: "Happy Customers" },
|
||||
{ value: "5k+", label: "Orders Shipped" },
|
||||
{ value: "4.9", label: "Rating" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="socialproof" data-section="socialproof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Company A",
|
||||
"Company B",
|
||||
"Company C",
|
||||
"Company D",
|
||||
"Company E",
|
||||
"Company F",
|
||||
"Company G",
|
||||
]}
|
||||
title="Trusted by Top Brands"
|
||||
description="Partnering with industry leaders for the best service."
|
||||
/>
|
||||
</div>
|
||||
<div id="socialproof" data-section="socialproof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Trusted by Top Brands"
|
||||
description="Partnering with industry leaders for the best service."
|
||||
names={["Company A", "Company B", "Company C", "Company D", "Company E", "Company F", "Company G"]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "How long is shipping?",
|
||||
content: "Orders usually ship within 2-3 days.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Can I return items?",
|
||||
content: "Yes, we offer returns within 30 days.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Are payments secure?",
|
||||
content: "Absolutely, all payments are fully encrypted.",
|
||||
},
|
||||
]}
|
||||
title="Common Questions"
|
||||
faqsAnimation="slide-up"
|
||||
description="Everything you need to know about shopping with us."
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Common Questions"
|
||||
description="Everything you need to know about shopping with us."
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{ id: "f1", title: "How long is shipping?", content: "Orders usually ship within 2-3 days." },
|
||||
{ id: "f2", title: "Can I return items?", content: "Yes, we offer returns within 30 days." },
|
||||
{ id: "f3", title: "Are payments secure?", content: "Absolutely, all payments are fully encrypted." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Get in touch"
|
||||
title="Need Help?"
|
||||
description="Our team is here to assist you with any questions."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Get in touch"
|
||||
title="Need Help?"
|
||||
description="Our team is here to assist you with any questions."
|
||||
buttons={[{ text: "Contact Us", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="ShopBase"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="ShopBase"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Terms of Service", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user