Files
48d89949-c039-4cba-9f97-37d…/src/app/page.tsx
2026-05-14 03:32:22 +00:00

490 lines
16 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import { Award, Building, Gift, Home, Mountain, Palette, Star } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="compact"
sizing="mediumSizeLargeTitles"
background="aurora"
cardStyle="glass-depth"
primaryButtonStyle="double-inset"
secondaryButtonStyle="solid"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "About",
id: "about",
},
{
name: "Services",
id: "services",
},
{
name: "Contact",
id: "contact",
},
]}
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DhHeAOX9VH1cZ4xYEzsgjintVI/uploaded-1778729510700-keh7d3u6.png"
brandName="Kasimba"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitTestimonial
background={{
variant: "gradient-bars",
}}
title="An Intimate Luxury Retreat in Mmokolodi"
description="Where tranquillity, refined hospitality, and curated experiences meet."
testimonials={[
{
name: "Sarah J.",
handle: "@traveler",
testimonial: "The perfect blend of African elegance and modern comfort. A hidden gem in Gaborone.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/restful-man_1098-13861.jpg",
},
{
name: "Mark D.",
handle: "@executive",
testimonial: "Exceptional service and attention to detail. My go-to for corporate retreats.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-adult-having-fun-white-party_23-2149575113.jpg",
},
{
name: "Clara T.",
handle: "@wedding",
testimonial: "Our wedding at Kasimba was truly magical. Everything we dreamed of and more.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-airline-check-attendant-counter_107420-95799.jpg",
},
{
name: "David L.",
handle: "@tourist",
testimonial: "The culinary experience alone makes Kasimba worth the visit.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-female-staff-standing-escalator_107420-63613.jpg",
},
{
name: "Elena R.",
handle: "@local",
testimonial: "A sanctuary right on our doorstep. The service is simply unmatched.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/stylish-friends-sitting-cafe_273609-5476.jpg",
},
]}
buttons={[
{
text: "Book Your Stay",
href: "#contact",
},
{
text: "Explore Experiences",
href: "#services",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/african-american-woman-overalls-beret-posed-outdoor-terrace-with-christmas-decorations-garland-deer_627829-6947.jpg?_wi=1"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/sharming-elegant-young-african-american-woman-with-long-curly-hair-wearing-jumpsuit-posing-cafe-indoor_627829-5678.jpg",
alt: "Guest 1",
},
{
src: "http://img.b2bpic.net/free-photo/bright-lovers-boy-girl-romantic-setting-are-covered-with-warm-striped-blanket_197531-17325.jpg",
alt: "Guest 2",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-rich-woman-reading-indoors_23-2149548577.jpg",
alt: "Guest 3",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-young-woman-wearing-chic-boho-dress-amongst-flowers_23-2150260829.jpg",
alt: "Guest 4",
},
{
src: "http://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-4107.jpg",
alt: "Guest 5",
},
]}
marqueeItems={[
{
type: "text-icon",
text: "World-Class Service",
icon: Star,
},
{
type: "text-icon",
text: "Authentic Design",
icon: Palette,
},
{
type: "text-icon",
text: "Bespoke Dining",
icon: Award,
},
{
type: "text-icon",
text: "Tranquil Setting",
icon: Building,
},
{
type: "text-icon",
text: "Premium Comfort",
icon: Home,
},
]}
/>
</div>
<div id="about" data-section="about">
<AboutMetric
useInvertedBackground={true}
title="Luxury Rooted in Comfort"
metrics={[
{
label: "Rooms",
value: "19",
icon: Home,
},
{
label: "Dining",
value: "24/7",
icon: Award,
},
{
label: "Events",
value: "Custom",
icon: Gift,
},
{
label: "Culture",
value: "Authentic",
icon: Mountain,
},
]}
metricsAnimation="slide-up"
/>
</div>
<div id="services" data-section="services">
<FeatureCardNine
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Culinary Excellence",
description: "Authentic local ingredients crafted into world-class dishes.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/indoor-design-luxury-resort_23-2150497286.jpg",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/interior-design-neoclassical-style-with-furnishings-decor_23-2151199347.jpg",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DhHeAOX9VH1cZ4xYEzsgjintVI/uploaded-1778729510700-keh7d3u6.png?_wi=1",
imageAlt: "luxury boutique room interior",
},
{
title: "Wedding & Events",
description: "A stunning, tranquil venue for your most important moments.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/cozy-lively-home-interior-design_23-2151118924.jpg",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/decorated-interior-christmas-beautiful-christmas-tree-near-modern-expensive-couch-big-clock-with-roman-numbers_132075-6150.jpg",
},
imageSrc: "http://img.b2bpic.net/free-photo/african-american-woman-overalls-beret-posed-outdoor-terrace-with-christmas-decorations-garland-deer_627829-6947.jpg?_wi=2",
imageAlt: "luxury boutique room interior",
},
{
title: "Sunset Cocktails",
description: "Unwind in our bar with a bespoke cocktail as the sun sets.",
phoneOne: {
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-beautiful-comtemporary-luxury-bedroom-suite-hotel-with-tv_105762-2058.jpg",
},
phoneTwo: {
imageSrc: "http://img.b2bpic.net/free-photo/house-plants-by-mattress-floor_53876-105820.jpg",
},
imageSrc: "http://img.b2bpic.net/free-photo/girl-sitting-table-holding-mobile-phone-indoors_171337-17096.jpg?_wi=1",
imageAlt: "luxury boutique room interior",
},
]}
showStepNumbers={false}
title="Our Signature Offerings"
description="Curated experiences designed to elevate your stay."
/>
</div>
<div id="products" data-section="products">
<ProductCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
products={[
{
id: "p1",
brand: "Room",
name: "Deluxe Room",
price: "P675",
rating: 5,
reviewCount: "12",
imageSrc: "http://img.b2bpic.net/free-photo/rendering-elegant-neoclassical-interior_23-2151059692.jpg",
},
{
id: "p2",
brand: "Room",
name: "Executive Room",
price: "P850",
rating: 5,
reviewCount: "18",
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-with-smartphone-vibrator_23-2150232150.jpg",
},
{
id: "p3",
brand: "Room",
name: "Family Room",
price: "P1500",
rating: 5,
reviewCount: "9",
imageSrc: "http://img.b2bpic.net/free-photo/man-playing-with-his-baby-while-wife-reading-book-home_23-2147923036.jpg",
},
{
id: "p4",
brand: "Suite",
name: "Signature Suite",
price: "P2200",
rating: 5,
reviewCount: "5",
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-luxury-bedroom-suite-resort-hotel-with-twin-bed-living_105762-2018.jpg",
},
{
id: "p5",
brand: "Lodge",
name: "Garden Cottage",
price: "P1800",
rating: 5,
reviewCount: "11",
imageSrc: "http://img.b2bpic.net/free-photo/elegant-modern-black-bedroom-with-monstera-leaf-art_23-2151978957.jpg",
},
{
id: "p6",
brand: "Lodge",
name: "Poolside View",
price: "P1200",
rating: 5,
reviewCount: "15",
imageSrc: "http://img.b2bpic.net/free-photo/appealing-girl-with-dark-hairstyle-dressed-shiny-dress-jewelry-is-sitting-kitchen-table-with-closed-eyes-shy-smile_291650-2388.jpg",
},
]}
title="Accommodation"
description="Refined comfort for every traveler."
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardNine
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
plans={[
{
id: "p1",
title: "Romantic Getaway",
price: "P2500",
period: "weekend",
features: [
"Luxury Suite",
"Dinner for two",
"Breakfast inclusive",
],
button: {
text: "Enquire Now",
href: "#contact",
},
imageSrc: "http://img.b2bpic.net/free-photo/cozy-glamping-tent-with-bed-lanterns_23-2151976535.jpg",
imageAlt: "Cozy glamping tent with bed and lanterns",
},
{
id: "p2",
title: "Corporate Retreat",
price: "P5000",
period: "full-day",
features: [
"Conference room",
"Catering included",
"Projector access",
],
button: {
text: "Enquire Now",
href: "#contact",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DhHeAOX9VH1cZ4xYEzsgjintVI/uploaded-1778729510700-keh7d3u6.png?_wi=2",
imageAlt: "Cozy glamping tent with bed and lanterns",
},
{
id: "p3",
title: "Wedding Special",
price: "Custom",
period: "per event",
features: [
"Venue hire",
"Decor planning",
"Executive Suite",
],
button: {
text: "Enquire Now",
href: "#contact",
},
imageSrc: "http://img.b2bpic.net/free-photo/african-american-woman-overalls-beret-posed-outdoor-terrace-with-christmas-decorations-garland-deer_627829-6947.jpg?_wi=3",
imageAlt: "Cozy glamping tent with bed and lanterns",
},
]}
title="Exclusive Packages"
description="Curated stays for the discerning guest."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
testimonials={[
{
id: "1",
name: "Amara Diallo",
role: "Travel Writer",
company: "Global Wander",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/girl-sitting-table-holding-mobile-phone-indoors_171337-17096.jpg?_wi=2",
},
{
id: "2",
name: "Kojo Mensah",
role: "Finance Director",
company: "Capital Bank",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-adult-having-fun-white-party_23-2149575172.jpg",
},
{
id: "3",
name: "Elena & Leo",
role: "Couples",
company: "Private",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-couple-laughing-traveling-summer-by-sea-man-woman-wearing-sunglasses_285396-727.jpg",
},
{
id: "4",
name: "Thomas Wright",
role: "Consultant",
company: "TechStream",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/positive-woman-with-short-hair-bright-lips-glasses-smiling-outside-trendy-lady-black-clothes-posing-stairs_197531-19325.jpg",
},
{
id: "5",
name: "Linda M.",
role: "Tourism Expert",
company: "Expo Tours",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-male-with-his-yellow-bag-preparing-trip-light-blue-wall_140725-89926.jpg",
},
]}
title="Guest Experiences"
description="Our promise of elegance and comfort."
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "Is there parking available?",
content: "Yes, we offer secure, complimentary parking for all our guests.",
},
{
id: "f2",
title: "Do you offer wedding packages?",
content: "Yes, we have bespoke wedding packages available upon request.",
},
{
id: "f3",
title: "Are meals included?",
content: "Breakfast is complimentary with your stay; other meals can be ordered from our restaurant.",
},
{
id: "f4",
title: "Is Wi-Fi free?",
content: "Yes, free high-speed Wi-Fi is provided throughout the hotel.",
},
]}
title="Frequently Asked"
description="Information for your stay at Kasimba."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "rotated-rays-static",
}}
title="Your Boutique Escape Awaits"
description="Contact us for enquiries and reservations."
inputPlaceholder="Your message or enquiry..."
tag="Get in touch"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DhHeAOX9VH1cZ4xYEzsgjintVI/uploaded-1778729510700-keh7d3u6.png"
logoText="Kasimba"
leftLink={{
text: "reservations@simbani.co.bw",
href: "mailto:reservations@simbani.co.bw",
}}
rightLink={{
text: "+267 393 0024",
href: "tel:+2673930024",
}}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}