Add src/app/home/page.tsx
This commit is contained in:
204
src/app/home/page.tsx
Normal file
204
src/app/home/page.tsx
Normal file
@@ -0,0 +1,204 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import HeroLogo from '@/components/sections/hero/HeroLogo';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TeamCardFive from '@/components/sections/team/TeamCardFive';
|
||||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
||||
import { Heart } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="noiseDiagonalGradient"
|
||||
cardStyle="subtle-shadow"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "/home"},
|
||||
{
|
||||
name: "Our Story", id: "#our-story"},
|
||||
{
|
||||
name: "Details", id: "#details"},
|
||||
{
|
||||
name: "Wedding Party", id: "#wedding-party"},
|
||||
{
|
||||
name: "RSVP", id: "#rsvp"},
|
||||
]}
|
||||
brandName="Our Wedding"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="home" data-section="home">
|
||||
<HeroLogo
|
||||
logoText="You're Invited"
|
||||
description="Join us as we say 'I do'"
|
||||
buttons={[
|
||||
{
|
||||
text: "Open Invitation", href: "#our-story"},
|
||||
{
|
||||
text: "Our Story", href: "#our-story"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-angle-wedding-paper-envelope-with-seal-ribbon_23-2149374605.jpg"
|
||||
imageAlt="Realistic wedding invitation envelope with a wax seal"
|
||||
showDimOverlay={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="our-story" data-section="our-story">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="Our Journey"
|
||||
title="Two Hearts, One Journey"
|
||||
description="From our first meeting to this joyous day, our love story has unfolded beautifully. We can't wait to start our next chapter with you by our side, surrounded by our dearest friends and family."
|
||||
subdescription="We are thrilled to invite you to celebrate our union and witness the beginning of our forever."
|
||||
icon={Heart}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/caring-family-walking-beach-sunset-man-woman-casual-clothes-strolling-near-water-dusk-love-family-nature-concept_74855-22809.jpg"
|
||||
imageAlt="A romantic couple holding hands"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="details" data-section="details">
|
||||
<FeatureCardMedia
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "ceremony", title: "The Ceremony", description: "Join us as we exchange vows and begin our married life together. A heartfelt celebration of love and commitment.", tag: "4:00 PM | October 26, 2024", imageSrc: "http://img.b2bpic.net/free-photo/table-prepared-with-champagne-glasses_1157-335.jpg", imageAlt: "Elegant wedding ceremony setup"},
|
||||
{
|
||||
id: "reception", title: "The Reception", description: "Celebrate with us at an evening of dining, dancing, and joyous festivities. Enjoy delicious food and great company.", tag: "6:00 PM | October 26, 2024", imageSrc: "http://img.b2bpic.net/free-photo/wedding-cake-cakestand-decorated-with-white-flower-bouquet_23-2147975459.jpg", imageAlt: "Beautiful multi-tiered wedding cake"},
|
||||
{
|
||||
id: "gifts", title: "Gifts & Well Wishes", description: "Your presence is our greatest gift. Should you wish to honor us with a gift, a contribution towards our future would be warmly appreciated.", tag: "Registry & Donations", imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-golden-wedding-rings-attached-brown-heart-shaped-textile_181624-33810.jpg", imageAlt: "Diamond wedding rings"},
|
||||
]}
|
||||
title="Key Event Details"
|
||||
description="Everything you need to know about our special day."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="wedding-party" data-section="wedding-party">
|
||||
<TeamCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
team={[
|
||||
{
|
||||
id: "moh", name: "Sarah Smith", role: "Maid of Honor", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-female-dentist-standing-dental-office_651396-3401.jpg", imageAlt: "Maid of Honor"},
|
||||
{
|
||||
id: "bm", name: "David Johnson", role: "Best Man", imageSrc: "http://img.b2bpic.net/free-photo/three-men-suits-posing-garden_1153-2773.jpg", imageAlt: "Best Man"},
|
||||
{
|
||||
id: "bm1", name: "Emily White", role: "Bridesmaid", imageSrc: "http://img.b2bpic.net/free-photo/carefree-joyful-charming-cheeky-blond-woman-party-all-night-long-have-fun-smiling-happily-enjoying-awesome-evening-nightclub-dancing-silver-stylish-dress-winking-sassy-camera-red-background_1258-308174.jpg", imageAlt: "Bridesmaid Emily White"},
|
||||
{
|
||||
id: "gm1", name: "Michael Brown", role: "Groomsman", imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-bearded-male-dressed-blue-shirt-white-jacket-bow-tie-grey-background_613910-179.jpg", imageAlt: "Groomsman Michael Brown"},
|
||||
]}
|
||||
title="Our Beloved Wedding Party"
|
||||
description="Meet the wonderful people supporting us on our big day, our closest friends and family."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="love-wisdom" data-section="love-wisdom">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1", name: "Eleanor & Richard Vance", role: "Grandparents", company: "Family", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-senior-couple_23-2149071648.jpg", imageAlt: "Elderly couple smiling"},
|
||||
{
|
||||
id: "t2", name: "Jessica & Mark Chen", role: "Friends", company: "Couple Friends", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-people-having-fun_23-2149832975.jpg", imageAlt: "Young couple hugging"},
|
||||
{
|
||||
id: "t3", name: "The Miller Family", role: "Neighbors", company: "Community", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/afroamerican-man-hugging-friends-front-view_23-2148422460.jpg", imageAlt: "Diverse group of friends"},
|
||||
{
|
||||
id: "t4", name: "Uncle John & Aunt Mary", role: "Family", company: "Family", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mother-with-daughter-playing-summer-field_1157-38723.jpg", imageAlt: "Happy family embracing"},
|
||||
{
|
||||
id: "t5", name: "Sophia Rodriguez", role: "Colleague", company: "Work", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/prenatal-yoga-cobbler-pose_1163-1479.jpg", imageAlt: "Woman reading a book"},
|
||||
]}
|
||||
title="Words of Love & Wisdom"
|
||||
description="Inspiring thoughts and heartfelt wishes from those who know the true meaning of love."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="special-thanks" data-section="special-thanks">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Capturing Memories Photography", "Gourmet Catering Co.", "The Grand Ballroom Venue", "Elegant Events Planner", "Bloom & Petal Florists", "Melody Makers DJ", "Dream Dress Boutique", "Sweet Delights Bakery"]}
|
||||
title="Special Thanks"
|
||||
description="Our heartfelt gratitude to those helping make our day perfect and memorable."
|
||||
speed={35}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "faq1", title: "What is the dress code?", content: "The dress code is formal attire. We kindly request that guests avoid wearing white or ivory to ensure the bride stands out."},
|
||||
{
|
||||
id: "faq2", title: "Is there parking available at the venue?", content: "Yes, ample parking is available at the venue. Valet service will also be provided for your convenience."},
|
||||
{
|
||||
id: "faq3", title: "Can I bring a plus-one?", content: "We have reserved a seat for you and kindly request that you adhere to the invitation's specified guest count. If you have any questions, please contact us directly."},
|
||||
{
|
||||
id: "faq4", title: "What about accommodations?", content: "We have reserved a block of rooms at the Grand Hotel with a special rate. Please check our website's 'Details' section for more information and booking instructions."},
|
||||
]}
|
||||
sideTitle="Your Questions, Answered"
|
||||
sideDescription="Find answers to common inquiries about our wedding day, attire, and more."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="rsvp" data-section="rsvp">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient"}}
|
||||
tag="We Can't Wait!"
|
||||
title="RSVP to Our Celebration"
|
||||
description="Kindly let us know if you can join us by September 26, 2024, so we can finalize our arrangements. Your presence means the world to us."
|
||||
buttons={[
|
||||
{
|
||||
text: "RSVP Now", href: "#"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Forever & Always"
|
||||
leftLink={{
|
||||
text: "Privacy Policy", href: "#"}}
|
||||
rightLink={{
|
||||
text: "Terms of Service", href: "#"}}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user