Merge version_1 into main #2
399
src/app/page.tsx
399
src/app/page.tsx
@@ -1,331 +1,86 @@
|
||||
"use client";
|
||||
'use client';
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import { Phone } from "lucide-react";
|
||||
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import { Phone } from 'lucide-react';
|
||||
|
||||
export default function LandingPage() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" }
|
||||
];
|
||||
|
||||
export default function Page() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="rounded"
|
||||
contentWidth="smallMedium"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="circleGradient"
|
||||
cardStyle="gradient-mesh"
|
||||
primaryButtonStyle="radial-glow"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "The Vibe",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Menu",
|
||||
id: "menu",
|
||||
},
|
||||
{
|
||||
name: "Reservations",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Vibes on Main"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
title="Johannesburg’s Most Addictive Vibe"
|
||||
description="Where music, food, and energy come together. From sunset brunches to late-night Amapiano — this is where Joburg comes alive."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your Table",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "See What’s Happening",
|
||||
href: "#events",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/bar-tender-sprinkles-golden-glitter-into-cocktail-champagne-glass_141793-2004.jpg?_wi=1"
|
||||
imageAlt="Crowd dancing at Vibes on Main"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/people-having-fun-vibrant-techno-music-party_23-2150551551.jpg",
|
||||
alt: "Guest 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/happy-young-businessman-walking-near-business-center_171337-19784.jpg",
|
||||
alt: "Guest 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-friends-with-delicious-cocktails_23-2150166137.jpg",
|
||||
alt: "Guest 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/bartender-making-cocktail_23-2147680619.jpg",
|
||||
alt: "Guest 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/people-having-fun-vibrant-techno-music-party_23-2150551551.jpg",
|
||||
alt: "Guest 5",
|
||||
},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "AMAPIANO NIGHTS",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "SUNSET BRUNCH",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "SIGNATURE COCKTAILS",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "VIP EXPERIENCE",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "GOURMET DINING",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="It’s Not Just a Night Out. It’s a Ritual."
|
||||
description="Step into a space where the music hits right, the crowd feels right, and every night turns into a story worth telling. Whether you're here for a chilled Monday, a buzzing Friday, or a legendary Sunday buffet — Vibes on Main delivers every time."
|
||||
metrics={[
|
||||
{
|
||||
value: "7 Days",
|
||||
title: "A Week",
|
||||
},
|
||||
{
|
||||
value: "100%",
|
||||
title: "Energy",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/abstract-blur-coffee-shop_1339-2395.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="menu" data-section="menu">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Signature",
|
||||
name: "Sunday Buffet",
|
||||
price: "R350",
|
||||
rating: 5,
|
||||
reviewCount: "1.2k",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/delicious-french-breakfast-top-view_23-2150408545.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Bar",
|
||||
name: "Craft Cocktails",
|
||||
price: "R120",
|
||||
rating: 5,
|
||||
reviewCount: "850",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-alcoholic-cocktail-manhattan-with-bourbon-red-vemuth-bitter-ice-cocktail-cherry-glass_141793-3048.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Chef",
|
||||
name: "Friday Special",
|
||||
price: "R280",
|
||||
rating: 4,
|
||||
reviewCount: "500",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/buffet-heated-trays_1398-2223.jpg?_wi=1",
|
||||
},
|
||||
]}
|
||||
title="Come Hungry. Leave Obsessed."
|
||||
description="From crowd-favorite buffets to curated dishes and signature cocktails — every bite and sip is part of the experience."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Johnson",
|
||||
date: "Oct 2024",
|
||||
title: "Regular Guest",
|
||||
quote: "One of the top nightlife spots in Johannesburg. The energy is unmatched.",
|
||||
tag: "Top Rated",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/people-having-fun-vibrant-techno-music-party_23-2150551551.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bar-tender-sprinkles-golden-glitter-into-cocktail-champagne-glass_141793-2004.jpg?_wi=2",
|
||||
imageAlt: "luxury nightlife dance floor energy",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael Chen",
|
||||
date: "Sep 2024",
|
||||
title: "Foodie",
|
||||
quote: "Sunday buffet was too good — and the vibes were vibing!",
|
||||
tag: "Foodie",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/happy-young-businessman-walking-near-business-center_171337-19784.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-blur-coffee-shop_1339-2395.jpg?_wi=2",
|
||||
imageAlt: "upscale outdoor garden restaurant seating",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily Rodriguez",
|
||||
date: "Aug 2024",
|
||||
title: "Frequent Visitor",
|
||||
quote: "Great music, beautiful space, and such a chilled atmosphere.",
|
||||
tag: "Vibes",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-friends-with-delicious-cocktails_23-2150166137.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/delicious-french-breakfast-top-view_23-2150408545.jpg?_wi=2",
|
||||
imageAlt: "gourmet dining platter presentation",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Kim",
|
||||
date: "July 2024",
|
||||
title: "Nightlife Lover",
|
||||
quote: "Definitely my go-to place whenever I’m in Joburg.",
|
||||
tag: "Must Visit",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/bartender-making-cocktail_23-2147680619.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-alcoholic-cocktail-manhattan-with-bourbon-red-vemuth-bitter-ice-cocktail-cherry-glass_141793-3048.jpg?_wi=2",
|
||||
imageAlt: "signature cocktail bar drink",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Zanele M.",
|
||||
date: "June 2024",
|
||||
title: "VIP Guest",
|
||||
quote: "The most exclusive spot in the city. Always a great time.",
|
||||
tag: "VIP",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/people-having-fun-vibrant-techno-music-party_23-2150551551.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/buffet-heated-trays_1398-2223.jpg?_wi=2",
|
||||
imageAlt: "bistro buffet serving station",
|
||||
},
|
||||
]}
|
||||
title="Real People. Real Vibes."
|
||||
description="Don't take our word for it."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactFaq
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Do you accept walk-ins?",
|
||||
content: "While we accept walk-ins, reservations are highly recommended, especially on Fridays and Sundays.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Is the venue safe?",
|
||||
content: "We prioritize safety with professional security teams and a curated guest list.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Do you host private events?",
|
||||
content: "Yes, we offer custom packages for private parties and corporate events.",
|
||||
},
|
||||
]}
|
||||
ctaTitle="Reserve Your Table Now"
|
||||
ctaDescription="Join the cultural heartbeat of Johannesburg. Limited seating available every weekend."
|
||||
ctaButton={{
|
||||
text: "Book via WhatsApp",
|
||||
href: "https://wa.me/27123456789",
|
||||
}}
|
||||
ctaIcon={Phone}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Vibes on Main"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "The Vibe",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Menu",
|
||||
href: "#menu",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Connect",
|
||||
items: [
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "https://instagram.com",
|
||||
},
|
||||
{
|
||||
label: "WhatsApp",
|
||||
href: "https://wa.me/27123456789",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 Vibes on Main. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
<ThemeProvider>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered navItems={navItems} brandName="Vibes on Main" />
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Johannesburg’s Most Addictive Vibe"
|
||||
description="Where music, food, and energy come together. From sunset brunches to late-night Amapiano — this is where Joburg comes alive."
|
||||
buttons={[{ text: "Book Your Table", href: "#contact" }, { text: "See What’s Happening", href: "#events" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/bar-tender-sprinkles-golden-glitter-into-cocktail-champagne-glass_141793-2004.jpg"
|
||||
imageAlt="Crowd dancing at Vibes on Main"
|
||||
avatars={[{ src: "http://img.b2bpic.net/free-photo/people-having-fun-vibrant-techno-music-party_23-2150551551.jpg", alt: "Guest 1" }, { src: "http://img.b2bpic.net/free-photo/happy-young-businessman-walking-near-business-center_171337-19784.jpg", alt: "Guest 2" }, { src: "http://img.b2bpic.net/free-photo/medium-shot-friends-with-delicious-cocktails_23-2150166137.jpg", alt: "Guest 3" }, { src: "http://img.b2bpic.net/free-photo/bartender-making-cocktail_23-2147680619.jpg", alt: "Guest 4" }, { src: "http://img.b2bpic.net/free-photo/people-having-fun-vibrant-techno-music-party_23-2150551551.jpg", alt: "Guest 5" }]}
|
||||
marqueeItems={[{ type: "text", text: "AMAPIANO NIGHTS" }, { type: "text", text: "SUNSET BRUNCH" }, { type: "text", text: "SIGNATURE COCKTAILS" }, { type: "text", text: "VIP EXPERIENCE" }, { type: "text", text: "GOURMET DINING" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="It’s Not Just a Night Out. It’s a Ritual."
|
||||
description="Step into a space where the music hits right, the crowd feels right, and every night turns into a story worth telling. Whether you're here for a chilled Monday, a buzzing Friday, or a legendary Sunday buffet — Vibes on Main delivers every time."
|
||||
metrics={[{ value: "7 Days", title: "A Week" }, { value: "100%", title: "Energy" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/abstract-blur-coffee-shop_1339-2395.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="menu" data-section="menu">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[{ id: "1", brand: "Signature", name: "Sunday Buffet", price: "R350", rating: 5, reviewCount: "1.2k", imageSrc: "http://img.b2bpic.net/free-photo/delicious-french-breakfast-top-view_23-2150408545.jpg" }, { id: "2", brand: "Bar", name: "Craft Cocktails", price: "R120", rating: 5, reviewCount: "850", imageSrc: "http://img.b2bpic.net/free-photo/side-view-alcoholic-cocktail-manhattan-with-bourbon-red-vemuth-bitter-ice-cocktail-cherry-glass_141793-3048.jpg" }, { id: "3", brand: "Chef", name: "Friday Special", price: "R280", rating: 4, reviewCount: "500", imageSrc: "http://img.b2bpic.net/free-photo/buffet-heated-trays_1398-2223.jpg" }]}
|
||||
title="Come Hungry. Leave Obsessed."
|
||||
description="From crowd-favorite buffets to curated dishes and signature cocktails — every bite and sip is part of the experience."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[{ id: "1", name: "Sarah Johnson", date: "Oct 2024", title: "Regular Guest", quote: "One of the top nightlife spots in Johannesburg. The energy is unmatched.", tag: "Top Rated", avatarSrc: "http://img.b2bpic.net/free-photo/people-having-fun-vibrant-techno-music-party_23-2150551551.jpg" }, { id: "2", name: "Michael Chen", date: "Sep 2024", title: "Foodie", quote: "Sunday buffet was too good — and the vibes were vibing!", tag: "Foodie", avatarSrc: "http://img.b2bpic.net/free-photo/happy-young-businessman-walking-near-business-center_171337-19784.jpg" }, { id: "3", name: "Emily Rodriguez", date: "Aug 2024", title: "Frequent Visitor", quote: "Great music, beautiful space, and such a chilled atmosphere.", tag: "Vibes", avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-friends-with-delicious-cocktails_23-2150166137.jpg" }, { id: "4", name: "David Kim", date: "July 2024", title: "Nightlife Lover", quote: "Definitely my go-to place whenever I’m in Joburg.", tag: "Must Visit", avatarSrc: "http://img.b2bpic.net/free-photo/bartender-making-cocktail_23-2147680619.jpg" }, { id: "5", name: "Zanele M.", date: "June 2024", title: "VIP Guest", quote: "The most exclusive spot in the city. Always a great time.", tag: "VIP", avatarSrc: "http://img.b2bpic.net/free-photo/people-having-fun-vibrant-techno-music-party_23-2150551551.jpg" }]}
|
||||
title="Real People. Real Vibes."
|
||||
description="Don't take our word for it."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactFaq
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
faqs={[{ id: "1", title: "Do you accept walk-ins?", content: "While we accept walk-ins, reservations are highly recommended, especially on Fridays and Sundays." }, { id: "2", title: "Is the venue safe?", content: "We prioritize safety with professional security teams and a curated guest list." }, { id: "3", title: "Do you host private events?", content: "Yes, we offer custom packages for private parties and corporate events." }]}
|
||||
ctaTitle="Reserve Your Table Now"
|
||||
ctaDescription="Join the cultural heartbeat of Johannesburg. Limited seating available every weekend."
|
||||
ctaButton={{ text: "Book via WhatsApp", href: "https://wa.me/27123456789" }}
|
||||
ctaIcon={Phone}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Vibes on Main"
|
||||
columns={[{ title: "Navigation", items: [{ label: "Home", href: "#hero" }, { label: "The Vibe", href: "#about" }, { label: "Menu", href: "#menu" }] }, { title: "Connect", items: [{ label: "Instagram", href: "https://instagram.com" }, { label: "WhatsApp", href: "https://wa.me/27123456789" }] }, { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }]}
|
||||
copyrightText="© 2025 Vibes on Main. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user