Merge version_1 into main

Merge version_1 into main
This commit was merged in pull request #2.
This commit is contained in:
2026-03-26 12:34:23 +00:00

View File

@@ -26,205 +26,103 @@ export default function LandingPage() {
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "About",
id: "about",
},
{
name: "Classes",
id: "features",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Bella Dance Club"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Classes", id: "features" },
{ name: "Contact", id: "contact" },
]}
brandName="Bella Dance Club"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardGallery
background={{
variant: "gradient-bars",
}}
title="Move with Bella"
description="Experience the rhythm, ignite your passion, and join our vibrant community of dancers at Bella Dance Club."
tag="Join Now"
buttons={[
{
text: "View Classes",
href: "#features",
},
]}
mediaItems={[
{
imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg?_wi=1",
imageAlt: "Dynamic dance performance",
},
{
imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg?_wi=2",
imageAlt: "Dancers in studio",
},
{
imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg?_wi=3",
imageAlt: "Dance club energy",
},
{
imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg?_wi=4",
imageAlt: "Contemporary dance",
},
{
imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg?_wi=5",
imageAlt: "Studio atmosphere",
},
{
imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg?_wi=6",
imageAlt: "Movement and grace",
},
]}
mediaAnimation="slide-up"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardGallery
background={{ variant: "gradient-bars" }}
title="Move with Bella"
description="Experience the rhythm, ignite your passion, and join our vibrant community of dancers at Bella Dance Club."
tag="Join Now"
buttons={[{ text: "View Classes", href: "#features" }]}
mediaItems={[
{ imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg", imageAlt: "Dynamic dance performance" },
{ imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg", imageAlt: "Dancers in studio" },
{ imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg", imageAlt: "Dance club energy" },
{ imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg", imageAlt: "Contemporary dance" },
{ imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg", imageAlt: "Studio atmosphere" },
{ imageSrc: "https://pixabay.com/get/gdd39e26e01e48180a81a72bd9d3f45b43197f678223f76393290569a89d1c6dda93eb77ba37d1f91122b43b47499296c7428a1ccc0ef6b4cc3ed4e512d43ff1b_1280.jpg", imageAlt: "Movement and grace" },
]}
mediaAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={false}
title="Where Movement Meets Community"
description="At Bella, we believe that dance is for everyone. From professional training to casual fun, our expert instructors are here to guide you every step of the way in our inclusive, high-energy environment."
imageSrc="https://pixabay.com/get/gfdade2b383f8d6bb676c1fe0c5981ae68fc74a38fecb5b192ca1a295cd5bc3c01b199204dfd2a7134953b0b635c978bb4577ba13b215969a7a010e64f954cf63_1280.jpg"
imageAlt="Our beautiful dance studio"
/>
</div>
<div id="about" data-section="about">
<MediaAbout
useInvertedBackground={false}
title="Where Movement Meets Community"
description="At Bella, we believe that dance is for everyone. From professional training to casual fun, our expert instructors are here to guide you every step of the way in our inclusive, high-energy environment."
imageSrc="https://pixabay.com/get/gfdade2b383f8d6bb676c1fe0c5981ae68fc74a38fecb5b192ca1a295cd5bc3c01b199204dfd2a7134953b0b635c978bb4577ba13b215969a7a010e64f954cf63_1280.jpg"
imageAlt="Our beautiful dance studio"
/>
</div>
<div id="features" data-section="features">
<FeatureBento
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: 1,
title: "Salsa & Latin",
description: "Feel the heat with rhythmic salsa, bachata, and merengue classes.",
imageSrc: "https://pixabay.com/get/g1a59710add2d5947b68708d9553c90cb1db16f88465cb63c9858e7c8ef573c2828b2b5626e1ed34069cd1ba5740d975efa228c2d483eee6bfefe3d1c195d89a8_1280.jpg",
},
{
id: 2,
title: "Classical Ballet",
description: "Master grace and technique with our foundational ballet workshops.",
imageSrc: "https://pixabay.com/get/gc8ad6ffb0965ba2615d8c7e347e12d4ffebb2c03f11f0d63981660e48c22d38f3a60367a345ec0adfb0da544956ef446243334a1f5c267ab3d8eaacc798a3c77_1280.jpg",
},
{
id: 3,
title: "Urban & Hip Hop",
description: "Learn the latest moves with our high-energy urban dance sessions.",
imageSrc: "https://pixabay.com/get/g5e6324a489f7ca2deb065d53258830379a0e4578f32f2fde17fea04c37fcd3fc544f2803e4c2abb15b1457c1d4bb2d5f4c3d8460b4f5387e260ea17451bca4d1_1280.jpg",
},
]}
title="Classes Designed for You"
description="Explore our diverse range of dance styles tailored for all skill levels and ages."
/>
</div>
<div id="features" data-section="features">
<FeatureBento
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{ title: "Salsa & Latin", description: "Feel the heat with rhythmic salsa, bachata, and merengue classes.", imageSrc: "https://pixabay.com/get/g1a59710add2d5947b68708d9553c90cb1db16f88465cb63c9858e7c8ef573c2828b2b5626e1ed34069cd1ba5740d975efa228c2d483eee6bfefe3d1c195d89a8_1280.jpg" },
{ title: "Classical Ballet", description: "Master grace and technique with our foundational ballet workshops.", imageSrc: "https://pixabay.com/get/gc8ad6ffb0965ba2615d8c7e347e12d4ffebb2c03f11f0d63981660e48c22d38f3a60367a345ec0adfb0da544956ef446243334a1f5c267ab3d8eaacc798a3c77_1280.jpg" },
{ title: "Urban & Hip Hop", description: "Learn the latest moves with our high-energy urban dance sessions.", imageSrc: "https://pixabay.com/get/g5e6324a489f7ca2deb065d53258830379a0e4578f32f2fde17fea04c37fcd3fc544f2803e4c2abb15b1457c1d4bb2d5f4c3d8460b4f5387e260ea17451bca4d1_1280.jpg" },
]}
title="Classes Designed for You"
description="Explore our diverse range of dance styles tailored for all skill levels and ages."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1",
title: "Life-Changing",
quote: "Bella has transformed how I move and feel. The energy is simply unmatched.",
name: "Sarah Miller",
role: "Student",
imageSrc: "https://pixabay.com/get/g255f351bc28fa98829cfa47cb80ef187254b8d9f03435694b6b39e67e3397d3336bf95c6e5cba2452c21d6c1743a47b639faeee61509456748d25d2484e3f9f1_1280.jpg",
},
{
id: "2",
title: "Expert Guidance",
quote: "The instructors are so patient and talented. I've learned more in 3 months than years elsewhere.",
name: "David Chan",
role: "Member",
imageSrc: "https://pixabay.com/get/g556007905e568cab583073c4a7f78a6d1b306e74c26b3daf4bc1116add5f22d61acba6fe76e81d0981a640e7b12e28656d9b17e15cac32ef77e5d22566b96356_1280.jpg",
},
{
id: "3",
title: "Such Fun",
quote: "I look forward to my salsa class every single week. It's the highlight of my schedule!",
name: "Emily Rose",
role: "Beginner",
imageSrc: "https://pixabay.com/get/g30b85544958a90b5cc71d354cdd99a1d691bee7011754a956fd33418a9747ca09b8ff884c770c9e7a98b034b2e8de38da670805ab2403e19c616cc96dfad92ac_1280.jpg",
},
{
id: "4",
title: "Welcoming Vibe",
quote: "A truly inclusive space where everyone is supportive regardless of their level.",
name: "Elena V.",
role: "Pro",
imageSrc: "https://pixabay.com/get/gc4b5535a5489cd8a1cd10c85b5faf42c42555f80890fe18a6f15dcc75b9647e2a5a8beb82e16321eaaafeb3fe0ce6d4672bf661b342a17bbea690fa110d1918c_1280.jpg",
},
]}
title="What Our Dancers Say"
description="Join hundreds of happy members who have found their rhythm at Bella."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{ id: "1", title: "Life-Changing", quote: "Bella has transformed how I move and feel. The energy is simply unmatched.", name: "Sarah Miller", role: "Student", imageSrc: "https://pixabay.com/get/g255f351bc28fa98829cfa47cb80ef187254b8d9f03435694b6b39e67e3397d3336bf95c6e5cba2452c21d6c1743a47b639faeee61509456748d25d2484e3f9f1_1280.jpg" },
{ id: "2", title: "Expert Guidance", quote: "The instructors are so patient and talented. I've learned more in 3 months than years elsewhere.", name: "David Chan", role: "Member", imageSrc: "https://pixabay.com/get/g556007905e568cab583073c4a7f78a6d1b306e74c26b3daf4bc1116add5f22d61acba6fe76e81d0981a640e7b12e28656d9b17e15cac32ef77e5d22566b96356_1280.jpg" },
{ id: "3", title: "Such Fun", quote: "I look forward to my salsa class every single week. It's the highlight of my schedule!", name: "Emily Rose", role: "Beginner", imageSrc: "https://pixabay.com/get/g30b85544958a90b5cc71d354cdd99a1d691bee7011754a956fd33418a9747ca09b8ff884c770c9e7a98b034b2e8de38da670805ab2403e19c616cc96dfad92ac_1280.jpg" },
{ id: "4", title: "Welcoming Vibe", quote: "A truly inclusive space where everyone is supportive regardless of their level.", name: "Elena V.", role: "Pro", imageSrc: "https://pixabay.com/get/gc4b5535a5489cd8a1cd10c85b5faf42c42555f80890fe18a6f15dcc75b9647e2a5a8beb82e16321eaaafeb3fe0ce6d4672bf661b342a17bbea690fa110d1918c_1280.jpg" },
]}
title="What Our Dancers Say"
description="Join hundreds of happy members who have found their rhythm at Bella."
/>
</div>
<div id="contact" data-section="contact">
<ContactFaq
animationType="slide-up"
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "Do I need experience?",
content: "Absolutely not! We offer classes for all levels from complete beginners.",
},
{
id: "f2",
title: "What should I wear?",
content: "Comfortable clothes you can move in and appropriate dance shoes.",
},
{
id: "f3",
title: "Can I book a trial?",
content: "Yes, your first trial class is always complimentary.",
},
]}
ctaTitle="Ready to Start Dancing?"
ctaDescription="Get in touch for class schedules, trial sessions, and membership details."
ctaButton={{
text: "Contact Us",
}}
ctaIcon={MessageCircle}
/>
</div>
<div id="contact" data-section="contact">
<ContactFaq
animationType="slide-up"
useInvertedBackground={false}
faqs={[
{ id: "f1", title: "Do I need experience?", content: "Absolutely not! We offer classes for all levels from complete beginners." },
{ id: "f2", title: "What should I wear?", content: "Comfortable clothes you can move in and appropriate dance shoes." },
{ id: "f3", title: "Can I book a trial?", content: "Yes, your first trial class is always complimentary." },
]}
ctaTitle="Ready to Start Dancing?"
ctaDescription="Get in touch for class schedules, trial sessions, and membership details."
ctaButton={{ text: "Contact Us" }}
ctaIcon={MessageCircle}
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Bella Dance Club"
copyrightText="© 2025 Bella Dance Club. All rights reserved."
socialLinks={[
{
icon: Instagram,
href: "#",
ariaLabel: "Instagram",
},
{
icon: Facebook,
href: "#",
ariaLabel: "Facebook",
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Bella Dance Club"
copyrightText="© 2025 Bella Dance Club. All rights reserved."
socialLinks={[
{ icon: Instagram, href: "#", ariaLabel: "Instagram" },
{ icon: Facebook, href: "#", ariaLabel: "Facebook" },
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);