bender/df739b35-f4ae-418b-b829-ffaff3a2f935
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main #3

Merged
bender merged 4 commits from version_1 into main 2026-03-12 20:14:56 +00:00
Conversation 0 Commits 4 Files Changed 4 +292 -332
4 changed files with 292 additions and 332 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
src/app/gallery/page.tsx
View File

@@ -1,21 +1,13 @@
"use client";
import Link from "next/link";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterCard from '@/components/sections/footer/FooterCard';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import BlogCardOne from "@/components/sections/blog/BlogCardOne";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Facebook, Instagram, Linkedin } from "lucide-react";
import { Image, Facebook, Instagram, Linkedin } from 'lucide-react';
export default function GalleryPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Rooms", id: "/rooms" },
{ name: "Spa", id: "/spa" },
{ name: "Events", id: "/events" },
{ name: "Contact", id: "/contact" },
];
return (
<ThemeProvider
defaultButtonVariant="text-shift"
@@ -23,7 +15,7 @@ export default function GalleryPage() {
borderRadius="rounded"
contentWidth="mediumSmall"
sizing="medium"
background="grid"
background="circleGradient"
cardStyle="solid"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="solid"
@@ -31,70 +23,77 @@ export default function GalleryPage() {
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={navItems}
navItems={[
{ name: 'Home', id: '/' },
{ name: 'Rooms', id: '/rooms' },
{ name: 'Spa', id: '/spa' },
{ name: 'Gallery', id: '/gallery' },
{ name: 'Contact', id: '/contact' }
]}
brandName="Botlhale"
bottomLeftText="Pretoria, South Africa"
bottomRightText="+27 (0) 12 XXX XXXX"
/>
</div>
<div id="gallery" data-section="gallery" className="py-20">
<div id="gallery" data-section="gallery">
<BlogCardOne
blogs={[
{
id: "1", category: "Rooms", title: "Deluxe Room Experience", excerpt: "Step into comfort with our spacious deluxe rooms featuring premium bedding and modern amenities.", imageSrc: "http://img.b2bpic.net/free-photo/cozy-dining-room-modern-apartment_181624-61506.jpg", authorName: "Botlhale Team", authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg", date: "Rooms"
},
{
id: "2", category: "Spa", title: "Serene Spa Sanctuary", excerpt: "Discover tranquility in our beautifully designed spa facility, the perfect escape from daily stress.", imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-various-details-cozy-home-interior-against-background-sofa-with-pillows-concept-home-comfort_169016-4618.jpg", authorName: "Botlhale Team", authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg", date: "Spa"
},
{
id: "3", category: "Pool Area", title: "Resort Pool & Grounds", excerpt: "Relax by our sparkling pool surrounded by lush gardens and comfortable lounging areas.", imageSrc: "http://img.b2bpic.net/free-photo/rest-swimming-sea-hotel-scene_1203-4624.jpg", authorName: "Botlhale Team", authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg", date: "Outdoor"
},
{
id: "4", category: "Dining", title: "Breakfast & Dining", excerpt: "Savor delicious meals in our welcoming dining area with views of the grounds.", imageSrc: "http://img.b2bpic.net/free-photo/people-having-dinner-luxurious-restaurants_23-2151081875.jpg", authorName: "Botlhale Team", authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg", date: "Dining"
}
]}
title="Gallery"
description="Explore the beauty and comfort of Botlhale through our curated gallery of spaces and moments."
tag="Visual Tour"
tagIcon="Image"
tagIcon={Image}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
blogs={[
{
id: "1",
category: "Rooms",
title: "Deluxe Room Experience",
excerpt: "Step into comfort with our spacious deluxe rooms featuring premium bedding and modern amenities.",
imageSrc: "http://img.b2bpic.net/free-photo/cozy-dining-room-modern-apartment_181624-61506.jpg",
imageAlt: "hotel room luxury bedroom comfortable",
authorName: "Botlhale Team",
authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg",
date: "Rooms",
},
{
id: "2",
category: "Spa",
title: "Serene Spa Sanctuary",
excerpt: "Discover tranquility in our beautifully designed spa facility, the perfect escape from daily stress.",
imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-various-details-cozy-home-interior-against-background-sofa-with-pillows-concept-home-comfort_169016-4618.jpg",
imageAlt: "spa interior relaxation peaceful setting",
authorName: "Botlhale Team",
authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg",
date: "Spa",
},
{
id: "3",
category: "Pool Area",
title: "Resort Pool & Grounds",
excerpt: "Relax by our sparkling pool surrounded by lush gardens and comfortable lounging areas.",
imageSrc: "http://img.b2bpic.net/free-photo/rest-swimming-sea-hotel-scene_1203-4624.jpg",
imageAlt: "resort pool area sunny relaxation",
authorName: "Botlhale Team",
authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg",
date: "Outdoor",
},
{
id: "4",
category: "Dining",
title: "Breakfast & Dining",
excerpt: "Savor delicious meals in our welcoming dining area with views of the grounds.",
imageSrc: "http://img.b2bpic.net/free-photo/people-having-dinner-luxurious-restaurants_23-2151081875.jpg?_wi=3",
imageAlt: "restaurant dining area elegant interior",
authorName: "Botlhale Team",
authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg",
date: "Dining",
},
]}
carouselMode="buttons"
animationType="slide-up"
className="py-20"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
title="Get in Touch"
description="Ready to book your stay or have questions? We're here to help. Fill out the form or call us directly for immediate assistance."
inputs={[
{
name: "name", type: "text", placeholder: "Your Name", required: true
},
{
name: "phone", type: "tel", placeholder: "Phone Number", required: true
},
{
name: "email", type: "email", placeholder: "Email Address", required: true
},
{
name: "checkInDate", type: "date", placeholder: "Check-in Date", required: false
}
]}
textarea={{
name: "message", placeholder: "Your message or special requests...", rows: 5,
required: true
}}
useInvertedBackground={false}
imageSrc="http://img.b2bpic.net/free-photo/lifestyle-person-decorating-their-front-door_23-2150562491.jpg"
imageAlt="welcoming guesthouse entrance warm hospitality"
mediaAnimation="opacity"
mediaPosition="right"
buttonText="Send Inquiry"
className="py-20"
/>
</div>
@@ -105,19 +104,16 @@ export default function GalleryPage() {
socialLinks={[
{
icon: Facebook,
href: "https://facebook.com/botlhaleguesthouse",
ariaLabel: "Facebook",
href: "https://facebook.com/botlhaleguesthouse", ariaLabel: "Facebook"
},
{
icon: Instagram,
href: "https://instagram.com/botlhaleguesthouse",
ariaLabel: "Instagram",
href: "https://instagram.com/botlhaleguesthouse", ariaLabel: "Instagram"
},
{
icon: Linkedin,
href: "https://wa.me/27123456789",
ariaLabel: "WhatsApp",
},
href: "https://wa.me/27123456789", ariaLabel: "WhatsApp"
}
]}
/>
</div>

393
src/app/page.tsx
View File

@@ -1,28 +1,19 @@
"use client";
import Link from "next/link";
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import MediaAbout from '@/components/sections/about/MediaAbout';
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterCard from '@/components/sections/footer/FooterCard';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
import FeatureCardTwentyThree from "@/components/sections/feature/FeatureCardTwentyThree";
import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
import MediaAbout from "@/components/sections/about/MediaAbout";
import BlogCardOne from "@/components/sections/blog/BlogCardOne";
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Award, Home, Spa, Star, Sparkles, Heart, HelpCircle, Image, Facebook, Instagram, Linkedin } from "lucide-react";
import { Award, Home, Heart, Sparkles, Image, HelpCircle, Facebook, Instagram, Linkedin } from 'lucide-react';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
export default function HomePage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Rooms", id: "/rooms" },
{ name: "Spa", id: "spa" },
{ name: "Events", id: "events" },
{ name: "Contact", id: "contact" },
];
return (
<ThemeProvider
defaultButtonVariant="text-shift"
@@ -30,7 +21,7 @@ export default function HomePage() {
borderRadius="rounded"
contentWidth="mediumSmall"
sizing="medium"
background="grid"
background="circleGradient"
cardStyle="solid"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="solid"
@@ -38,7 +29,13 @@ export default function HomePage() {
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={navItems}
navItems={[
{ name: 'Home', id: '/' },
{ name: 'Rooms', id: '/rooms' },
{ name: 'Spa', id: '/spa' },
{ name: 'Gallery', id: '/gallery' },
{ name: 'Contact', id: '/contact' }
]}
brandName="Botlhale"
bottomLeftText="Pretoria, South Africa"
bottomRightText="+27 (0) 12 XXX XXXX"
@@ -47,25 +44,25 @@ export default function HomePage() {
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{ variant: "plain" }}
title="Relax, Stay & Unwind in Pretoria"
description="Experience affordable comfort with world-class spa treatments, cozy accommodation, and seamless event hosting at Botlhale. Your sanctuary in Proclamation Hill awaits."
background={{ variant: "grid" }}
kpis={[
{ value: "4.1★", label: "Guest Rating" },
{ value: "46+", label: "Verified Reviews" },
{ value: "100%", label: "Free WiFi & Breakfast" },
{ value: "100%", label: "Free WiFi & Breakfast" }
]}
enableKpiAnimation={true}
tag="Trusted Hospitality"
tagIcon={Award}
tagAnimation="slide-up"
buttons={[
{ text: "Check Availability", href: "/rooms" },
{ text: "Call Now", href: "tel:+27123456789" },
{ text: "Check Availability", href: "#rooms" },
{ text: "Call Now", href: "tel:+27123456789" }
]}
buttonAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/side-view-woman-work-with-coffee-cup_23-2149429380.jpg"
imageAlt="Botlhale Guesthouse main entrance"
imageAlt="luxury guesthouse exterior Pretoria elegant"
mediaAnimation="opacity"
imagePosition="right"
className="py-20"
@@ -80,41 +77,23 @@ export default function HomePage() {
tag="Available Now"
tagIcon={Home}
tagAnimation="slide-up"
buttons={[{ text: "View All Rooms", href: "/rooms" }]}
buttons={[{ text: "View All Rooms", href: "#rooms" }]}
buttonAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
products={[
{
id: "1",
brand: "Botlhale",
name: "Deluxe Room",
price: "R850",
rating: 5,
reviewCount: "28",
imageSrc: "http://img.b2bpic.net/free-photo/elegant-hotel-room-with-window_1203-1492.jpg?_wi=1",
imageAlt: "Deluxe room with queen bed",
id: "1", brand: "Botlhale", name: "Deluxe Room", price: "R850", rating: 5,
reviewCount: "28", imageSrc: "http://img.b2bpic.net/free-photo/elegant-hotel-room-with-window_1203-1492.jpg", imageAlt: "deluxe hotel room queen bed luxury"
},
{
id: "2",
brand: "Botlhale",
name: "Standard Room",
price: "R650",
rating: 5,
reviewCount: "32",
imageSrc: "http://img.b2bpic.net/free-photo/croissant-boiled-egg-orange-juice-breakfast-tray-bed_176474-2603.jpg?_wi=1",
imageAlt: "Standard room with comfort bedding",
id: "2", brand: "Botlhale", name: "Standard Room", price: "R650", rating: 5,
reviewCount: "32", imageSrc: "http://img.b2bpic.net/free-photo/croissant-boiled-egg-orange-juice-breakfast-tray-bed_176474-2603.jpg", imageAlt: "comfortable hotel room cozy bed hospitality"
},
{
id: "3",
brand: "Botlhale",
name: "Suite with Spa Access",
price: "R1200",
rating: 5,
reviewCount: "12",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-bed-with-black-cushion_1203-544.jpg?_wi=1",
imageAlt: "Luxury suite with spa amenities",
},
id: "3", brand: "Botlhale", name: "Suite with Spa Access", price: "R1200", rating: 5,
reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/close-up-bed-with-black-cushion_1203-544.jpg", imageAlt: "luxury hotel suite spacious elegant furniture"
}
]}
carouselMode="buttons"
gridVariant="three-columns-all-equal-width"
@@ -125,96 +104,96 @@ export default function HomePage() {
<div id="spa" data-section="spa">
<FeatureCardTwentyThree
title="Spa & Wellness Services"
description="Rejuvenate your mind and body with our premium spa treatments designed for ultimate relaxation and healing."
tag="Wellness"
tagIcon={Spa}
tagAnimation="slide-up"
buttons={[{ text: "Book a Spa Session", href: "tel:+27123456789" }]}
buttonAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: "1",
title: "Full Body Massage",
tags: ["Relaxation", "90 min"],
imageSrc: "http://img.b2bpic.net/free-photo/natural-elements-spa-with-candles_23-2148199535.jpg?_wi=1",
imageAlt: "Full body massage therapy",
id: "1", title: "Full Body Massage", tags: ["Relaxation", "90 min"],
imageSrc: "http://img.b2bpic.net/free-photo/natural-elements-spa-with-candles_23-2148199535.jpg", imageAlt: "spa massage therapy relaxation treatment"
},
{
id: "2",
title: "Couples Massage Package",
tags: ["Romantic", "120 min"],
imageSrc: "http://img.b2bpic.net/free-photo/massage-concept-with-woman-candles_23-2147816944.jpg?_wi=1",
imageAlt: "Couples spa treatment",
id: "2", title: "Couples Massage Package", tags: ["Romantic", "120 min"],
imageSrc: "http://img.b2bpic.net/free-photo/massage-concept-with-woman-candles_23-2147816944.jpg", imageAlt: "couples massage spa romantic treatment"
},
{
id: "3",
title: "Facial Treatments",
tags: ["Skincare", "60 min"],
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-lies-beautician-s-table-receives-procedures_343596-4239.jpg?_wi=1",
imageAlt: "Premium facial treatment",
id: "3", title: "Facial Treatments", tags: ["Skincare", "60 min"],
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-lies-beautician-s-table-receives-procedures_343596-4239.jpg", imageAlt: "facial treatment spa skincare professional"
},
{
id: "4",
title: "Spa Day Package",
tags: ["Luxury", "Half Day"],
imageSrc: "http://img.b2bpic.net/free-photo/woman-relaxing-spa-pool-by-window-quiet-moment_169016-69396.jpg?_wi=1",
imageAlt: "Complete spa day experience",
},
id: "4", title: "Spa Day Package", tags: ["Luxury", "Half Day"],
imageSrc: "http://img.b2bpic.net/free-photo/woman-relaxing-spa-pool-by-window-quiet-moment_169016-69396.jpg", imageAlt: "spa day package luxury wellness retreat"
}
]}
animationType="slide-up"
title="Spa & Wellness Services"
description="Rejuvenate your mind and body with our premium spa treatments designed for ultimate relaxation and healing."
textboxLayout="default"
useInvertedBackground={false}
tag="Wellness"
tagIcon={Heart}
tagAnimation="slide-up"
buttons={[
{
text: "Book a Spa Session", href: "tel:+27123456789"
}
]}
buttonAnimation="slide-up"
className="py-20"
/>
</div>
<div id="amenities" data-section="amenities">
<FeatureCardTwentyThree
title="Premium Amenities"
description="Every comfort you need for an unforgettable stay in Pretoria's most welcoming guesthouse."
tag="Facilities"
tagIcon={Star}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: "1",
title: "Free High-Speed WiFi",
tags: ["Connectivity", "All Rooms"],
imageSrc: "http://img.b2bpic.net/free-vector/neon-wifi-signal-collection_23-2148177976.jpg",
imageAlt: "WiFi connectivity icon",
id: "1", title: "Free High-Speed WiFi", tags: ["Connectivity", "All Rooms"],
imageSrc: "http://img.b2bpic.net/free-vector/neon-wifi-signal-collection_23-2148177976.jpg", imageAlt: "WiFi connectivity icon modern technology"
},
{
id: "2",
title: "Complimentary Breakfast",
tags: ["Daily", "7:00-9:00 AM"],
imageSrc: "http://img.b2bpic.net/free-photo/side-view-hand-man-pouring-feijoa-compote-into-glass_141793-3034.jpg",
imageAlt: "Fresh breakfast spread",
id: "2", title: "Complimentary Breakfast", tags: ["Daily", "7:00-9:00 AM"],
imageSrc: "http://img.b2bpic.net/free-photo/side-view-hand-man-pouring-feijoa-compote-into-glass_141793-3034.jpg", imageAlt: "gourmet breakfast spread fresh food morning"
},
{
id: "3",
title: "Swimming Pool",
tags: ["Relaxation", "Year-Round"],
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-asian-woman-relax-smile-leisure-around-outdoor-swimming-pool-resort-hotel-with-sea-ocean-view_74190-14608.jpg",
imageAlt: "Resort swimming pool",
id: "3", title: "Swimming Pool", tags: ["Relaxation", "Year-Round"],
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-asian-woman-relax-smile-leisure-around-outdoor-swimming-pool-resort-hotel-with-sea-ocean-view_74190-14608.jpg", imageAlt: "resort swimming pool luxury relaxation"
},
{
id: "4",
title: "Free Secure Parking",
tags: ["Safety", "24/7"],
imageSrc: "http://img.b2bpic.net/free-photo/view-from-birdseye-city-kiev-street-with-lot-parked-cars_628469-43.jpg",
imageAlt: "Secure parking area",
},
id: "4", title: "Free Secure Parking", tags: ["Safety", "24/7"],
imageSrc: "http://img.b2bpic.net/free-photo/view-from-birdseye-city-kiev-street-with-lot-parked-cars_628469-43.jpg", imageAlt: "secure parking area gated facility"
}
]}
animationType="slide-up"
title="Premium Amenities"
description="Every comfort you need for an unforgettable stay in Pretoria's most welcoming guesthouse."
textboxLayout="default"
useInvertedBackground={false}
tag="Facilities"
tagIcon={Home}
tagAnimation="slide-up"
className="py-20"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFive
testimonials={[
{
id: "1", name: "Sarah Johnson, Couple's Retreat", date: "Date: 15 January 2025", title: "Perfect weekend escape!", quote: "The staff was incredibly welcoming, the rooms immaculate, and the spa treatments truly rejuvenating. We've already booked our next stay!", tag: "Couples Package", avatarSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-posing_23-2149745618.jpg", imageSrc: "http://img.b2bpic.net/free-photo/life-home-with-couple-relaxin-together_23-2149129081.jpg"
},
{
id: "2", name: "Michael Chen, Business Traveler", date: "Date: 10 January 2025", title: "Best guesthouse in Pretoria", quote: "Great location, fast WiFi, and the breakfast was excellent. The team made me feel at home despite being away on business.", tag: "Business Stay", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-happy-executive_1098-768.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-drinking-coffee-working-her-laptop-restaurant_23-2149304066.jpg"
},
{
id: "3", name: "Emily Rodriguez, Family Guest", date: "Date: 05 January 2025", title: "Relaxation guaranteed!", quote: "Beautiful pool, clean rooms, and the staff's attention to detail is exceptional. Our kids loved it, and we loved the peace and quiet.", tag: "Family Vacation", avatarSrc: "http://img.b2bpic.net/free-psd/portrait-woman-with-coffee-cup_23-2150116720.jpg", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-mother-children-hammock_23-2149302335.jpg"
},
{
id: "4", name: "David Nakamura, Event Host", date: "Date: 28 December 2024", title: "Outstanding venue for our celebration", quote: "The event team was professional, the venue is stunning, and the catering was delicious. They made our anniversary party unforgettable.", tag: "Event Hosting", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-grey-haired-businessman-standing_74855-10324.jpg", imageSrc: "http://img.b2bpic.net/free-photo/decorated-wedding-tables-hall-interior_1303-18643.jpg"
},
{
id: "5", name: "Amara Okonkwo, Solo Traveler", date: "Date: 22 December 2024", title: "Safe, welcoming, and convenient", quote: "As a solo female traveler, I felt completely safe and welcomed. The location is perfect for exploring Pretoria, and the vibe is so positive.", tag: "Solo Travel", avatarSrc: "http://img.b2bpic.net/free-photo/businesswoman-using-hand-sanitizer-front-view_23-2148725209.jpg", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-women-smiling-sunbathing-lying-chaises-near-sea_176420-1400.jpg"
},
{
id: "6", name: "James Wilson, Regular Guest", date: "Date: 18 December 2024", title: "My home away from home", quote: "I've stayed here three times now, and it keeps getting better. The consistency, warmth, and quality service keep me coming back.", tag: "Loyalty Guest", avatarSrc: "http://img.b2bpic.net/free-photo/crazy-excited-man-with-tossed-hair-smiling-broadly_176420-20030.jpg", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-woman-having-fun-while-using-smart-phone-photographing-her-boyfriend-bedroom_637285-6276.jpg"
}
]}
title="What Our Guests Say"
description="Real reviews from real travelers who've experienced Botlhale's warmth and hospitality."
tag="Guest Reviews"
@@ -222,74 +201,83 @@ export default function HomePage() {
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "Sarah Johnson, Couple's Retreat",
date: "Date: 15 January 2025",
title: "Perfect weekend escape!",
quote: "The staff was incredibly welcoming, the rooms immaculate, and the spa treatments truly rejuvenating. We've already booked our next stay!",
tag: "Couples Package",
avatarSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-posing_23-2149745618.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/life-home-with-couple-relaxin-together_23-2149129081.jpg?_wi=1",
},
{
id: "2",
name: "Michael Chen, Business Traveler",
date: "Date: 10 January 2025",
title: "Best guesthouse in Pretoria",
quote: "Great location, fast WiFi, and the breakfast was excellent. The team made me feel at home despite being away on business.",
tag: "Business Stay",
avatarSrc: "http://img.b2bpic.net/free-photo/close-up-happy-executive_1098-768.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-drinking-coffee-working-her-laptop-restaurant_23-2149304066.jpg",
},
{
id: "3",
name: "Emily Rodriguez, Family Guest",
date: "Date: 05 January 2025",
title: "Relaxation guaranteed!",
quote: "Beautiful pool, clean rooms, and the staff's attention to detail is exceptional. Our kids loved it, and we loved the peace and quiet.",
tag: "Family Vacation",
avatarSrc: "http://img.b2bpic.net/free-psd/portrait-woman-with-coffee-cup_23-2150116720.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-mother-children-hammock_23-2149302335.jpg?_wi=1",
},
{
id: "4",
name: "David Nakamura, Event Host",
date: "Date: 28 December 2024",
title: "Outstanding venue for our celebration",
quote: "The event team was professional, the venue is stunning, and the catering was delicious. They made our anniversary party unforgettable.",
tag: "Event Hosting",
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-grey-haired-businessman-standing_74855-10324.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/decorated-wedding-tables-hall-interior_1303-18643.jpg?_wi=1",
},
{
id: "5",
name: "Amara Okonkwo, Solo Traveler",
date: "Date: 22 December 2024",
title: "Safe, welcoming, and convenient",
quote: "As a solo female traveler, I felt completely safe and welcomed. The location is perfect for exploring Pretoria, and the vibe is so positive.",
tag: "Solo Travel",
avatarSrc: "http://img.b2bpic.net/free-photo/businesswoman-using-hand-sanitizer-front-view_23-2148725209.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-women-smiling-sunbathing-lying-chaises-near-sea_176420-1400.jpg?_wi=1",
},
{
id: "6",
name: "James Wilson, Regular Guest",
date: "Date: 18 December 2024",
title: "My home away from home",
quote: "I've stayed here three times now, and it keeps getting better. The consistency, warmth, and quality service keep me coming back.",
tag: "Loyalty Guest",
avatarSrc: "http://img.b2bpic.net/free-photo/crazy-excited-man-with-tossed-hair-smiling-broadly_176420-20030.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-woman-having-fun-while-using-smart-phone-photographing-her-boyfriend-bedroom_637285-6276.jpg",
},
className="py-20"
/>
</div>
<div id="events" data-section="events">
<MediaAbout
title="Host Your Perfect Event"
description="From intimate celebrations to corporate gatherings, our versatile venue and experienced team ensure your event is unforgettable."
tag="Events & Venue"
tagIcon={Sparkles}
tagAnimation="slide-up"
buttons={[
{ text: "Request Event Quote", href: "tel:+27123456789" }
]}
buttonAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/table-decorated-christmas_1162-199.jpg"
imageAlt="event venue decorated beautiful celebration"
useInvertedBackground={false}
className="py-20"
/>
</div>
<div id="gallery" data-section="gallery">
<BlogCardOne
blogs={[
{
id: "1", category: "Rooms", title: "Deluxe Room Experience", excerpt: "Step into comfort with our spacious deluxe rooms featuring premium bedding and modern amenities.", imageSrc: "http://img.b2bpic.net/free-photo/cozy-dining-room-modern-apartment_181624-61506.jpg", authorName: "Botlhale Team", authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg", date: "Rooms"
},
{
id: "2", category: "Spa", title: "Serene Spa Sanctuary", excerpt: "Discover tranquility in our beautifully designed spa facility, the perfect escape from daily stress.", imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-various-details-cozy-home-interior-against-background-sofa-with-pillows-concept-home-comfort_169016-4618.jpg", authorName: "Botlhale Team", authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg", date: "Spa"
},
{
id: "3", category: "Pool Area", title: "Resort Pool & Grounds", excerpt: "Relax by our sparkling pool surrounded by lush gardens and comfortable lounging areas.", imageSrc: "http://img.b2bpic.net/free-photo/rest-swimming-sea-hotel-scene_1203-4624.jpg", authorName: "Botlhale Team", authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg", date: "Outdoor"
},
{
id: "4", category: "Dining", title: "Breakfast & Dining", excerpt: "Savor delicious meals in our welcoming dining area with views of the grounds.", imageSrc: "http://img.b2bpic.net/free-photo/people-having-dinner-luxurious-restaurants_23-2151081875.jpg", authorName: "Botlhale Team", authorAvatar: "http://img.b2bpic.net/free-photo/modern-businesswoman_23-2148012909.jpg", date: "Dining"
}
]}
title="Gallery"
description="Explore the beauty and comfort of Botlhale through our curated gallery of spaces and moments."
tag="Visual Tour"
tagIcon={Image}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
carouselMode="buttons"
animationType="slide-up"
className="py-20"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
faqs={[
{
id: "1", title: "What is your cancellation policy?", content: "We offer free cancellation up to 48 hours before your scheduled arrival. Cancellations within 48 hours may incur a one-night charge. For spa bookings, please cancel at least 24 hours in advance."
},
{
id: "2", title: "Is breakfast included with room bookings?", content: "Yes! A complimentary full breakfast is included with all room bookings and served daily from 7:00 AM to 9:00 AM in our dining area. Dietary requirements can be accommodated with prior notice."
},
{
id: "3", title: "Do you offer wheelchair accessibility?", content: "Yes, Botlhale features accessible rooms and facilities for guests with mobility needs. Please inform us of any accessibility requirements when booking so we can provide the best accommodation."
},
{
id: "4", title: "What are your check-in and check-out times?", content: "Standard check-in is at 2:00 PM and check-out is at 10:00 AM. Early check-in and late check-out may be available subject to availability. Please contact us in advance to arrange."
},
{
id: "5", title: "Can I book the venue for private events?", content: "Absolutely! We host weddings, parties, corporate events, baby showers, and more. Our team will work with you to create the perfect event. Contact us for availability and custom packages."
},
{
id: "6", title: "Do you have packages for spa services?", content: "Yes! We offer spa packages including couples massages, day packages, and customized treatments. Special rates available for group bookings and extended stays. Call us for details."
}
]}
imageSrc="http://img.b2bpic.net/free-photo/woman-data-center-wearing-headphones-listening-music_482257-123609.jpg"
imageAlt="customer support help desk professional"
mediaAnimation="opacity"
mediaPosition="right"
title="Frequently Asked Questions"
description="Find answers to common questions about booking, amenities, and services."
tag="Help & Support"
@@ -297,43 +285,39 @@ export default function HomePage() {
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
faqs={[
faqsAnimation="slide-up"
className="py-20"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
title="Get in Touch"
description="Ready to book your stay or have questions? We're here to help. Fill out the form or call us directly for immediate assistance."
inputs={[
{
id: "1",
title: "What is your cancellation policy?",
content: "We offer free cancellation up to 48 hours before your scheduled arrival. Cancellations within 48 hours may incur a one-night charge. For spa bookings, please cancel at least 24 hours in advance.",
name: "name", type: "text", placeholder: "Your Name", required: true
},
{
id: "2",
title: "Is breakfast included with room bookings?",
content: "Yes! A complimentary full breakfast is included with all room bookings and served daily from 7:00 AM to 9:00 AM in our dining area. Dietary requirements can be accommodated with prior notice.",
name: "phone", type: "tel", placeholder: "Phone Number", required: true
},
{
id: "3",
title: "Do you offer wheelchair accessibility?",
content: "Yes, Botlhale features accessible rooms and facilities for guests with mobility needs. Please inform us of any accessibility requirements when booking so we can provide the best accommodation.",
name: "email", type: "email", placeholder: "Email Address", required: true
},
{
id: "4",
title: "What are your check-in and check-out times?",
content: "Standard check-in is at 2:00 PM and check-out is at 10:00 AM. Early check-in and late check-out may be available subject to availability. Please contact us in advance to arrange.",
},
{
id: "5",
title: "Can I book the venue for private events?",
content: "Absolutely! We host weddings, parties, corporate events, baby showers, and more. Our team will work with you to create the perfect event. Contact us for availability and custom packages.",
},
{
id: "6",
title: "Do you have packages for spa services?",
content: "Yes! We offer spa packages including couples massages, day packages, and customized treatments. Special rates available for group bookings and extended stays. Call us for details.",
},
name: "checkInDate", type: "date", placeholder: "Check-in Date", required: false
}
]}
imageSrc="http://img.b2bpic.net/free-photo/woman-data-center-wearing-headphones-listening-music_482257-123609.jpg?_wi=1"
imageAlt="FAQ support team"
textarea={{
name: "message", placeholder: "Your message or special requests...", rows: 5,
required: true
}}
useInvertedBackground={false}
imageSrc="http://img.b2bpic.net/free-photo/lifestyle-person-decorating-their-front-door_23-2150562491.jpg"
imageAlt="welcoming guesthouse entrance warm hospitality"
mediaAnimation="opacity"
mediaPosition="right"
faqsAnimation="slide-up"
buttonText="Send Inquiry"
className="py-20"
/>
</div>
@@ -345,19 +329,16 @@ export default function HomePage() {
socialLinks={[
{
icon: Facebook,
href: "https://facebook.com/botlhaleguesthouse",
ariaLabel: "Facebook",
href: "https://facebook.com/botlhaleguesthouse", ariaLabel: "Facebook"
},
{
icon: Instagram,
href: "https://instagram.com/botlhaleguesthouse",
ariaLabel: "Instagram",
href: "https://instagram.com/botlhaleguesthouse", ariaLabel: "Instagram"
},
{
icon: Linkedin,
href: "https://wa.me/27123456789",
ariaLabel: "WhatsApp",
},
href: "https://wa.me/27123456789", ariaLabel: "WhatsApp"
}
]}
/>
</div>

32
src/app/spa/page.tsx
View File

@@ -6,7 +6,7 @@ import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCa
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterCard from '@/components/sections/footer/FooterCard';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Award, Spa, Heart, Facebook, Instagram, Linkedin } from 'lucide-react';
import { Heart, Facebook, Instagram, Linkedin } from 'lucide-react';
export default function SpaPage() {
return (
@@ -16,7 +16,7 @@ export default function SpaPage() {
borderRadius="rounded"
contentWidth="mediumSmall"
sizing="medium"
background="grid"
background="circleGradient"
cardStyle="solid"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="solid"
@@ -25,11 +25,11 @@ export default function SpaPage() {
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: 'Home', id: 'home' },
{ name: 'Rooms', id: 'rooms' },
{ name: 'Spa', id: 'spa' },
{ name: 'Events', id: 'events' },
{ name: 'Contact', id: 'contact' }
{ name: 'Home', id: '/' },
{ name: 'Rooms', id: '/rooms' },
{ name: 'Spa', id: '/spa' },
{ name: 'Gallery', id: '/gallery' },
{ name: 'Contact', id: '/contact' }
]}
brandName="Botlhale"
bottomLeftText="Pretoria, South Africa"
@@ -41,27 +41,19 @@ export default function SpaPage() {
<FeatureCardTwentyThree
features={[
{
id: "1", title: "Full Body Massage", tags: [
"Relaxation", "90 min"
],
id: "1", title: "Full Body Massage", tags: ["Relaxation", "90 min"],
imageSrc: "http://img.b2bpic.net/free-photo/natural-elements-spa-with-candles_23-2148199535.jpg", imageAlt: "Full body massage therapy"
},
{
id: "2", title: "Couples Massage Package", tags: [
"Romantic", "120 min"
],
id: "2", title: "Couples Massage Package", tags: ["Romantic", "120 min"],
imageSrc: "http://img.b2bpic.net/free-photo/massage-concept-with-woman-candles_23-2147816944.jpg", imageAlt: "Couples spa treatment"
},
{
id: "3", title: "Facial Treatments", tags: [
"Skincare", "60 min"
],
id: "3", title: "Facial Treatments", tags: ["Skincare", "60 min"],
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-lies-beautician-s-table-receives-procedures_343596-4239.jpg", imageAlt: "Premium facial treatment"
},
{
id: "4", title: "Spa Day Package", tags: [
"Luxury", "Half Day"
],
id: "4", title: "Spa Day Package", tags: ["Luxury", "Half Day"],
imageSrc: "http://img.b2bpic.net/free-photo/woman-relaxing-spa-pool-by-window-quiet-moment_169016-69396.jpg", imageAlt: "Complete spa day experience"
}
]}
@@ -71,7 +63,7 @@ export default function SpaPage() {
textboxLayout="default"
useInvertedBackground={false}
tag="Wellness"
tagIcon={Spa}
tagIcon={Heart}
tagAnimation="slide-up"
buttons={[
{

63
src/components/shared/SvgTextLogo/SvgTextLogo.tsx
View File

@@ -1,51 +1,42 @@
"use client";
import { memo } from "react";
import useSvgTextLogo from "./useSvgTextLogo";
import { cls } from "@/lib/utils";
import React from 'react';
interface SvgTextLogoProps {
logoText: string;
adjustHeightFactor?: number;
verticalAlign?: "top" | "center";
text: string;
className?: string;
fontSize?: number;
fontWeight?: string;
letterSpacing?: string;
color?: string;
}
const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
logoText,
adjustHeightFactor,
verticalAlign = "top",
className = "",
}) {
const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
text,
className = '',
fontSize = 32,
fontWeight = '600',
letterSpacing = '0',
color = 'currentColor',
}) => {
return (
<svg
ref={svgRef}
viewBox={viewBox}
className={cls("w-full", className)}
style={{ aspectRatio: aspectRatio }}
preserveAspectRatio="none"
role="img"
aria-label={`${logoText} logo`}
viewBox={`0 0 ${text.length * fontSize * 0.6} ${fontSize * 1.2}`}
className={className}
xmlns="http://www.w3.org/2000/svg"
>
<text
ref={textRef}
x="0"
y={verticalAlign === "center" ? "50%" : "0"}
className="font-bold fill-current"
style={{
fontSize: "20px",
letterSpacing: "-0.02em",
dominantBaseline: verticalAlign === "center" ? "middle" : "text-before-edge"
}}
y="50%"
dominantBaseline="middle"
fontSize={fontSize}
fontWeight={fontWeight}
letterSpacing={letterSpacing}
fill={color}
fontFamily="inherit"
>
{logoText}
{text}
</text>
</svg>
);
});
};
SvgTextLogo.displayName = "SvgTextLogo";
export default SvgTextLogo;
export default SvgTextLogo;