Merge version_1 into main #2
371
src/app/page.tsx
371
src/app/page.tsx
@@ -26,295 +26,98 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Comfort",
|
||||
id: "features",
|
||||
},
|
||||
]}
|
||||
brandName="Serenity"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Comfort", id: "features" }
|
||||
]}
|
||||
brandName="Serenity"
|
||||
button={{ text: "Connect" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="A Gentle Place for You"
|
||||
description="Whenever the world feels like too much, come here. Breathe, rest, and remember how much you are loved."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Safe Space",
|
||||
handle: "@serenity",
|
||||
testimonial: "Everything feels lighter when I am here.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stream-flowing-through-rocks_1359-627.jpg?_wi=1",
|
||||
imageAlt: "calm peaceful nature abstract",
|
||||
},
|
||||
{
|
||||
name: "Calm Moment",
|
||||
handle: "@peace",
|
||||
testimonial: "The perfect place to reset and breathe.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-meditating-mans-hands-barefoot-man-sitting-lotus-pose-with-smoke-around-making-sign-with-fingers-hobby-spirituality-health-concept_74855-23557.jpg?_wi=1",
|
||||
imageAlt: "meditation peaceful mindfulness concept",
|
||||
},
|
||||
{
|
||||
name: "Soft Heart",
|
||||
handle: "@kind",
|
||||
testimonial: "I feel so heard and cared for here.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-cute-silly-young-hispanic-trying-kiss-girl-after-date-first-time-leaning_1258-110296.jpg?_wi=1",
|
||||
imageAlt: "smiling person portrait warm",
|
||||
},
|
||||
{
|
||||
name: "New Day",
|
||||
handle: "@hope",
|
||||
testimonial: "A beautiful refuge from the noise.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-cool-woman-posing-outdoors_23-2149726465.jpg?_wi=1",
|
||||
imageAlt: "peaceful person portrait nature",
|
||||
},
|
||||
{
|
||||
name: "Loved One",
|
||||
handle: "@warmth",
|
||||
testimonial: "Simple, sweet, and incredibly soothing.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-hispanic-girl-smiling-happy-walking-city_839833-21293.jpg?_wi=1",
|
||||
imageAlt: "portrait warm smile nature",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/stream-flowing-through-rocks_1359-627.jpg?_wi=2"
|
||||
mediaAnimation="blur-reveal"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-cute-silly-young-hispanic-trying-kiss-girl-after-date-first-time-leaning_1258-110296.jpg",
|
||||
alt: "user",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/front-view-cool-woman-posing-outdoors_23-2149726465.jpg",
|
||||
alt: "user",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-hispanic-girl-smiling-happy-walking-city_839833-21293.jpg",
|
||||
alt: "user",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/high-angle-woman-shooting-with-projector_23-2149424951.jpg",
|
||||
alt: "user",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/low-angle-shot-young-woman-face_23-2148248543.jpg",
|
||||
alt: "user",
|
||||
},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Peaceful",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Calm",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Mindful",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Gentle",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Quiet",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="A Gentle Place for You"
|
||||
description="Whenever the world feels like too much, come here. Breathe, rest, and remember how much you are loved."
|
||||
testimonials={[
|
||||
{ name: "Safe Space", handle: "@serenity", testimonial: "Everything feels lighter when I am here.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/stream-flowing-through-rocks_1359-627.jpg", imageAlt: "calm peaceful nature abstract" },
|
||||
{ name: "Calm Moment", handle: "@peace", testimonial: "The perfect place to reset and breathe.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-meditating-mans-hands-barefoot-man-sitting-lotus-pose-with-smoke-around-making-sign-with-fingers-hobby-spirituality-health-concept_74855-23557.jpg", imageAlt: "meditation peaceful mindfulness concept" },
|
||||
{ name: "Soft Heart", handle: "@kind", testimonial: "I feel so heard and cared for here.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-cute-silly-young-hispanic-trying-kiss-girl-after-date-first-time-leaning_1258-110296.jpg", imageAlt: "smiling person portrait warm" },
|
||||
{ name: "New Day", handle: "@hope", testimonial: "A beautiful refuge from the noise.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-cool-woman-posing-outdoors_23-2149726465.jpg", imageAlt: "peaceful person portrait nature" },
|
||||
{ name: "Loved One", handle: "@warmth", testimonial: "Simple, sweet, and incredibly soothing.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-hispanic-girl-smiling-happy-walking-city_839833-21293.jpg", imageAlt: "portrait warm smile nature" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/stream-flowing-through-rocks_1359-627.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-cute-silly-young-hispanic-trying-kiss-girl-after-date-first-time-leaning_1258-110296.jpg", alt: "user" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/front-view-cool-woman-posing-outdoors_23-2149726465.jpg", alt: "user" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-hispanic-girl-smiling-happy-walking-city_839833-21293.jpg", alt: "user" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/high-angle-woman-shooting-with-projector_23-2149424951.jpg", alt: "user" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/low-angle-shot-young-woman-face_23-2148248543.jpg", alt: "user" }
|
||||
]}
|
||||
marqueeItems={[{ type: "text", text: "Peaceful" }, { type: "text", text: "Calm" }, { type: "text", text: "Mindful" }, { type: "text", text: "Gentle" }, { type: "text", text: "Quiet" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Why This Place Exists"
|
||||
description="Designed with love, specifically for you to navigate those hard days. This is a collection of things that bring peace, comfort, and a reminder that you are not alone."
|
||||
metrics={[
|
||||
{
|
||||
value: "100%",
|
||||
title: "Safe Haven",
|
||||
},
|
||||
{
|
||||
value: "Daily",
|
||||
title: "Comfort",
|
||||
},
|
||||
{
|
||||
value: "Always",
|
||||
title: "Here for You",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-meditating-mans-hands-barefoot-man-sitting-lotus-pose-with-smoke-around-making-sign-with-fingers-hobby-spirituality-health-concept_74855-23557.jpg?_wi=2"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Why This Place Exists"
|
||||
description="Designed with love, specifically for you to navigate those hard days. This is a collection of things that bring peace, comfort, and a reminder that you are not alone."
|
||||
metrics={[{ value: "100%", title: "Safe Haven" }, { value: "Daily", title: "Comfort" }, { value: "Always", title: "Here for You" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-meditating-mans-hands-barefoot-man-sitting-lotus-pose-with-smoke-around-making-sign-with-fingers-hobby-spirituality-health-concept_74855-23557.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureBento
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Soft Music",
|
||||
description: "Gentle sounds to calm your mind.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Music,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-shooting-with-projector_23-2149424951.jpg?_wi=1",
|
||||
imageAlt: "smiling calm individual portrait",
|
||||
},
|
||||
{
|
||||
title: "Deep Breathing",
|
||||
description: "Follow the gentle rhythm.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Wind,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-young-woman-face_23-2148248543.jpg?_wi=1",
|
||||
imageAlt: "happy person calm portrait",
|
||||
},
|
||||
{
|
||||
title: "Positive Thoughts",
|
||||
description: "Kind words for hard times.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Heart,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stream-flowing-through-rocks_1359-627.jpg?_wi=3",
|
||||
imageAlt: "calm peaceful nature abstract",
|
||||
},
|
||||
]}
|
||||
title="Comforting Things"
|
||||
description="A curated list of things to help you cool off when life gets stressful."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureBento
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Soft Music", description: "Gentle sounds to calm your mind.", bentoComponent: "reveal-icon", icon: Music },
|
||||
{ title: "Deep Breathing", description: "Follow the gentle rhythm.", bentoComponent: "reveal-icon", icon: Wind },
|
||||
{ title: "Positive Thoughts", description: "Kind words for hard times.", bentoComponent: "reveal-icon", icon: Heart }
|
||||
]}
|
||||
title="Comforting Things"
|
||||
description="A curated list of things to help you cool off when life gets stressful."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Friend",
|
||||
handle: "@love",
|
||||
testimonial: "You are doing amazing.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-cute-silly-young-hispanic-trying-kiss-girl-after-date-first-time-leaning_1258-110296.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Friend",
|
||||
handle: "@care",
|
||||
testimonial: "Take it slow, breathe.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-cool-woman-posing-outdoors_23-2149726465.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Friend",
|
||||
handle: "@hug",
|
||||
testimonial: "Everything will be okay.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-hispanic-girl-smiling-happy-walking-city_839833-21293.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Friend",
|
||||
handle: "@light",
|
||||
testimonial: "I'm always by your side.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-shooting-with-projector_23-2149424951.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Friend",
|
||||
handle: "@safe",
|
||||
testimonial: "You are loved so much.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-young-woman-face_23-2148248543.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
showRating={true}
|
||||
title="Warm Reminders"
|
||||
description="Kind thoughts shared to brighten your day."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
animationType="blur-reveal"
|
||||
testimonials={[
|
||||
{ id: "1", name: "Friend", handle: "@love", testimonial: "You are doing amazing.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-cute-silly-young-hispanic-trying-kiss-girl-after-date-first-time-leaning_1258-110296.jpg" },
|
||||
{ id: "2", name: "Friend", handle: "@care", testimonial: "Take it slow, breathe.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-cool-woman-posing-outdoors_23-2149726465.jpg" },
|
||||
{ id: "3", name: "Friend", handle: "@hug", testimonial: "Everything will be okay.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-hispanic-girl-smiling-happy-walking-city_839833-21293.jpg" },
|
||||
{ id: "4", name: "Friend", handle: "@light", testimonial: "I'm always by your side.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-shooting-with-projector_23-2149424951.jpg" },
|
||||
{ id: "5", name: "Friend", handle: "@safe", testimonial: "You are loved so much.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-young-woman-face_23-2148248543.jpg" }
|
||||
]}
|
||||
showRating={true}
|
||||
title="Warm Reminders"
|
||||
description="Kind thoughts shared to brighten your day."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Commonly Asked"
|
||||
description="Getting started with your sanctuary."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-meditating-mans-hands-barefoot-man-sitting-lotus-pose-with-smoke-around-making-sign-with-fingers-hobby-spirituality-health-concept_74855-23557.jpg?_wi=3"
|
||||
mediaAnimation="slide-up"
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How do I start?",
|
||||
content: "Just explore the site and take a deep breath.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Is it free?",
|
||||
content: "Yes, everything here is free and open to everyone.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Stay Calm",
|
||||
items: [
|
||||
{
|
||||
label: "Breathe",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Rest",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Connect",
|
||||
items: [
|
||||
{
|
||||
label: "Love",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Support",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 | Built with Love"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{ title: "Stay Calm", items: [{ label: "Breathe", href: "#" }, { label: "Rest", href: "#" }] },
|
||||
{ title: "Connect", items: [{ label: "Love", href: "#" }, { label: "Support", href: "#" }] }
|
||||
]}
|
||||
copyrightText="© 2025 | Built with Love"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user