Merge version_1 into main #2
284
src/app/page.tsx
284
src/app/page.tsx
@@ -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>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user