bender/3ecdef21-0a89-4c97-a9ea-6d17a389faae
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main #4

Merged
bender merged 4 commits from version_1 into main 2026-03-11 07:31:53 +00:00
Conversation 0 Commits 4 Files Changed 4 +326 -464
4 changed files with 326 additions and 464 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -2,60 +2,65 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
import ProductCardThree from "@/components/sections/product/ProductCardThree";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
import FaqDouble from "@/components/sections/faq/FaqDouble";
import ContactText from "@/components/sections/contact/ContactText";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import Link from "next/link";
import { Compass, MapPin, Award, Sparkles, Mountain, Droplet, Trees, Zap, Waves, Palmtree } from "lucide-react";
export default function GalleryPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Safaris", id: "/safaris" },
{ name: "Zanzibar", id: "/zanzibar" },
{ name: "Destinations", id: "/destinations" },
{ name: "Gallery", id: "/gallery" },
{ name: "Safaris", id: "/safari-packages" },
{ name: "Zanzibar", id: "/zanzibar-tours" },
{ name: "Destinations", id: "destinations" },
{ name: "Gallery", id: "gallery" },
];
const footerColumns = [
{
title: "Destinations",
items: [
{ label: "Serengeti Safari", href: "/destinations" },
{ label: "Ngorongoro Crater", href: "/destinations" },
{ label: "Mount Kilimanjaro", href: "/destinations" },
{ label: "Zanzibar Island", href: "/zanzibar" },
title: "Destinations", items: [
{ label: "Serengeti Safari", href: "/destinations#serengeti" },
{ label: "Ngorongoro Crater", href: "/destinations#ngorongoro" },
{ label: "Mount Kilimanjaro", href: "/destinations#kilimanjaro" },
{ label: "Zanzibar Island", href: "/zanzibar-tours" },
],
},
{
title: "Experiences",
items: [
{ label: "Safari Packages", href: "/" },
{ label: "Beach Retreats", href: "/zanzibar" },
{ label: "Custom Tours", href: "/" },
title: "Experiences", items: [
{ label: "Safari Packages", href: "/safari-packages" },
{ label: "Beach Retreats", href: "/zanzibar-tours" },
{ label: "Custom Tours", href: "/booking" },
{ label: "Gallery", href: "/gallery" },
],
},
{
title: "Company",
items: [
{ label: "About Us", href: "/" },
{ label: "Contact", href: "/" },
{ label: "Testimonials", href: "/" },
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Contact", href: "/contact" },
{ label: "Testimonials", href: "#testimonials" },
{ label: "Careers", href: "#" },
],
},
{
title: "Support",
items: [
{ label: "FAQ", href: "/destinations" },
title: "Support", items: [
{ label: "FAQ", href: "#faq" },
{ label: "Travel Guide", href: "#" },
{ label: "Booking Help", href: "#" },
{ label: "Contact Support", href: "/" },
{ label: "Contact Support", href: "/contact" },
],
},
];
const customNavItems = navItems.map(item => ({
...item,
id: item.id.startsWith("/") ? item.id : `#${item.id}`,
}));
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
@@ -63,7 +68,7 @@ export default function GalleryPage() {
borderRadius="rounded"
contentWidth="smallMedium"
sizing="largeSizeMediumTitles"
background="aurora"
background="circleGradient"
cardStyle="soft-shadow"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="radial-glow"
@@ -71,166 +76,143 @@ export default function GalleryPage() {
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
brandName="SK TOURS"
navItems={[
{ name: "Home", id: "/" },
{ name: "Safaris", id: "/safaris" },
{ name: "Zanzibar", id: "/zanzibar" },
{ name: "Destinations", id: "/destinations" },
{ name: "Gallery", id: "/gallery" },
]}
navItems={customNavItems}
button={{ text: "Book Now", href: "/booking" }}
brandName="SK TOURS"
/>
</div>
<div id="gallery-safari" data-section="gallery-safari" className="py-20">
<ProductCardThree
products={[
{
id: "1",
name: "Serengeti Safari Experience",
price: "$4,500",
imageSrc: "http://img.b2bpic.net/free-photo/bison-wild-sunny-day_23-2151689001.jpg?_wi=3",
imageAlt: "Serengeti National Park safari with wildlife",
},
{
id: "2",
name: "Ngorongoro Crater Adventure",
price: "$3,800",
imageSrc: "http://img.b2bpic.net/free-photo/tribe-wild-horses-eating-grass-field_181624-2323.jpg?_wi=3",
imageAlt: "Ngorongoro Crater landscape and wildlife",
},
{
id: "3",
name: "Tarangire National Park Safari",
price: "$3,200",
imageSrc: "http://img.b2bpic.net/free-photo/african-savannah-scene-black-white_23-2151774061.jpg?_wi=3",
imageAlt: "Tarangire National Park with elephants",
},
{
id: "4",
name: "Big Five Luxury Safari",
price: "$6,200",
imageSrc: "http://img.b2bpic.net/free-vector/wild-animals-collection_1308-331.jpg?_wi=3",
imageAlt: "Luxury Big Five safari experience",
},
{
id: "5",
name: "Mount Kilimanjaro Trek",
price: "$2,800",
imageSrc: "http://img.b2bpic.net/free-photo/view-spectacular-nature-landscape_23-2150763652.jpg?_wi=3",
imageAlt: "Mount Kilimanjaro expedition",
},
{
id: "6",
name: "Zanzibar Beach Holiday",
price: "$3,500",
imageSrc: "http://img.b2bpic.net/free-photo/maldives-island_1203-7353.jpg?_wi=3",
imageAlt: "Luxury Zanzibar beach resort",
},
<div id="hero" data-section="hero" className="relative overflow-hidden">
<HeroSplitKpi
background={{ variant: "glowing-orb" }}
title="Gallery - Tanzania's Natural Beauty"
description="Explore stunning photography from our safaris, Zanzibar escapes, and African adventures. Every image tells a story of unforgettable moments."
tag="Visual Journey"
tagIcon={Compass}
enableKpiAnimation={true}
kpis={[
{ value: "1000+", label: "Premium Photos" },
{ value: "50+", label: "Destinations" },
{ value: "5000+", label: "Happy Moments" },
]}
title="Safari Gallery - Stunning Wildlife Photography"
description="Explore our curated collection of breathtaking wildlife moments, landscapes, and exclusive safari experiences captured across Tanzania."
tag="Wildlife Gallery"
buttons={[
{ text: "Book Your Adventure", href: "/booking" },
{ text: "View Packages", href: "/safari-packages" },
]}
imageSrc="http://img.b2bpic.net/free-photo/lonely-acacia-tree-camelthorne-with-blue-sky-background-etosha-national-park-namibia-south-africa_1150-21621.jpg"
imageAlt="Stunning Tanzanian safari landscape with wildlife"
imagePosition="right"
mediaAnimation="slide-up"
/>
</div>
<div id="safari-gallery" data-section="safari-gallery">
<ProductCardThree
title="Safari Moments"
description="Captured wildlife and landscape photography from our premier safari experiences across Tanzania."
tag="Wildlife Photography"
tagIcon={Sparkles}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
gridVariant="three-columns-all-equal-width"
products={[
{
id: "1", name: "Serengeti Wildlife", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/bison-wild-sunny-day_23-2151689001.jpg", imageAlt: "Serengeti National Park safari with wildlife"},
{
id: "2", name: "Ngorongoro Landscape", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/tribe-wild-horses-eating-grass-field_181624-2323.jpg", imageAlt: "Ngorongoro Crater landscape and wildlife"},
{
id: "3", name: "Tarangire Elephants", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/african-savannah-scene-black-white_23-2151774061.jpg", imageAlt: "Tarangire National Park with elephants"},
{
id: "4", name: "Big Five Experience", price: "View", imageSrc: "http://img.b2bpic.net/free-vector/wild-animals-collection_1308-331.jpg", imageAlt: "Luxury Big Five safari experience"},
{
id: "5", name: "Kilimanjaro Peak", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/view-spectacular-nature-landscape_23-2150763652.jpg", imageAlt: "Mount Kilimanjaro expedition"},
{
id: "6", name: "Sunset Savanna", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/african-savannah-scene-black-white_23-2151774061.jpg", imageAlt: "African savanna sunset landscape"},
]}
/>
</div>
<div id="gallery-zanzibar" data-section="gallery-zanzibar" className="py-20">
<div id="beach-gallery" data-section="beach-gallery">
<ProductCardThree
products={[
{
id: "1",
name: "Zanzibar Luxury Beach Resort",
price: "$450/night",
imageSrc: "http://img.b2bpic.net/free-photo/couple-talking-drinking-coconut-milk-by-pool-vacation_23-2149369768.jpg?_wi=3",
imageAlt: "Luxury beachfront resort in Zanzibar",
},
{
id: "2",
name: "Spice Island Experience",
price: "$3,200",
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-meal-cooking-process-while-camping_23-2148301419.jpg?_wi=2",
imageAlt: "Zanzibar spice plantation tour",
},
{
id: "3",
name: "Private Beach Villa Package",
price: "$800/night",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-luxury-looking-woman-red-orange-evening-dress-rich-hotel_343596-3596.jpg?_wi=2",
imageAlt: "Private luxury beach villa Zanzibar",
},
{
id: "4",
name: "Sunset Dhow Cruise",
price: "$180",
imageSrc: "http://img.b2bpic.net/free-photo/motorboats-parked-water-by-water-with-sunset-city-visible_181624-29150.jpg?_wi=2",
imageAlt: "Traditional dhow sunset cruise Zanzibar",
},
]}
title="Zanzibar Paradise Gallery"
description="Discover the tropical beauty of Zanzibar through our exclusive gallery featuring pristine beaches, luxury resorts, and island experiences."
tag="Beach Paradise"
title="Zanzibar Paradise"
description="Tropical beauty and luxury beach experiences captured from our Zanzibar island retreats."
tag="Beach Photography"
tagIcon={Waves}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={true}
gridVariant="two-columns-alternating-heights"
/>
</div>
<div id="gallery-testimonials" data-section="gallery-testimonials" className="py-20">
<TestimonialCardThirteen
testimonials={[
products={[
{
id: "1",
name: "David Chen",
handle: "@dchen",
testimonial: "Worth every penny. The Big Five safari was a once-in-a-lifetime experience. The photography opportunities were incredible, and the luxury lodges exceeded all expectations.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/confident-entrepreneur-satisfied-with-own-success_1163-5474.jpg?_wi=4",
imageAlt: "male professional portrait photography",
},
id: "1", name: "Turquoise Waters", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/maldives-island_1203-7353.jpg", imageAlt: "Luxury Zanzibar beach resort"},
{
id: "2",
name: "Victoria Thompson",
handle: "@vthompson",
testimonial: "SK Tours combines adventure with comfort in a way I've never experienced. The attention to detail and personalized service made our trip absolutely perfect.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-business-lady_1163-3171.jpg?_wi=4",
imageAlt: "woman executive professional portrait",
},
id: "2", name: "Luxury Resort", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/couple-talking-drinking-coconut-milk-by-pool-vacation_23-2149369768.jpg", imageAlt: "Luxury beachfront resort in Zanzibar"},
{
id: "3",
name: "Marco Rossi",
handle: "@marcorossi",
testimonial: "As a seasoned traveler, I can say SK Tours is among the best tourism operators I've encountered. Professionalism, safety, and unforgettable experiences guaranteed.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-mature-businessman-looking-away_23-2147955371.jpg?_wi=4",
imageAlt: "man professional portrait businessman",
},
id: "3", name: "Spice Island", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-meal-cooking-process-while-camping_23-2148301419.jpg", imageAlt: "Zanzibar spice plantation tour"},
{
id: "4", name: "Sunset Dhow", price: "View", imageSrc: "http://img.b2bpic.net/free-photo/motorboats-parked-water-by-water-with-sunset-city-visible_181624-29150.jpg", imageAlt: "Traditional dhow sunset cruise Zanzibar"},
]}
showRating={true}
title="Gallery Visitor Testimonials"
description="See what adventurers and explorers say about their experiences with SK Tours & Safaris."
tag="Guest Reviews"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="contact-cta" data-section="contact-cta" className="py-20">
<div id="destinations" data-section="destinations">
<FeatureHoverPattern
title="Explore Iconic Destinations"
description="Each photo in our gallery represents the incredible diversity of Tanzania's natural wonders."
tag="Featured Locations"
textboxLayout="default"
animationType="blur-reveal"
useInvertedBackground={true}
features={[
{ icon: Mountain, title: "Serengeti", description: "Vast plains and incredible wildlife migrations" },
{ icon: Droplet, title: "Ngorongoro", description: "Ancient crater with breathtaking vistas" },
{ icon: Trees, title: "Tarangire", description: "Elephant populations and scenic beauty" },
{ icon: Zap, title: "Kilimanjaro", description: "Africa's iconic snow-capped peak" },
{ icon: Waves, title: "Zanzibar", description: "Pristine beaches and island paradise" },
{ icon: Palmtree, title: "Tanganyika", description: "Deep waters and remote wilderness" },
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
title="Gallery & Photography FAQ"
description="Learn more about our photography collection and booking adventures."
tag="Gallery Info"
textboxLayout="default"
faqsAnimation="slide-up"
useInvertedBackground={true}
faqs={[
{
id: "1", title: "Can I use these photos for my project?", content: "Yes, our gallery photos are available for various uses. Contact us for licensing information and commercial usage rights."},
{
id: "2", title: "Are these photos from actual tours?", content: "Absolutely! Every image in our gallery is captured during real tours with our guests. They represent authentic moments from our safaris and beach experiences."},
{
id: "3", title: "Do you offer photography tours?", content: "Yes! We offer specialized photography safaris with expert guides and prime photo opportunities. Contact our team for details on our dedicated photography packages."},
{
id: "4", title: "Can I request specific photo locations?", content: "Of course. When booking, let us know your photography interests and we'll customize your itinerary to include your desired photo opportunities."},
{
id: "5", title: "What equipment do you recommend for safari photography?", content: "We recommend a good DSLR or mirrorless camera with a zoom lens (70-300mm or similar). Our guides can provide photography tips and locations during your tour."},
{
id: "6", title: "Are high-resolution versions available?", content: "Yes, we can provide high-resolution versions of gallery photos for specific requests. Contact us with the image details."},
{
id: "7", title: "When is the best time for photography?", content: "Early morning and late afternoon offer the best light. During the dry season (June-October), visibility and wildlife viewing are optimal for photography."},
{
id: "8", title: "Can I share my own photos from the tour?", content: "Absolutely! We love seeing photos captured by our guests. Feel free to tag us on social media - we may feature your amazing shots!"},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
text="Ready to embark on the adventure of a lifetime? Let's plan your perfect Tanzania experience."
text="Ready to create your own gallery of unforgettable memories? Book your Tanzania adventure today!"
animationType="entrance-slide"
background={{ variant: "aurora" }}
background={{ variant: "plain" }}
useInvertedBackground={false}
buttons={[
{ text: "Plan Your Safari", href: "/booking" },
{ text: "Get in Touch", href: "/" },
{ text: "Book Your Tour", href: "/booking" },
{ text: "View Packages", href: "/safari-packages" },
]}
/>
</div>

265
src/app/safari-packages/page.tsx
View File

@@ -4,12 +4,13 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
import ProductCardThree from "@/components/sections/product/ProductCardThree";
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import FaqDouble from "@/components/sections/faq/FaqDouble";
import ContactText from "@/components/sections/contact/ContactText";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import Link from "next/link";
import { Compass, Sparkles, Mountain, Droplet, Trees, Zap, Waves, PalmTree, Quote } from "lucide-react";
import { Compass, MapPin, Award, Sparkles, Mountain, Droplet, Trees, Zap, Waves, Palmtree } from "lucide-react";
export default function SafariPackagesPage() {
const navItems = [
@@ -22,17 +23,15 @@ export default function SafariPackagesPage() {
const footerColumns = [
{
title: "Destinations",
items: [
{ label: "Serengeti Safari", href: "#serengeti" },
{ label: "Ngorongoro Crater", href: "#ngorongoro" },
{ label: "Mount Kilimanjaro", href: "#kilimanjaro" },
title: "Destinations", items: [
{ label: "Serengeti Safari", href: "/destinations#serengeti" },
{ label: "Ngorongoro Crater", href: "/destinations#ngorongoro" },
{ label: "Mount Kilimanjaro", href: "/destinations#kilimanjaro" },
{ label: "Zanzibar Island", href: "/zanzibar-tours" },
],
},
{
title: "Experiences",
items: [
title: "Experiences", items: [
{ label: "Safari Packages", href: "/safari-packages" },
{ label: "Beach Retreats", href: "/zanzibar-tours" },
{ label: "Custom Tours", href: "/booking" },
@@ -40,17 +39,15 @@ export default function SafariPackagesPage() {
],
},
{
title: "Company",
items: [
{ label: "About Us", href: "/" },
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Contact", href: "/contact" },
{ label: "Testimonials", href: "#testimonials" },
{ label: "Careers", href: "#" },
],
},
{
title: "Support",
items: [
title: "Support", items: [
{ label: "FAQ", href: "#faq" },
{ label: "Travel Guide", href: "#" },
{ label: "Booking Help", href: "#" },
@@ -71,7 +68,7 @@ export default function SafariPackagesPage() {
borderRadius="rounded"
contentWidth="smallMedium"
sizing="largeSizeMediumTitles"
background="aurora"
background="circleGradient"
cardStyle="soft-shadow"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="radial-glow"
@@ -87,29 +84,29 @@ export default function SafariPackagesPage() {
<div id="hero" data-section="hero" className="relative overflow-hidden">
<HeroSplitKpi
background={{ variant: "aurora" }}
title="Luxury Safari Packages - Tanzania's Best Wildlife Tours"
description="Experience the ultimate African adventure with our expertly curated safari packages. From intimate wildlife encounters to luxury lodges, every moment is designed for unforgettable memories."
tag="Explore Tanzania"
background={{ variant: "glowing-orb" }}
title="Premium Safari Packages"
description="Explore Tanzania's most iconic destinations with curated luxury safari experiences designed for discerning travelers seeking authentic African adventures."
tag="Safari Adventures"
tagIcon={Compass}
enableKpiAnimation={true}
kpis={[
{ value: "20+", label: "Years of Excellence" },
{ value: "5000+", label: "Happy Travelers" },
{ value: "100%", label: "Satisfaction Rate" },
{ value: "20+", label: "Years Experience" },
{ value: "50+", label: "Destinations" },
{ value: "5000+", label: "Happy Guests" },
]}
buttons={[
{ text: "Book Your Safari", href: "/booking" },
{ text: "View All Packages", href: "#safaris" },
{ text: "Custom Package", href: "/contact" },
]}
imageSrc="http://img.b2bpic.net/free-photo/lonely-acacia-tree-camelthorne-with-blue-sky-background-etosha-national-park-namibia-south-africa_1150-21621.jpg?_wi=2"
imageSrc="http://img.b2bpic.net/free-photo/lonely-acacia-tree-camelthorne-with-blue-sky-background-etosha-national-park-namibia-south-africa_1150-21621.jpg"
imageAlt="Stunning Tanzanian safari landscape with wildlife"
imagePosition="right"
mediaAnimation="slide-up"
/>
</div>
<div id="safaris" data-section="safaris" className="bg-gradient-to-b from-transparent to-accent/5">
<div id="packages" data-section="packages">
<ProductCardThree
title="Featured Safari Packages"
description="Curated luxury safari experiences designed for discerning travelers seeking authentic African adventures."
@@ -121,51 +118,36 @@ export default function SafariPackagesPage() {
gridVariant="three-columns-all-equal-width"
products={[
{
id: "1",
name: "Serengeti Safari Experience",
price: "$4,500",
imageSrc: "http://img.b2bpic.net/free-photo/bison-wild-sunny-day_23-2151689001.jpg?_wi=2",
imageAlt: "Serengeti National Park safari with wildlife",
},
id: "1", name: "Serengeti Safari Experience", price: "$4,500", imageSrc: "http://img.b2bpic.net/free-photo/bison-wild-sunny-day_23-2151689001.jpg", imageAlt: "Serengeti National Park safari with wildlife"},
{
id: "2",
name: "Ngorongoro Crater Adventure",
price: "$3,800",
imageSrc: "http://img.b2bpic.net/free-photo/tribe-wild-horses-eating-grass-field_181624-2323.jpg?_wi=2",
imageAlt: "Ngorongoro Crater landscape and wildlife",
},
id: "2", name: "Ngorongoro Crater Adventure", price: "$3,800", imageSrc: "http://img.b2bpic.net/free-photo/tribe-wild-horses-eating-grass-field_181624-2323.jpg", imageAlt: "Ngorongoro Crater landscape and wildlife"},
{
id: "3",
name: "Tarangire National Park Safari",
price: "$3,200",
imageSrc: "http://img.b2bpic.net/free-photo/african-savannah-scene-black-white_23-2151774061.jpg?_wi=2",
imageAlt: "Tarangire National Park with elephants",
},
id: "3", name: "Tarangire National Park Safari", price: "$3,200", imageSrc: "http://img.b2bpic.net/free-photo/african-savannah-scene-black-white_23-2151774061.jpg", imageAlt: "Tarangire National Park with elephants"},
{
id: "4",
name: "Big Five Luxury Safari",
price: "$6,200",
imageSrc: "http://img.b2bpic.net/free-vector/wild-animals-collection_1308-331.jpg?_wi=2",
imageAlt: "Luxury Big Five safari experience",
},
id: "4", name: "Big Five Luxury Safari", price: "$6,200", imageSrc: "http://img.b2bpic.net/free-vector/wild-animals-collection_1308-331.jpg", imageAlt: "Luxury Big Five safari experience"},
{
id: "5",
name: "Mount Kilimanjaro Trek",
price: "$2,800",
imageSrc: "http://img.b2bpic.net/free-photo/view-spectacular-nature-landscape_23-2150763652.jpg?_wi=2",
imageAlt: "Mount Kilimanjaro expedition",
},
id: "5", name: "Mount Kilimanjaro Trek", price: "$2,800", imageSrc: "http://img.b2bpic.net/free-photo/view-spectacular-nature-landscape_23-2150763652.jpg", imageAlt: "Mount Kilimanjaro expedition"},
{
id: "6",
name: "Extended 10-Day Expedition",
price: "$8,500",
imageSrc: "http://img.b2bpic.net/free-photo/lonely-acacia-tree-camelthorne-with-blue-sky-background-etosha-national-park-namibia-south-africa_1150-21621.jpg?_wi=3",
imageAlt: "Comprehensive Tanzania safari experience",
},
id: "6", name: "Zanzibar Beach Holiday", price: "$3,500", imageSrc: "http://img.b2bpic.net/free-photo/maldives-island_1203-7353.jpg", imageAlt: "Luxury Zanzibar beach resort"},
]}
/>
</div>
<div id="why-choose" data-section="why-choose">
<TestimonialAboutCard
tag="Why Choose Us"
tagIcon={Award}
title="World-Class Safari Experiences"
description="SK Tours & Safaris"
subdescription="Premium Travel Since 2004"
icon={MapPin}
imageSrc="http://img.b2bpic.net/free-photo/happy-retired-couple-enjoying-nature-californian-forest_53876-105617.jpg"
imageAlt="SK Tours & Safaris expert guides and luxury camps"
mediaAnimation="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="destinations" data-section="destinations">
<FeatureHoverPattern
title="Explore Iconic African Destinations"
@@ -175,157 +157,54 @@ export default function SafariPackagesPage() {
animationType="blur-reveal"
useInvertedBackground={true}
features={[
{
icon: Mountain,
title: "Serengeti National Park",
description: "Experience the Great Migration and encounter the Big Five in their natural habitat.",
},
{
icon: Droplet,
title: "Ngorongoro Crater",
description: "The world's largest intact caldera with incredible biodiversity and stunning landscapes.",
},
{
icon: Trees,
title: "Tarangire National Park",
description: "Famous for its massive elephant populations and scenic landscapes along the river.",
},
{
icon: Zap,
title: "Mount Kilimanjaro",
description: "Africa's highest peak offers an epic trekking experience with breathtaking views.",
},
{
icon: Waves,
title: "Zanzibar Island",
description: "Pristine beaches, turquoise waters, and luxury resorts for the perfect tropical escape.",
},
{
icon: PalmTree,
title: "Lake Tanganyika",
description: "Africa's deepest lake offering unique wildlife, diving, and remote exploration.",
},
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
title="What Our Safari Guests Say"
description="Join thousands of satisfied travelers who've experienced the magic of Tanzania with SK Tours & Safaris."
tag="Guest Reviews"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
showRating={true}
testimonials={[
{
id: "1",
name: "Sarah Mitchell",
handle: "@sarahmitchell",
testimonial: "SK Tours provided the most incredible safari experience of my life. The guides were knowledgeable, the camps were luxurious, and every moment was magical. Highly recommend!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/side-view-young-traveller-happy-be-outdoors_23-2148588534.jpg?_wi=2",
imageAlt: "Professional woman portrait headshot smile",
},
{
id: "2",
name: "James Richardson",
handle: "@jamesrich",
testimonial: "From the moment we arrived to the moment we left, every detail was perfectly arranged. The professionalism and passion of the SK Tours team is unmatched.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/handsome-traveler-hiking_1098-15180.jpg?_wi=2",
imageAlt: "Professional man portrait headshot business",
},
{
id: "3",
name: "Elena Rodriguez",
handle: "@eleanarod",
testimonial: "The Serengeti safari was absolutely stunning. The wildlife encounters were frequent and thrilling, and the luxury lodges provided the perfect retreat each evening.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-bikini-hat-looking-camera-beach-sunshine_107420-9983.jpg?_wi=2",
imageAlt: "Woman traveler portrait beach background",
},
{
id: "4",
name: "David Chen",
handle: "@dchen",
testimonial: "Worth every penny. The Big Five safari was a once-in-a-lifetime experience. The photography opportunities were incredible, and the luxury lodges exceeded all expectations.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/confident-entrepreneur-satisfied-with-own-success_1163-5474.jpg?_wi=2",
imageAlt: "Male professional portrait photography",
},
{
id: "5",
name: "Victoria Thompson",
handle: "@vthompson",
testimonial: "SK Tours combines adventure with comfort in a way I've never experienced. The attention to detail and personalized service made our trip absolutely perfect.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-business-lady_1163-3171.jpg?_wi=2",
imageAlt: "Woman executive professional portrait",
},
{
id: "6",
name: "Marco Rossi",
handle: "@marcorossi",
testimonial: "As a seasoned traveler, I can say SK Tours is among the best tourism operators I've encountered. Professionalism, safety, and unforgettable experiences guaranteed.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-mature-businessman-looking-away_23-2147955371.jpg?_wi=2",
imageAlt: "Man professional portrait businessman",
},
{ icon: Mountain, title: "Serengeti National Park", description: "Experience the Great Migration and encounter the Big Five in their natural habitat." },
{ icon: Droplet, title: "Ngorongoro Crater", description: "The world's largest intact caldera with incredible biodiversity and stunning landscapes." },
{ icon: Trees, title: "Tarangire National Park", description: "Famous for its massive elephant populations and scenic landscapes along the river." },
{ icon: Zap, title: "Mount Kilimanjaro", description: "Africa's highest peak offers an epic trekking experience with breathtaking views." },
{ icon: Waves, title: "Zanzibar Island", description: "Pristine beaches, turquoise waters, and luxury resorts for the perfect tropical escape." },
{ icon: Palmtree, title: "Lake Tanganyika", description: "Africa's deepest lake offering unique wildlife, diving, and remote exploration." },
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
title="Safari Package FAQs"
description="Find answers to common questions about our safari packages, booking process, and what to expect."
title="Safari Packages FAQ"
description="Find answers to common questions about our safari packages and booking process."
tag="Help & Support"
textboxLayout="default"
faqsAnimation="slide-up"
useInvertedBackground={true}
faqs={[
{
id: "1",
title: "What is the best time to visit Tanzania for safari?",
content: "The best time for safari is June to October during the dry season when wildlife is concentrated around water sources and vegetation is sparse, making wildlife viewing easier. However, Tanzania offers great safari experiences year-round, with different advantages in each season.",
},
id: "1", title: "What is the best time to visit Tanzania?", content: "The best time for safari is June to October during the dry season when wildlife is concentrated around water sources. Zanzibar is beautiful year-round, but November to March offers the warmest weather and calmest seas."},
{
id: "2",
title: "What should I pack for a safari?",
content: "Pack neutral-colored clothing, comfortable walking shoes, sunscreen, binoculars, and a good camera. Bring light layers as it can be cool at dawn and dusk. Our team will provide a detailed packing list with your booking confirmation.",
},
id: "2", title: "What should I pack for a safari?", content: "Pack neutral-colored clothing, comfortable walking shoes, sunscreen, binoculars, and a camera. Bring light layers as it can be cool at dawn and dusk. Our team will provide a detailed packing list with your booking confirmation."},
{
id: "3",
title: "Do you offer family-friendly safari experiences?",
content: "Absolutely! We have family packages with age-appropriate activities, experienced guides skilled with children, and luxury accommodations suitable for families. We can customize itineraries to match your family's interests and comfort levels.",
},
id: "3", title: "Do you offer family-friendly safari experiences?", content: "Absolutely! We have family packages with age-appropriate activities, experienced guides skilled with children, and luxury accommodations suitable for families. We can customize itineraries to match your family's interests."},
{
id: "4",
title: "What is included in the safari package prices?",
content: "Our packages typically include accommodation, meals, game drives, professional guides, and park fees. Premium packages also include flights, transfers, and exclusive experiences. Full details are provided with each package description.",
},
id: "4", title: "What is included in the safari package prices?", content: "Our packages typically include accommodation, meals, game drives, professional guides, and park fees. Premium packages also include flights, transfers, and exclusive experiences. Full details are provided with each package."},
{
id: "5",
title: "How many days minimum should I book for a safari?",
content: "We recommend a minimum of 4-5 days for a meaningful safari experience. However, we offer flexible packages from 2 days to extended 10+ day trips. Longer stays allow deeper exploration and higher wildlife viewing odds.",
},
id: "5", title: "How many days minimum should I book?", content: "We recommend a minimum of 4-5 days for a meaningful safari experience. However, we offer flexible packages from 2 days to extended 10+ day trips. Longer stays allow deeper exploration and higher wildlife viewing odds."},
{
id: "6",
title: "What about travel insurance and vaccinations?",
content: "We strongly recommend travel insurance. Vaccinations like yellow fever, malaria prophylaxis, and routine immunizations are typically recommended. Consult your doctor 4-6 weeks before departure. We'll provide detailed health information upon booking.",
},
id: "6", title: "What about travel insurance and vaccinations?", content: "We strongly recommend travel insurance. Vaccinations like yellow fever, malaria prophylaxis, and routine immunizations are typically recommended. Consult your doctor 4-6 weeks before departure. We'll provide detailed health information upon booking."},
{
id: "7",
title: "Are your guides certified and experienced?",
content: "Yes, all our guides are certified by the Tanzania Tourist Board and have 5+ years of experience. They undergo regular training in wildlife biology, safety, and hospitality to ensure you receive world-class service.",
},
id: "7", title: "Are your guides certified and experienced?", content: "Yes, all our guides are certified by the Tanzania Tourist Board and have 5+ years of experience. They undergo regular training in wildlife biology, safety, and hospitality to ensure you receive world-class service."},
{
id: "8",
title: "Can I combine safari with other destinations?",
content: "Perfectly! Many guests combine a safari with Zanzibar beach retreats. We offer curated combination packages that include flights between destinations, creating a seamless and unforgettable experience.",
},
id: "8", title: "Can I combine safari and Zanzibar in one trip?", content: "Perfectly! Many guests combine a safari with a Zanzibar beach retreat. We offer curated combination packages that include flights between destinations, creating a seamless and unforgettable experience."},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
text="Ready to embark on the adventure of a lifetime? Let's plan your perfect Tanzania safari experience."
animationType="entrance-slide"
background={{ variant: "plain" }}
useInvertedBackground={false}
buttons={[
{ text: "Book Your Safari", href: "/booking" },
{ text: "Get in Touch", href: "/contact" },
]}
/>
</div>

141
src/app/zanzibar-tours/page.tsx
View File

@@ -5,11 +5,12 @@ import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarS
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
import ProductCardThree from "@/components/sections/product/ProductCardThree";
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
import FaqDouble from "@/components/sections/faq/FaqDouble";
import ContactText from "@/components/sections/contact/ContactText";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import Link from "next/link";
import { Compass, Sun, Award, Quote } from "lucide-react";
import { Compass, MapPin, Award, Sparkles, Mountain, Droplet, Trees, Zap, Waves, Palmtree } from "lucide-react";
export default function ZanzibarToursPage() {
const navItems = [
@@ -23,9 +24,9 @@ export default function ZanzibarToursPage() {
const footerColumns = [
{
title: "Destinations", items: [
{ label: "Serengeti Safari", href: "#serengeti" },
{ label: "Ngorongoro Crater", href: "#ngorongoro" },
{ label: "Mount Kilimanjaro", href: "#kilimanjaro" },
{ label: "Serengeti Safari", href: "/destinations#serengeti" },
{ label: "Ngorongoro Crater", href: "/destinations#ngorongoro" },
{ label: "Mount Kilimanjaro", href: "/destinations#kilimanjaro" },
{ label: "Zanzibar Island", href: "/zanzibar-tours" },
],
},
@@ -39,7 +40,7 @@ export default function ZanzibarToursPage() {
},
{
title: "Company", items: [
{ label: "About Us", href: "/" },
{ label: "About Us", href: "/about" },
{ label: "Contact", href: "/contact" },
{ label: "Testimonials", href: "#testimonials" },
{ label: "Careers", href: "#" },
@@ -67,7 +68,7 @@ export default function ZanzibarToursPage() {
borderRadius="rounded"
contentWidth="smallMedium"
sizing="largeSizeMediumTitles"
background="aurora"
background="circleGradient"
cardStyle="soft-shadow"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="radial-glow"
@@ -83,49 +84,34 @@ export default function ZanzibarToursPage() {
<div id="hero" data-section="hero" className="relative overflow-hidden">
<HeroSplitKpi
background={{ variant: "aurora" }}
title="Zanzibar Beach Holidays - Luxury Island Escapes"
description="Discover paradise with pristine white-sand beaches, turquoise waters, and world-class luxury resorts. Zanzibar awaits with the perfect blend of relaxation and adventure."
background={{ variant: "glowing-orb" }}
title="Zanzibar Island Paradise"
description="Experience luxury island living with pristine beaches, turquoise waters, and world-class resorts. Your tropical escape awaits in Zanzibar."
tag="Tropical Paradise"
tagIcon={Compass}
enableKpiAnimation={true}
kpis={[
{ value: "20+", label: "Years of Excellence" },
{ value: "5000+", label: "Happy Travelers" },
{ value: "100%", label: "Satisfaction Rate" },
{ value: "100%", label: "Paradise Experience" },
{ value: "5-Star", label: "Luxury Resorts" },
{ value: "Year-Round", label: "Escape Ready" },
]}
buttons={[
{ text: "Book Your Beach Escape", href: "/booking" },
{ text: "View All Retreats", href: "#zanzibar" },
{ text: "Book Your Escape", href: "/booking" },
{ text: "View Packages", href: "/zanzibar-tours" },
]}
imageSrc="http://img.b2bpic.net/free-photo/maldives-island_1203-7353.jpg"
imageAlt="Zanzibar beach turquoise water luxury"
imageAlt="Luxury Zanzibar beach resort with turquoise waters"
imagePosition="right"
mediaAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
tag="Zanzibar Experience"
tagIcon={Sun}
title="Paradise Found at the Spice Island"
description="Zanzibar Island"
subdescription="The Jewel of East Africa"
icon={Award}
imageSrc="http://img.b2bpic.net/free-photo/couple-talking-drinking-coconut-milk-by-pool-vacation_23-2149369768.jpg"
imageAlt="Luxury beach resort beachfront villa"
mediaAnimation="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="zanzibar" data-section="zanzibar" className="bg-gradient-to-t from-transparent to-accent/5">
<div id="retreats" data-section="retreats">
<ProductCardThree
title="Zanzibar Beach Retreats"
description="Paradise awaits. Experience luxury island living with pristine beaches, turquoise waters, and world-class resorts."
tag="Tropical Paradise"
tagIcon={Sun}
tagIcon={Waves}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={true}
@@ -143,63 +129,78 @@ export default function ZanzibarToursPage() {
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
title="What Beach Guests Love About Zanzibar"
description="Hear from travelers who've experienced our Zanzibar luxury retreats and island experiences."
tag="Guest Reviews"
textboxLayout="default"
animationType="slide-up"
<div id="why-zanzibar" data-section="why-zanzibar">
<TestimonialAboutCard
tag="Why Zanzibar"
tagIcon={Award}
title="The Perfect Tropical Escape"
description="Zanzibar Island"
subdescription="Where Paradise Meets Luxury"
icon={MapPin}
imageSrc="http://img.b2bpic.net/free-photo/happy-retired-couple-enjoying-nature-californian-forest_53876-105617.jpg"
imageAlt="Zanzibar island paradise beach experience"
mediaAnimation="slide-up"
useInvertedBackground={false}
showRating={true}
testimonials={[
{
id: "1", name: "Sarah Mitchell", handle: "@sarahmitchell", testimonial: "Zanzibar was absolutely stunning thanks to SK Tours. The beach resorts were world-class and the local experiences were authentic and unforgettable.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/side-view-young-traveller-happy-be-outdoors_23-2148588534.jpg", imageAlt: "Professional woman portrait headshot smile"},
{
id: "2", name: "James Richardson", handle: "@jamesrich", testimonial: "The private beach villa was the perfect romantic getaway. Waking up to turquoise waters and pristine sand every morning felt like a dream come true.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/handsome-traveler-hiking_1098-15180.jpg", imageAlt: "Professional man portrait headshot business"},
{
id: "3", name: "Elena Rodriguez", handle: "@eleanarod", testimonial: "The Spice Island tour was fascinating and educational. The guides shared incredible knowledge about Zanzibar's history and culture. Highly recommended!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-bikini-hat-looking-camera-beach-sunshine_107420-9983.jpg", imageAlt: "Woman traveler portrait beach background"},
{
id: "4", name: "David Chen", handle: "@dchen", testimonial: "The sunset dhow cruise was magical. Sailing on the Indian Ocean with a cocktail in hand, watching the sun disappear over the horizon - pure magic.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/confident-entrepreneur-satisfied-with-own-success_1163-5474.jpg", imageAlt: "Male professional portrait photography"},
{
id: "5", name: "Victoria Thompson", handle: "@vthompson", testimonial: "Perfect blend of relaxation and adventure. The resort's spa treatments paired with water activities made for an ideal vacation.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-business-lady_1163-3171.jpg", imageAlt: "Woman executive professional portrait"},
{
id: "6", name: "Marco Rossi", handle: "@marcorossi", testimonial: "Zanzibar through SK Tours was the ultimate luxury experience. Every meal, every service, every moment exceeded expectations. I'm already planning my return trip.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-mature-businessman-looking-away_23-2147955371.jpg", imageAlt: "Man professional portrait businessman"},
/>
</div>
<div id="activities" data-section="activities">
<FeatureHoverPattern
title="Zanzibar Activities & Experiences"
description="From pristine beaches to cultural adventures, Zanzibar offers unforgettable island experiences."
tag="Island Activities"
textboxLayout="default"
animationType="blur-reveal"
useInvertedBackground={true}
features={[
{ icon: Waves, title: "Beach Bliss", description: "Crystal-clear waters, white sand beaches, and perfect sunsets." },
{ icon: Droplet, title: "Water Sports", description: "Diving, snorkeling, and water adventures in tropical paradise." },
{ icon: Mountain, title: "Island Tours", description: "Explore historic sites, Stone Town, and local culture." },
{ icon: Trees, title: "Spice Tours", description: "Discover Zanzibar's famous spice plantations and gardens." },
{ icon: Zap, title: "Sunset Cruises", description: "Romantic dhow cruises with breathtaking ocean views." },
{ icon: Palmtree, title: "Resort Relaxation", description: "Spa treatments, luxury amenities, and world-class dining." },
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
title="Zanzibar Beach Retreat FAQs"
description="Find answers to common questions about our Zanzibar tours, island experiences, and beach packages."
title="Zanzibar Tours FAQ"
description="Find answers to common questions about our Zanzibar beach packages."
tag="Help & Support"
textboxLayout="default"
faqsAnimation="slide-up"
useInvertedBackground={true}
faqs={[
{
id: "1", title: "What is the best time to visit Zanzibar?", content: "Zanzibar is beautiful year-round, but November to March offers the warmest weather and calmest seas. June to October is the coolest season with moderate rainfall. December to February can be hot and humid, so consider your comfort preferences when booking."},
id: "1", title: "What's the best time to visit Zanzibar?", content: "November to March offers warm weather and calm seas. June to August is cooler and ideal for diving. September to October brings strong winds but fewer tourists. Year-round, the island is beautiful with something unique in every season."},
{
id: "2", title: "What activities are available in Zanzibar?", content: "Zanzibar offers beach relaxation, snorkeling, diving, water sports, spice plantation tours, cultural excursions to Stone Town, dhow sailing cruises, and local market visits. Our packages can be customized to include your preferred activities."},
id: "2", title: "Do I need a visa for Zanzibar?", content: "Zanzibar is part of Tanzania, so visa requirements are the same. Most nationalities can obtain a visa on arrival or apply for an e-visa. Check current regulations with your country's embassy before travel."},
{
id: "3", title: "Are meals included in the beach resort packages?", content: "Most of our resort packages include daily breakfast and either half-board (breakfast and dinner) or full-board (all meals). Specific meal inclusions vary by package. Check your booking details or contact us for clarification on your specific package."},
id: "3", title: "How do I get to Zanzibar?", content: "Fly from Dar es Salaam to Zanzibar (45 minutes), or we can arrange flights from international airports. We handle all transportation arrangements as part of our packages."},
{
id: "4", title: "What water sports can I enjoy in Zanzibar?", content: "Popular water sports include snorkeling, scuba diving, surfing, kitesurfing, windsurfing, paddleboarding, and jet skiing. The warm tropical waters and coral reefs make Zanzibar a premier water sports destination."},
id: "4", title: "What activities are available in Zanzibar?", content: "Enjoy snorkeling, diving, dhow cruises, spice plantation tours, historical Stone Town tours, water sports, spa treatments, and pristine beach relaxation. We customize activities based on your interests."},
{
id: "5", title: "How long should I spend in Zanzibar?", content: "We recommend at least 3-4 days to fully experience Zanzibar. However, many visitors combine Zanzibar with a safari for a 7-10 day adventure, or stay for a full week for ultimate relaxation."},
id: "5", title: "Is Zanzibar safe for tourists?", content: "Yes, Zanzibar is generally safe for tourists. Stick to well-traveled areas, avoid valuables on the beach, and follow local advice. Our guides are experienced and ensure your safety throughout your stay."},
{
id: "6", title: "Can I visit Zanzibar after a safari?", content: "Absolutely! This is one of our most popular combination packages. We arrange flights from safari locations to Zanzibar and seamless transfers, allowing you to enjoy wildlife then unwind on pristine beaches."},
id: "6", title: "What should I pack for Zanzibar?", content: "Pack light, breathable clothing, swimwear, sun protection, comfortable sandals, snorkeling gear optional, and insect repellent. Modest clothing is appreciated when visiting cultural sites and local villages."},
{
id: "7", title: "What is Stone Town and should I visit?", content: "Stone Town is Zanzibar's historic capital with narrow winding streets, ancient architecture, and vibrant markets. It's a UNESCO World Heritage Site and offers fascinating cultural insights. We can arrange guided tours as part of your package."},
id: "7", title: "Can I combine Zanzibar with a safari?", content: "Absolutely! Our popular combo packages include a safari followed by beach relaxation in Zanzibar. This creates a perfect balance of adventure and tropical paradise."},
{
id: "8", title: "Is it safe to travel to Zanzibar?", content: "Yes, Zanzibar is generally safe for tourists. Follow standard travel precautions and stay aware of your surroundings. Our guides and resort staff are experienced in guest safety and will provide local recommendations."},
id: "8", title: "What's the food like in Zanzibar?", content: "Zanzibar is famous for seafood, Swahili cuisine, and spices. Expect fresh fish, coconut-based dishes, and tropical fruits. Our resorts offer international and local cuisine options to suit all preferences."},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
text="Ready to escape to paradise? Book your Zanzibar island getaway today and experience tropical bliss!"
animationType="entrance-slide"
background={{ variant: "plain" }}
useInvertedBackground={false}
buttons={[
{ text: "Book Your Escape", href: "/booking" },
{ text: "Get in Touch", href: "/contact" },
]}
/>
</div>

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

@@ -1,51 +1,51 @@
"use client";
import { memo } from "react";
import useSvgTextLogo from "./useSvgTextLogo";
import { cls } from "@/lib/utils";
import React from 'react';
import { cn } from '@/lib/utils';
interface SvgTextLogoProps {
logoText: string;
adjustHeightFactor?: number;
verticalAlign?: "top" | "center";
text: string;
className?: string;
fontSize?: number;
letterSpacing?: number;
dominantBaseline?: 'auto' | 'text-bottom' | 'alphabetic' | 'ideographic' | 'middle' | 'central' | 'hanging' | 'mathematical';
}
const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
logoText,
adjustHeightFactor,
verticalAlign = "top",
className = "",
}) {
const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
export const SvgTextLogo = React.forwardRef<SVGSVGElement, SvgTextLogoProps>(
(
{
text,
className = '',
fontSize = 48,
letterSpacing = 2,
dominantBaseline = 'middle',
},
ref
) => {
const textLength = text.length;
const estimatedWidth = textLength * (fontSize * 0.6) + letterSpacing * (textLength - 1);
return (
<svg
ref={svgRef}
viewBox={viewBox}
className={cls("w-full", className)}
style={{ aspectRatio: aspectRatio }}
preserveAspectRatio="none"
role="img"
aria-label={`${logoText} logo`}
>
<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"
}}
return (
<svg
ref={ref}
viewBox={`0 0 ${estimatedWidth + 20} ${fontSize + 20}`}
width={estimatedWidth + 20}
height={fontSize + 20}
className={cn('w-auto h-auto', className)}
xmlns="http://www.w3.org/2000/svg"
>
{logoText}
</text>
</svg>
);
});
<text
x={10}
y={fontSize / 2 + 10}
fontSize={fontSize}
letterSpacing={letterSpacing}
fontWeight="bold"
fill="currentColor"
dominantBaseline={dominantBaseline}
>
{text}
</text>
</svg>
);
}
);
SvgTextLogo.displayName = "SvgTextLogo";
export default SvgTextLogo;
SvgTextLogo.displayName = 'SvgTextLogo';