169 lines
8.4 KiB
TypeScript
169 lines
8.4 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
|
import { CheckCircle, Shield, Star, Instagram, Twitter, Linkedin } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="large"
|
|
background="grid"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "Packages", id: "products" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "Contact", id: "contact" },
|
|
]}
|
|
brandName="Al Ghuraba"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardRotatedCarousel
|
|
background={{ variant: "rotated-rays-static" }}
|
|
title="Your Sacred Journey, Perfectly Guided"
|
|
description="Trusted Umrah packages from Australia with expert local guides, transparent pricing, and 24/7 pilgrim support. Experience spiritual peace without logistical stress."
|
|
buttons={[{ text: "Explore Packages", href: "#products" }]}
|
|
carouselItems={[
|
|
{ id: "c1", imageSrc: "https://img.b2bpic.net/free-photo/abstract-islamic-pattern-gold.jpg" },
|
|
{ id: "c2", imageSrc: "https://img.b2bpic.net/free-photo/modern-mosque-silhouette-gradient.jpg" },
|
|
{ id: "c3", imageSrc: "https://img.b2bpic.net/free-photo/abstract-geometric-islamic-art.jpg" },
|
|
{ id: "c4", imageSrc: "https://img.b2bpic.net/free-photo/gold-calligraphy-abstract-bg.jpg" },
|
|
{ id: "c5", imageSrc: "https://img.b2bpic.net/free-photo/islamic-geometric-pattern-minimal.jpg" },
|
|
{ id: "c6", imageSrc: "https://img.b2bpic.net/free-photo/minimal-mosque-dome-vector.jpg" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
title="Experience Peace of Mind"
|
|
description={[
|
|
"Al Ghuraba Travel specializes in crafting seamless pilgrimage journeys from Australia to the Holy Lands. We remove the complexities of visas, accommodation, and local transport so you can focus entirely on your devotion.", "Our experienced team is committed to providing service that honors the sanctity of your trip, offering dedicated support every step of the way."
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyFive
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
title="Why Trust Us?"
|
|
description="We ensure your focus remains on worship, while we handle the logistics."
|
|
features={[
|
|
{ title: "Visa Assistance", description: "Expert navigation of complex visa processes.", icon: CheckCircle, mediaItems: [{ imageSrc: "https://img.b2bpic.net/free-icon/visa-stamp-minimal.png" }, { imageSrc: "https://img.b2bpic.net/free-icon/document-flow-abstract.png" }] },
|
|
{ title: "24/7 Support", description: "Local guides available around the clock.", icon: Shield, mediaItems: [{ imageSrc: "https://img.b2bpic.net/free-icon/support-headset-minimal.png" }, { imageSrc: "https://img.b2bpic.net/free-icon/clock-shield-abstract.png" }] },
|
|
{ title: "Transparent Pricing", description: "No hidden costs. Everything outlined clearly.", icon: Star, mediaItems: [{ imageSrc: "https://img.b2bpic.net/free-icon/price-tag-minimal.png" }, { imageSrc: "https://img.b2bpic.net/free-icon/calculator-abstract.png" }] },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="two-columns-alternating-heights"
|
|
useInvertedBackground={false}
|
|
title="Premium Umrah Packages"
|
|
description="Tailored packages designed for families, community groups, and individuals."
|
|
products={[
|
|
{ id: "p1", name: "Executive Umrah", price: "From $5,999", imageSrc: "https://img.b2bpic.net/free-photo/abstract-gold-pattern.jpg" },
|
|
{ id: "p2", name: "Premium Comfort", price: "From $4,499", imageSrc: "https://img.b2bpic.net/free-photo/abstract-geometric-gold.jpg" },
|
|
{ id: "p3", name: "Essential Pilgrimage", price: "From $3,299", imageSrc: "https://img.b2bpic.net/free-photo/minimalist-mosque-vector.jpg" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardFive
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
title="Flexible Options"
|
|
description="Choose the journey that suits your spiritual and budgetary needs."
|
|
plans={[
|
|
{ id: "basic", tag: "Essentials", price: "$3,299", period: "/per person", description: "Everything essential for a comfortable journey.", button: { text: "Inquire Now" }, featuresTitle: "Includes:", features: ["Hotel", "Visa", "Guided"] },
|
|
{ id: "pro", tag: "Recommended", price: "$4,499", period: "/per person", description: "Greater comfort and premium accommodation.", button: { text: "Inquire Now" }, featuresTitle: "Includes:", features: ["4-star", "Support", "Full Catering"] },
|
|
{ id: "premium", tag: "Executive", price: "$5,999", period: "/per person", description: "The ultimate journey.", button: { text: "Inquire Now" }, featuresTitle: "Includes:", features: ["5-star", "VIP", "Priority"] },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTen
|
|
title="What Pilgrims Say"
|
|
description="Authentic experiences from our community."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{ id: "t1", title: "Excellent", quote: "Seamless experience.", name: "Sarah J.", role: "Pilgrim", imageSrc: "https://img.b2bpic.net/free-icon/avatar-abstract-1.png" },
|
|
{ id: "t2", title: "Great", quote: "Beautifully organized.", name: "Ahmed I.", role: "Organizer", imageSrc: "https://img.b2bpic.net/free-icon/avatar-abstract-2.png" },
|
|
{ id: "t3", title: "Wonderful", quote: "Truly stress-free.", name: "Fatima Z.", role: "Pilgrim", imageSrc: "https://img.b2bpic.net/free-icon/avatar-abstract-3.png" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
title="Common Questions"
|
|
description="Answers to assist you in planning your Umrah."
|
|
faqs={[
|
|
{ id: "f1", title: "Visa help?", content: "Yes, we handle all visas." },
|
|
{ id: "f2", title: "Accommodation?", content: "Yes, high-quality stays." },
|
|
]}
|
|
faqsAnimation="slide-up"
|
|
textboxLayout="default"
|
|
imageSrc="https://img.b2bpic.net/free-photo/geometric-mosque-art.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
title="Start Your Journey"
|
|
description="Reach out to our expert team for a free consultation."
|
|
imageSrc="https://img.b2bpic.net/free-photo/abstract-travel-concept-minimal.jpg"
|
|
useInvertedBackground={true}
|
|
background={{ variant: "animated-grid" }}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="Al Ghuraba Travel"
|
|
socialLinks={[
|
|
{ icon: Instagram, href: "#", ariaLabel: "Instagram" },
|
|
{ icon: Twitter, href: "#", ariaLabel: "Twitter" },
|
|
{ icon: Linkedin, href: "#", ariaLabel: "LinkedIn" },
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|