367 lines
11 KiB
TypeScript
367 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FaqBase from '@/components/sections/faq/FaqBase';
|
|
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-bubble"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="small"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="fluid"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="light"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{
|
|
name: "Home",
|
|
id: "hero",
|
|
},
|
|
{
|
|
name: "Shop",
|
|
id: "products",
|
|
},
|
|
{
|
|
name: "About",
|
|
id: "about",
|
|
},
|
|
{
|
|
name: "Contact",
|
|
id: "contact",
|
|
},
|
|
]}
|
|
brandName="STORE 44"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplit
|
|
background={{
|
|
variant: "gradient-bars",
|
|
}}
|
|
title="Welcome to Store 44"
|
|
description="Discover curated collections and exclusive finds tailored for your lifestyle. Experience the difference in quality and style."
|
|
buttons={[
|
|
{
|
|
text: "Shop Now",
|
|
href: "#products",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/modern-interior-lobby-with-uncommon-furniture_1262-3576.jpg"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/room-interior-design_23-2148899442.jpg",
|
|
alt: "modern fashion store storefront",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/stores-blurred-makeup_1203-827.jpg",
|
|
alt: "Stores blurred makeup",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/abstract-blur-furniture-shop-store-interior_1203-8591.jpg",
|
|
alt: "Abstract blur furniture shop and store interior",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/modern-restaurant_1127-2154.jpg",
|
|
alt: "Modern restaurant",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/modern-interior-lobby-with-uncommon-furniture_1262-3576.jpg",
|
|
alt: "modern fashion store storefront",
|
|
},
|
|
]}
|
|
marqueeItems={[
|
|
{
|
|
type: "text",
|
|
text: "Free Shipping",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Curated Style",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Premium Quality",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Modern Essentials",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Store 44 Exclusive",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
useInvertedBackground={false}
|
|
title="Our Story"
|
|
description={[
|
|
"Founded on a passion for quality and design, Store 44 brings you the best in curated retail goods. We believe in providing products that enhance your daily experience.",
|
|
"Every item in our collection is carefully selected to meet our high standards for craftsmanship, durability, and style.",
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFour
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={true}
|
|
products={[
|
|
{
|
|
id: "p1",
|
|
name: "Modern Classic Tee",
|
|
price: "$35",
|
|
variant: "Essential",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/spring-wardrobe-switch-top-view_23-2150264139.jpg",
|
|
},
|
|
{
|
|
id: "p2",
|
|
name: "Urban Carry Bag",
|
|
price: "$85",
|
|
variant: "Accessory",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/travel-still-life-pack_23-2148837305.jpg",
|
|
},
|
|
{
|
|
id: "p3",
|
|
name: "Minimalist Watch",
|
|
price: "$120",
|
|
variant: "Timepiece",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/minimalist-product-presentation-with-geometric-shapes_187299-48038.jpg",
|
|
},
|
|
{
|
|
id: "p4",
|
|
name: "Signature Denim",
|
|
price: "$95",
|
|
variant: "Apparel",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/shelves-with-colored-objects_1203-848.jpg",
|
|
},
|
|
{
|
|
id: "p5",
|
|
name: "Leather Wallet",
|
|
price: "$55",
|
|
variant: "Accessory",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/view-beige-tone-colored-pants_23-2150773383.jpg",
|
|
},
|
|
{
|
|
id: "p6",
|
|
name: "Everyday Hoodie",
|
|
price: "$65",
|
|
variant: "Apparel",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/still-life-spring-wardrobe-switch_23-2150478953.jpg",
|
|
},
|
|
]}
|
|
title="Featured Collection"
|
|
description="Hand-picked essentials for your everyday life."
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentySeven
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
id: "f1",
|
|
title: "Handpicked Quality",
|
|
descriptions: [
|
|
"Each item is rigorously tested.",
|
|
],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/female-personal-shopper-helping-cutomer_23-2148924090.jpg",
|
|
imageAlt: "retail store owners team",
|
|
},
|
|
{
|
|
id: "f2",
|
|
title: "Fast Shipping",
|
|
descriptions: [
|
|
"Order today, receive it soon.",
|
|
],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/modern-interior-lobby-with-uncommon-furniture_1262-3576.jpg",
|
|
imageAlt: "retail store owners team",
|
|
},
|
|
{
|
|
id: "f3",
|
|
title: "Customer First",
|
|
descriptions: [
|
|
"We are always here to help.",
|
|
],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/spring-wardrobe-switch-top-view_23-2150264139.jpg",
|
|
imageAlt: "retail store owners team",
|
|
},
|
|
]}
|
|
title="Why Store 44?"
|
|
description="What sets us apart from the rest."
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
names={[
|
|
"Alpha",
|
|
"Beta",
|
|
"Gamma",
|
|
"Delta",
|
|
"Epsilon",
|
|
"Zeta",
|
|
"Eta",
|
|
]}
|
|
title="Trusted Partners"
|
|
description="Collaborating with leading brands to bring you more."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTen
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "t1",
|
|
title: "Love the quality!",
|
|
quote: "The products are consistently amazing.",
|
|
name: "Alex Smith",
|
|
role: "Designer",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-happy-after-shopping_23-2148660676.jpg",
|
|
},
|
|
{
|
|
id: "t2",
|
|
title: "Great experience",
|
|
quote: "Shopping at Store 44 is always a joy.",
|
|
name: "Jamie Lee",
|
|
role: "Architect",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/business-person-planning-alternative-energies_23-2149205442.jpg",
|
|
},
|
|
{
|
|
id: "t3",
|
|
title: "Top-notch service",
|
|
quote: "They really care about their customers.",
|
|
name: "Casey Jordan",
|
|
role: "Manager",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/two-beautiful-woman-carrying-shopping-bags_1170-808.jpg",
|
|
},
|
|
{
|
|
id: "t4",
|
|
title: "My favorite shop",
|
|
quote: "I keep coming back for the great finds.",
|
|
name: "Morgan Taylor",
|
|
role: "Creative",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-paying-store_23-2149241399.jpg",
|
|
},
|
|
{
|
|
id: "t5",
|
|
title: "Excellent selection",
|
|
quote: "The catalog is always modern and fresh.",
|
|
name: "Drew Kelly",
|
|
role: "Developer",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/personal-shopper-helping-cutomer-choose-clothes_23-2148924101.jpg",
|
|
},
|
|
]}
|
|
title="Customer Reviews"
|
|
description="What our customers are saying."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{
|
|
id: "q1",
|
|
title: "Shipping options?",
|
|
content: "We offer standard and express.",
|
|
},
|
|
{
|
|
id: "q2",
|
|
title: "Return policy?",
|
|
content: "You can return within 30 days.",
|
|
},
|
|
{
|
|
id: "q3",
|
|
title: "Support hours?",
|
|
content: "Available 24/7 via email.",
|
|
},
|
|
]}
|
|
title="Frequently Asked Questions"
|
|
description="Everything you need to know."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain",
|
|
}}
|
|
tag="Newsletter"
|
|
title="Stay in the loop"
|
|
description="Get updates on new collections and offers."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
columns={[
|
|
{
|
|
title: "Shop",
|
|
items: [
|
|
{
|
|
label: "All",
|
|
href: "#products",
|
|
},
|
|
{
|
|
label: "New Arrivals",
|
|
href: "#",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Help",
|
|
items: [
|
|
{
|
|
label: "FAQ",
|
|
href: "#faq",
|
|
},
|
|
{
|
|
label: "Contact",
|
|
href: "#contact",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
logoText="STORE 44"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|