4 Commits

Author SHA1 Message Date
c6107bbd02 Update src/app/page.tsx 2026-04-26 20:12:34 +00:00
d7c01ea6ac Merge version_3 into main
Merge version_3 into main
2026-04-26 20:11:18 +00:00
c4d35f26af Update src/app/page.tsx 2026-04-26 20:11:14 +00:00
800625e1ad Merge version_2 into main
Merge version_2 into main
2026-04-26 20:10:08 +00:00

View File

@@ -2,15 +2,15 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react"; import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText'; import ContactCTA from '@/components/sections/contact/ContactCTA';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve'; import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import FooterMedia from '@/components/sections/footer/FooterMedia'; import FooterBase from '@/components/sections/footer/FooterBase';
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial'; import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout'; import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven'; import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay'; import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo'; import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive'; import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
export default function LandingPage() { export default function LandingPage() {
return ( return (
@@ -26,154 +26,157 @@ export default function LandingPage() {
secondaryButtonStyle="layered" secondaryButtonStyle="layered"
headingFontWeight="semibold" headingFontWeight="semibold"
> >
<ReactLenis root options={{ lerp: 0.1, smoothWheel: true }}> <ReactLenis root>
<div id="nav" data-section="nav" className="fixed w-full z-50 transition-all duration-700 ease-in-out"> <div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay <NavbarLayoutFloatingOverlay
navItems={[ navItems={[
{ name: "Home", id: "hero" }, { name: "Home", id: "hero" },
{ name: "Our Water", id: "about" }, { name: "Our Water", id: "about" },
{ name: "Source", id: "source" }, { name: "Source", id: "source" },
{ name: "Sustainability", id: "sustainability" }, { name: "Sustainability", id: "sustainability" },
{ name: "Shop", id: "product" }, { name: "Shop", id: "product" },
{ name: "Contact", id: "contact" }, { name: "Contact", id: "contact" },
]} ]}
brandName="Maya Water" brandName="Maya Water"
/> />
</div> </div>
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroOverlayTestimonial <HeroOverlayTestimonial
title="Pure Water. Elevated." title="Pure Water. Elevated."
description="From untouched sources to your hands — hydration reimagined." description="From untouched sources to your hands — hydration reimagined."
testimonials={[ testimonials={[
{ name: "Sarah J.", handle: "@sarahathlete", testimonial: "The cleanest water I've ever tasted, feels like pure nature.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-doing-sport-home_23-2148547302.jpg" }, { name: "Sarah J.", handle: "@sarahathlete", testimonial: "The cleanest water I've ever tasted, feels like pure nature.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-doing-sport-home_23-2148547302.jpg" },
{ name: "Mark D.", handle: "@markruns", testimonial: "My go-to hydration for recovery. Essential.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/fit-sporty-student-girl-shorts-sports-bra-standing-with-crossed-arms-while-leaning-bouldering-wall-gym_613910-18961.jpg" }, { name: "Mark D.", handle: "@markruns", testimonial: "My go-to hydration for recovery. Essential.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/fit-sporty-student-girl-shorts-sports-bra-standing-with-crossed-arms-while-leaning-bouldering-wall-gym_613910-18961.jpg" },
{ name: "Elena K.", handle: "@elena_yoga", testimonial: "The purity is unmatched, perfect for yoga.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-model-black-coat-walks-chairs-studio_8353-5479.jpg" }, { name: "Elena K.", handle: "@elena_yoga", testimonial: "The purity is unmatched, perfect for yoga.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-model-black-coat-walks-chairs-studio_8353-5479.jpg" },
{ name: "David W.", handle: "@dave_cycles", testimonial: "Hydration that supports my daily cycle.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/elegant-mature-lady-sitting-chair_23-2148275130.jpg" }, { name: "David W.", handle: "@dave_cycles", testimonial: "Hydration that supports my daily cycle.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/elegant-mature-lady-sitting-chair_23-2148275130.jpg" },
{ name: "Chloe T.", handle: "@chloe_studio", testimonial: "Elevated branding, premium taste.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-wearing-minimalist-shirt_23-2149317783.jpg" }, { name: "Chloe T.", handle: "@chloe_studio", testimonial: "Elevated branding, premium taste.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-wearing-minimalist-shirt_23-2149317783.jpg" },
]} ]}
buttons={[ buttons={[
{ text: "Explore the Source", href: "#source" }, { text: "Explore the Source", href: "#source" },
{ text: "Shop Now", href: "#product" }, { text: "Shop Now", href: "#product" },
]} ]}
imageSrc="http://img.b2bpic.net/free-photo/sporty-woman-with-plastic-bottle-beach_23-2147803074.jpg?_wi=1" imageSrc="http://img.b2bpic.net/free-photo/sporty-woman-with-plastic-bottle-beach_23-2147803074.jpg?_wi=1"
imageAlt="Maya Water Bottle" imageAlt="Maya Water Bottle"
avatars={[ avatars={[
{ src: "http://img.b2bpic.net/free-photo/front-view-young-female-excited-pink_179666-2073.jpg", alt: "User 1" }, { src: "http://img.b2bpic.net/free-photo/front-view-young-female-excited-pink_179666-2073.jpg", alt: "User 1" },
{ src: "http://img.b2bpic.net/free-photo/portrait-happy-fitness-woman-with-towel-resting_171337-6261.jpg", alt: "User 2" }, { src: "http://img.b2bpic.net/free-photo/portrait-happy-fitness-woman-with-towel-resting_171337-6261.jpg", alt: "User 2" },
{ src: "http://img.b2bpic.net/free-photo/portrait-caucasian-woman-practicing-yoga-home_158595-5429.jpg", alt: "User 3" }, { src: "http://img.b2bpic.net/free-photo/portrait-caucasian-woman-practicing-yoga-home_158595-5429.jpg", alt: "User 3" },
{ src: "http://img.b2bpic.net/free-photo/portrait-sportswoman-doing-workout-home-smiling-looking-camera_1258-189373.jpg", alt: "User 4" }, { src: "http://img.b2bpic.net/free-photo/portrait-sportswoman-doing-workout-home-smiling-looking-camera_1258-189373.jpg", alt: "User 4" },
{ src: "http://img.b2bpic.net/free-photo/abstract-minimal-plant-vase_23-2148835344.jpg", alt: "User 5" }, { src: "http://img.b2bpic.net/free-photo/abstract-minimal-plant-vase_23-2148835344.jpg", alt: "User 5" },
]} ]}
avatarText="Join 10,000+ daily hydrators" avatarText="Join 10,000+ daily hydrators"
/> />
</div> </div>
<div id="about" data-section="about"> <div id="about" data-section="about">
<InlineImageSplitTextAbout <InlineImageSplitTextAbout
useInvertedBackground={true} useInvertedBackground={true}
heading={[ heading={[
{ type: "text", content: "Maya: Purity, Origin, and Mission." }, { type: "text", content: "Maya: Purity, Origin, and Mission." },
{ type: "image", src: "http://img.b2bpic.net/free-photo/closeup-shot-water-flowing-through-mossy-ground_181624-13028.jpg", alt: "Pure spring water" }, { type: "image", src: "http://img.b2bpic.net/free-photo/closeup-shot-water-flowing-through-mossy-ground_181624-13028.jpg", alt: "Pure spring water" },
]} ]}
/> />
</div> </div>
<div id="source" data-section="source"> <div id="source" data-section="source">
<FeatureCardTwelve <FeatureCardTwelve
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false} useInvertedBackground={false}
animationType="slide-up" animationType="slide-up"
features={[ features={[
{ id: "s1", label: "Origin", title: "Mountain Springs", items: ["Deep underground source", "Natural filtration", "High-altitude purity"] }, { id: "s1", label: "Origin", title: "Mountain Springs", items: ["Deep underground source", "Natural filtration", "High-altitude purity"] },
{ id: "s2", label: "Mineralization", title: "Trace Minerals", items: ["Potassium rich", "Calcium essential", "Balanced pH level"] }, { id: "s2", label: "Mineralization", title: "Trace Minerals", items: ["Potassium rich", "Calcium essential", "Balanced pH level"] },
{ id: "s3", label: "Filtration", title: "Cold-Filtering", items: ["No chemical additives", "Pure mechanical process", "Nature's own pressure"] }, { id: "s3", label: "Filtration", title: "Cold-Filtering", items: ["No chemical additives", "Pure mechanical process", "Nature's own pressure"] },
]} ]}
title="The Source" title="The Source"
description="Untouched mountain springs filtered through ancient mineral earth." description="Untouched mountain springs filtered through ancient mineral earth."
/> />
</div> </div>
<div id="benefits" data-section="benefits"> <div id="benefits" data-section="benefits">
<MetricCardEleven <MetricCardEleven
animationType="slide-up" animationType="slide-up"
textboxLayout="split" textboxLayout="split"
useInvertedBackground={true} useInvertedBackground={true}
metrics={[ metrics={[
{ id: "m1", value: "100%", title: "Pure Hydration", description: "No additives, just pure mineral energy.", imageSrc: "http://img.b2bpic.net/free-photo/postcard-with-water-drops-pink-background_1268-31388.jpg?_wi=1" }, { id: "m1", value: "100%", title: "Pure Hydration", description: "No additives, just pure mineral energy.", imageSrc: "http://img.b2bpic.net/free-photo/postcard-with-water-drops-pink-background_1268-31388.jpg?_wi=1" },
{ id: "m2", value: "24/7", title: "Active Support", description: "Perfect for performance recovery.", imageSrc: "http://img.b2bpic.net/free-photo/green-liquid-falling-black-backdrop_23-2147837294.jpg" }, { id: "m2", value: "24/7", title: "Active Support", description: "Perfect for performance recovery.", imageSrc: "http://img.b2bpic.net/free-photo/green-liquid-falling-black-backdrop_23-2147837294.jpg" },
{ id: "m3", value: "Natural", title: "Mineral Balance", description: "Natures perfect electrolyte ratio.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-still-life-with-water_23-2149199548.jpg" }, { id: "m3", value: "Natural", title: "Mineral Balance", description: "Natures perfect electrolyte ratio.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-still-life-with-water_23-2149199548.jpg" },
]} ]}
title="Hydration Elevated" title="Hydration Elevated"
description="Fuel your active lifestyle with mineral-rich perfection." description="Fuel your active lifestyle with mineral-rich perfection."
/> />
</div> </div>
<div id="sustainability" data-section="sustainability"> <div id="sustainability" data-section="sustainability">
<InlineImageSplitTextAbout <InlineImageSplitTextAbout
useInvertedBackground={false} useInvertedBackground={false}
heading={[ heading={[
{ type: "text", content: "Our Commitment to Sustainability." }, { type: "text", content: "Our Commitment to Sustainability." },
{ type: "image", src: "http://img.b2bpic.net/free-photo/hands-showing-balloons-word_53876-21092.jpg", alt: "Eco packaging" }, { type: "image", src: "http://img.b2bpic.net/free-photo/hands-showing-balloons-word_53876-21092.jpg", alt: "Eco packaging" },
]} ]}
/> />
</div> </div>
<div id="product" data-section="product"> <div id="product" data-section="product">
<ProductCardTwo <ProductCardTwo
textboxLayout="default" textboxLayout="default"
gridVariant="three-columns-all-equal-width" gridVariant="three-columns-all-equal-width"
animationType="slide-up" animationType="slide-up"
useInvertedBackground={true} useInvertedBackground={true}
products={[ products={[
{ id: "p1", brand: "Maya", name: "Spring Sport (500ml)", price: "$3.00", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/blue-liquid-bottle-with-green-cap_187299-46177.jpg" }, { id: "p1", brand: "Maya", name: "Spring Sport (500ml)", price: "$3.00", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/blue-liquid-bottle-with-green-cap_187299-46177.jpg", onProductClick: () => { window.location.href = '#checkout'; } },
{ id: "p2", brand: "Maya", name: "Crystal Flow (1L)", price: "$5.00", rating: 5, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/blank-cosmetic-lotion-bottle_74190-5091.jpg" }, { id: "p2", brand: "Maya", name: "Crystal Flow (1L)", price: "$5.00", rating: 5, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/blank-cosmetic-lotion-bottle_74190-5091.jpg", onProductClick: () => { window.location.href = '#checkout'; } },
{ id: "p3", brand: "Maya", name: "Evergreen Pack (6x)", price: "$25.00", rating: 5, reviewCount: "420", imageSrc: "http://img.b2bpic.net/free-photo/still-life-daisy-flowers_23-2150321399.jpg" }, { id: "p3", brand: "Maya", name: "Evergreen Pack (6x)", price: "$25.00", rating: 5, reviewCount: "420", imageSrc: "http://img.b2bpic.net/free-photo/still-life-daisy-flowers_23-2150321399.jpg", onProductClick: () => { window.location.href = '#checkout'; } },
{ id: "p4", brand: "Maya", name: "Summit Series (1.5L)", price: "$7.00", rating: 5, reviewCount: "65", imageSrc: "http://img.b2bpic.net/free-photo/shadow-oil-bottle-with-olives-tea-strainer-white-backdrop_23-2147853863.jpg" }, { id: "p4", brand: "Maya", name: "Summit Series (1.5L)", price: "$7.00", rating: 5, reviewCount: "65", imageSrc: "http://img.b2bpic.net/free-photo/shadow-oil-bottle-with-olives-tea-strainer-white-backdrop_23-2147853863.jpg", onProductClick: () => { window.location.href = '#checkout'; } },
{ id: "p5", brand: "Maya", name: "Infinite Refill", price: "$40.00", rating: 5, reviewCount: "310", imageSrc: "http://img.b2bpic.net/free-photo/nice-sealed-bottle-dairy_23-2147895710.jpg" }, { id: "p5", brand: "Maya", name: "Infinite Refill", price: "$40.00", rating: 5, reviewCount: "310", imageSrc: "http://img.b2bpic.net/free-photo/nice-sealed-bottle-dairy_23-2147895710.jpg", onProductClick: () => { window.location.href = '#checkout'; } },
{ id: "p6", brand: "Maya", name: "Eco-Glass Edition", price: "$12.00", rating: 5, reviewCount: "210", imageSrc: "http://img.b2bpic.net/free-photo/thermal-bottle_1203-3566.jpg" }, { id: "p6", brand: "Maya", name: "Eco-Glass Edition", price: "$12.00", rating: 5, reviewCount: "210", imageSrc: "http://img.b2bpic.net/free-photo/thermal-bottle_1203-3566.jpg", onProductClick: () => { window.location.href = '#checkout'; } },
]} ]}
title="Our Collection" title="Our Collection"
description="Select your Maya experience." description="Select your Maya experience."
/> />
</div> </div>
<div id="testimonials" data-section="testimonials"> <div id="testimonials" data-section="testimonials">
<TestimonialCardFive <TestimonialCardThirteen
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false} useInvertedBackground={false}
testimonials={[ animationType="slide-up"
{ id: "t1", name: "Sarah J.", date: "Jan 2025", title: "Triathlete", quote: "Hydration reimagined. Pure and simple.", tag: "Elite", avatarSrc: "http://img.b2bpic.net/free-photo/young-girl-leaning-chin-hands-turquoise-t-shirt-pants-looking-satisfied-front-view_176474-106728.jpg", imageSrc: "http://img.b2bpic.net/free-photo/sporty-woman-with-plastic-bottle-beach_23-2147803074.jpg?_wi=2", imageAlt: "healthy young athlete" }, showRating={true}
{ id: "t2", name: "Mark D.", date: "Feb 2025", title: "Ultra Runner", quote: "Cleanest finish after any long race.", tag: "Pro", avatarSrc: "http://img.b2bpic.net/free-photo/thoughtful-man-doing-physical-exercises_1098-2727.jpg", imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-water-flowing-through-mossy-ground_181624-13028.jpg", imageAlt: "healthy young athlete" }, testimonials={[
{ id: "t3", name: "Elena K.", date: "Mar 2025", title: "Yoga Coach", quote: "Refreshingly pure experience.", tag: "Wellness", avatarSrc: "http://img.b2bpic.net/free-photo/studio-with-props-photography_23-2148885650.jpg", imageSrc: "http://img.b2bpic.net/free-photo/dreamy-rainbow-countryside_23-2151625119.jpg", imageAlt: "healthy young athlete" }, { id: "t1", name: "Sarah J.", handle: "@sarahathlete", testimonial: "Hydration reimagined. Pure and simple.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/sporty-woman-with-plastic-bottle-beach_23-2147803074.jpg?_wi=2" },
{ id: "t4", name: "David W.", date: "Mar 2025", title: "Cyclist", quote: "Essential mineral content.", tag: "Athlete", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-female-athlete-stretching_23-2147839312.jpg", imageSrc: "http://img.b2bpic.net/free-photo/postcard-with-water-drops-pink-background_1268-31388.jpg?_wi=2", imageAlt: "healthy young athlete" }, { id: "t2", name: "Mark D.", handle: "@markruns", testimonial: "Cleanest finish after any long race.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-water-flowing-through-mossy-ground_181624-13028.jpg" },
{ id: "t5", name: "Chloe T.", date: "Apr 2025", title: "Creative", quote: "Everything about this brand is elevated.", tag: "Consumer", avatarSrc: "http://img.b2bpic.net/free-photo/background-with-flower-field-shadow-golden-hour_53876-104081.jpg", imageSrc: "http://img.b2bpic.net/free-photo/hands-showing-balloons-word_53876-21092.jpg", imageAlt: "healthy young athlete" }, { id: "t3", name: "Elena K.", handle: "@elena_yoga", testimonial: "Refreshingly pure experience.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/dreamy-rainbow-countryside_23-2151625119.jpg" },
]} { id: "t4", name: "David W.", handle: "@dave_cycles", testimonial: "Essential mineral content.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/postcard-with-water-drops-pink-background_1268-31388.jpg?_wi=2" },
title="Loved by Athletes" { id: "t5", name: "Chloe T.", handle: "@chloe_studio", testimonial: "Everything about this brand is elevated.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/hands-showing-balloons-word_53876-21092.jpg" },
description="See why top performers choose Maya." ]}
/> title="Loved by Athletes"
</div> description="See why top performers choose Maya."
/>
</div>
<div id="contact" data-section="contact" className="overflow-hidden translate-y-0 transition-transform duration-1000"> <div id="contact" data-section="contact">
<ContactText <ContactCTA
useInvertedBackground={true} tag="Contact Us"
background={{ variant: "sparkles-gradient" }} title="Join the Maya revolution."
text="Join the Maya revolution. Sign up for our wellness news." description="Sign up for our wellness news."
buttons={[{ text: "Newsletter Signup", href: "#" }]} buttons={[{ text: "Newsletter Signup", href: "#" }]}
/> background={{ variant: "sparkles-gradient" }}
</div> useInvertedBackground={true}
/>
</div>
<div id="footer" data-section="footer" className="parallax-footer"> <div id="footer" data-section="footer">
<FooterMedia <FooterBase
imageSrc="http://img.b2bpic.net/free-photo/lake-with-shore-sunset_1259-179.jpg" logoText="Maya Water"
logoText="Maya Water" columns={[
columns={[ { title: "Resources", items: [{ label: "About", href: "#about" }, { label: "Source", href: "#source" }] },
{ title: "Resources", items: [{ label: "About", href: "#about" }, { label: "Source", href: "#source" }] }, { title: "Community", items: [{ label: "Sustainability", href: "#sustainability" }, { label: "Testimonials", href: "#testimonials" }] },
{ title: "Community", items: [{ label: "Sustainability", href: "#sustainability" }, { label: "Testimonials", href: "#testimonials" }] }, { title: "Company", items: [{ label: "Contact", href: "#contact" }, { label: "Privacy Policy", href: "#" }] },
{ title: "Company", items: [{ label: "Contact", href: "#contact" }, { label: "Privacy Policy", href: "#" }] }, ]}
]} />
/> </div>
</div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );