160 lines
12 KiB
TypeScript
160 lines
12 KiB
TypeScript
"use client";
|
|
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
|
|
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
|
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import { Sparkles, MapPin, CalendarCheck2, Heart, Utensils, Music, Instagram, Facebook } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="icon-arrow"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="pill"
|
|
contentWidth="compact"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="floatingGradient"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="diagonal-gradient"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
brandName="Ala & Zulaykha"
|
|
navItems={[
|
|
{ name: "Home", id: "#hero" },
|
|
{ name: "Countdown", id: "#countdown" },
|
|
{ name: "Details", id: "#details" },
|
|
{ name: "Timeline", id: "#timeline" },
|
|
{ name: "RSVP", id: "#rsvp" },
|
|
{ name: "FAQ", id: "#faq" },
|
|
{ name: "Love Stories", id: "#testimonials" }
|
|
]}
|
|
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vsnnrh"
|
|
logoAlt="Ala & Zulaykha logo"
|
|
button={{ text: "RSVP Now", href: "#rsvp" }}
|
|
/>
|
|
</div>
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardGallery
|
|
title="Ala & Zulaykha (علاء و زليخة)"
|
|
description="This invitation is exclusive for you. Get ready to celebrate our union."
|
|
background={{ variant: "plain" }}
|
|
buttons={[{ text: "RSVP Now", href: "#rsvp" }]}
|
|
mediaItems={[
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/golden-shimmering-leaf-pink_53876-95589.jpg", imageAlt: "Luxury wedding invitation sealed envelope with wax seal" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-frame-with-tulips-copy-space_23-2148440246.jpg", imageAlt: "Soft pastel pink and rose-gold floral background" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/marble-textured-backdrop-frame_53876-90131.jpg", imageAlt: "Elegant romantic floral background with delicate arrangements" }
|
|
]}
|
|
mediaAnimation="opacity"
|
|
ariaLabel="Wedding Invitation Hero Section"
|
|
tag="You're Invited"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="hover-magnetic"
|
|
buttonAnimation="hover-magnetic"
|
|
/>
|
|
</div>
|
|
<div id="countdown" data-section="countdown">
|
|
<MetricCardEleven
|
|
title="The Grand Celebration Begins In"
|
|
description="Join us as we count down to our special day. Every moment brings us closer to a lifetime of happiness."
|
|
metrics={[
|
|
{ id: "days", value: "00", title: "Days", description: "Days remaining until our wedding.", imageSrc: "http://img.b2bpic.net/free-photo/love-text-made-with-pink-rose-buds-white-backdrop_23-2147893899.jpg", imageAlt: "Days icon" },
|
|
{ id: "hours", value: "00", title: "Hours", description: "Hours left to the joyous event.", imageSrc: "http://img.b2bpic.net/free-photo/8-march-inscription-wooden-blocks-with-flower-lipstick_23-2148055092.jpg", imageAlt: "Hours icon" },
|
|
{ id: "minutes", value: "00", title: "Minutes", description: "Minutes ticking away to our union.", imageSrc: "http://img.b2bpic.net/free-photo/wonderful-red-flowers-green-leaves-form-circle_23-2148025899.jpg", imageAlt: "Minutes icon" },
|
|
{ id: "seconds", value: "00", title: "Seconds", description: "Seconds until forever begins.", imageSrc: "http://img.b2bpic.net/free-photo/march-8-women-s-day-card-with-white-flowers-sweets-cup-tea_114579-7485.jpg", imageAlt: "Seconds icon" }
|
|
]}
|
|
animationType="slide-up"
|
|
useInvertedBackground={true}
|
|
textboxLayout="default"
|
|
/>
|
|
</div>
|
|
<div id="details" data-section="details">
|
|
<FeatureCardTwentySix
|
|
title="Wedding Details (تفاصيل يوم الفرح)"
|
|
description="Find your way to our celebration and save the date. We can't wait to share our special moments with you."
|
|
features={[
|
|
{ title: "Our Sacred Venue", description: "Our ceremony and reception will be held at a beautiful location that holds a special place in our hearts. We look forward to celebrating with you there.", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-wedding-table-number-with-flowers_23-2149446381.jpg", imageAlt: "Wedding venue map with custom pin", buttonIcon: MapPin, buttonHref: "https://www.google.com/maps/search/wedding+venue" },
|
|
{ title: "Save the Date", description: "Mark your calendars! We'd be honored to have you witness our vows and join the festivities. Add our special day to your personal calendar.", imageSrc: "http://img.b2bpic.net/free-photo/valentine-s-day-arrangement-with-wooden-date-decoration_23-2148392039.jpg", imageAlt: "Calendar icon", buttonIcon: CalendarCheck2, buttonHref: "#" }
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<div id="timeline" data-section="timeline">
|
|
<FeatureCardTwentySix
|
|
title="Our Day, Your Journey"
|
|
description="A beautifully orchestrated timeline for our cherished guests, ensuring you don't miss a moment of our joyous celebration."
|
|
features={[
|
|
{ title: "8:30 AM - The Ceremony", description: "Witness the moment we say 'I do' and become husband and wife, surrounded by love.", imageSrc: "http://img.b2bpic.net/free-photo/broken-paper-with-wedding-rings_23-2148542361.jpg", imageAlt: "Wedding rings icon", buttonIcon: Heart },
|
|
{ title: "10:00 AM - Reception & Feast", description: "Join us for a delightful culinary experience and lively conversation after the ceremony.", imageSrc: "http://img.b2bpic.net/free-psd/catering-poster-design_23-2151948483.jpg", imageAlt: "Dining forks icon", buttonIcon: Utensils },
|
|
{ title: "10:30 AM - Dance & Celebration", description: "Dance the night away with us as we celebrate our new journey together, with music and joy.", imageSrc: "http://img.b2bpic.net/free-photo/ribbed-glass-background-with-abstract-waves-glossy-gradient-textures-black-white_474888-8026.jpg", imageAlt: "Music note icon", buttonIcon: Music }
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
<div id="rsvp" data-section="rsvp">
|
|
<ContactText
|
|
text="We eagerly await your response to celebrate our union. Please RSVP by [Date] to confirm your presence and details."
|
|
buttons={[
|
|
{ text: "Confirm Attendance (تأكيد الحضور)", onClick: () => alert('Thank you for your RSVP! We look forward to celebrating with you.') }
|
|
]}
|
|
background={{ variant: "radial-gradient" }}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<div id="faq" data-section="faq">
|
|
<FaqDouble
|
|
title="Your Questions Answered"
|
|
description="Everything you need to know about our special day, from attire to accommodations. If you have further questions, please reach out."
|
|
faqs={[
|
|
{ id: "q1", title: "What is the dress code for the wedding?", content: "The dress code is formal attire. We encourage you to wear elegant evening wear, suits, or traditional cultural attire." },
|
|
{ id: "q2", title: "Are children invited to the wedding?", content: "While we adore your little ones, our wedding will be an adults-only event to allow everyone to fully relax and enjoy the celebration." },
|
|
{ id: "q3", title: "Is there a gift registry?", content: "Your presence is the only gift we require. However, should you wish to honor us with a gift, a contribution towards our honeymoon fund would be greatly appreciated." },
|
|
{ id: "q4", title: "What about transportation and parking?", content: "Valet parking will be available at the venue. For those preferring not to drive, ride-sharing services are readily accessible in the area." }
|
|
]}
|
|
faqsAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSix
|
|
title="Love Shared, Memories Made"
|
|
description="Heartfelt messages from our beloved friends and family, sharing their joy and excitement for our journey together."
|
|
testimonials={[
|
|
{ id: "1", name: "Aisha Rahman", handle: "@AishaJoy", testimonial: "Absolutely thrilled for Ala and Zulaykha! Your love story inspires us all. Wishing you a lifetime of happiness.", imageSrc: "http://img.b2bpic.net/free-photo/young-stylish-laughing-model-colorful-casual-summer-clothes-with-natural-makeup-gray_158538-11793.jpg", imageAlt: "Portrait of Aisha Rahman" },
|
|
{ id: "2", name: "Omar Khalil", handle: "@OmarAdventures", testimonial: "Congratulations to the beautiful couple! So excited to celebrate with you. May your life together be filled with endless blessings.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-women-getting-married_23-2150753673.jpg", imageAlt: "Portrait of Omar Khalil" },
|
|
{ id: "3", name: "Layla Saeed", handle: "@LaylaSunshine", testimonial: "What a magnificent invitation! Your wedding is going to be truly special. Counting down the days to witness your union.", imageSrc: "http://img.b2bpic.net/free-photo/adorable-lovely-woman-fashion-clothes-is-sitting-open-air-cafe-is-using-smartphone-waiting-friends-city-lights-background_291650-842.jpg", imageAlt: "Portrait of Layla Saeed" },
|
|
{ id: "4", name: "Tariq Fahad", handle: "@TariqVision", testimonial: "To Ala and Zulaykha, may your bond grow stronger with each passing day. Honored to be part of your celebration.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background_158538-9662.jpg", imageAlt: "Portrait of Tariq Fahad" },
|
|
{ id: "5", name: "Nadia Hassan", handle: "@NadiaDreams", testimonial: "The love you two share is simply magical. Wishing you an enchanting wedding day and a future full of joy.", imageSrc: "http://img.b2bpic.net/free-photo/woman-with-look-one-side_1139-507.jpg", imageAlt: "Portrait of Nadia Hassan" }
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="Ala & Zulaykha"
|
|
copyrightText="© 2024 Ala & Zulaykha. All Rights Reserved."
|
|
socialLinks={[
|
|
{ icon: Instagram, href: "https://instagram.com/alazul", ariaLabel: "Instagram profile" },
|
|
{ icon: Facebook, href: "https://facebook.com/alazul", ariaLabel: "Facebook profile" }
|
|
]}
|
|
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=vsnnrh"
|
|
logoAlt="Ala & Zulaykha logo"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|