250 lines
13 KiB
TypeScript
250 lines
13 KiB
TypeScript
"use client"
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
||
import TextAbout from '@/components/sections/about/TextAbout';
|
||
import FeatureBento from '@/components/sections/feature/FeatureBento';
|
||
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
||
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||
import { Crown, Diamond, Sparkles } from 'lucide-react';
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="directional-hover"
|
||
defaultTextAnimation="background-highlight"
|
||
borderRadius="rounded"
|
||
contentWidth="small"
|
||
sizing="largeSmallSizeMediumTitles"
|
||
background="aurora"
|
||
cardStyle="gradient-mesh"
|
||
primaryButtonStyle="shadow"
|
||
secondaryButtonStyle="solid"
|
||
headingFontWeight="medium"
|
||
>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingOverlay
|
||
brandName="Luxury Haven"
|
||
navItems={[
|
||
{ name: "Rooms", id: "rooms" },
|
||
{ name: "Amenities", id: "amenities" },
|
||
{ name: "About", id: "about" },
|
||
{ name: "Testimonials", id: "testimonials" },
|
||
{ name: "Contact", id: "contact" }
|
||
]}
|
||
button={{
|
||
text: "Book Now", href: "pricing"
|
||
}}
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroOverlay
|
||
title="Experience Luxury & Comfort"
|
||
description="Discover your perfect getaway at Luxury Haven. Premium accommodations with world-class amenities and exceptional hospitality."
|
||
tag="5-Star Hotel Experience"
|
||
imageSrc="http://img.b2bpic.net/free-photo/wooden-sauna-with-mountain-view-panoramic-calm_169016-70823.jpg"
|
||
imageAlt="luxury hotel lobby elegant interior modern hospitality 5-star hotel"
|
||
textPosition="bottom-left"
|
||
showBlur={true}
|
||
showDimOverlay={true}
|
||
buttons={[
|
||
{ text: "Book Your Stay", href: "pricing" },
|
||
{ text: "Explore Rooms", href: "rooms" }
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<TextAbout
|
||
tag="About Us"
|
||
title="Welcome to Luxury Haven – Where Every Moment Becomes a Memory"
|
||
useInvertedBackground={false}
|
||
buttons={[
|
||
{ text: "View Our Story", href: "https://example.com/story" }
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="amenities" data-section="amenities">
|
||
<FeatureBento
|
||
title="World-Class Amenities"
|
||
description="Indulge in our comprehensive range of facilities designed for your comfort and relaxation"
|
||
tag="Amenities"
|
||
features={[
|
||
{
|
||
title: "Spa & Wellness", description: "Rejuvenate with our full-service spa offering massages, facials, and holistic treatments", bentoComponent: "globe"
|
||
},
|
||
{
|
||
title: "Fine Dining", description: "Savor exquisite cuisine prepared by award-winning chefs at our signature restaurant", bentoComponent: "animated-bar-chart"
|
||
},
|
||
{
|
||
title: "Fitness Center", description: "Stay active with state-of-the-art gym equipment and personal training services", bentoComponent: "map"
|
||
},
|
||
{
|
||
title: "Resort Pool", description: "Relax by our Olympic-sized swimming pool with cabanas and poolside dining", bentoComponent: "line-chart"
|
||
}
|
||
]}
|
||
textboxLayout="default"
|
||
animationType="slide-up"
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
|
||
<div id="rooms" data-section="rooms">
|
||
<ProductCardFour
|
||
title="Our Premium Rooms"
|
||
description="Choose from our carefully curated selection of luxury accommodations"
|
||
tag="Room Selection"
|
||
products={[
|
||
{
|
||
id: "1", name: "Deluxe Room", price: "$250/night", variant: "King Bed • 450 sq ft • City View", imageSrc: "http://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111483.jpg?_wi=1", imageAlt: "luxury hotel room deluxe bedroom modern hotel room premium accommodation"
|
||
},
|
||
{
|
||
id: "2", name: "Executive Suite", price: "$450/night", variant: "2 Beds • 650 sq ft • Premium Amenities", imageSrc: "http://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111483.jpg?_wi=2", imageAlt: "luxury suite premium hotel suite spacious bedroom elegant room design"
|
||
},
|
||
{
|
||
id: "3", name: "Standard Room", price: "$180/night", variant: "Queen Bed • 350 sq ft • Garden View", imageSrc: "http://img.b2bpic.net/free-photo/hotel-room-with-open-balcony-soft-light-through-curtains-cozy-bedroom_169016-70022.jpg", imageAlt: "hotel room comfortable bedroom guest room modern hotel accommodation"
|
||
}
|
||
]}
|
||
gridVariant="uniform-all-items-equal"
|
||
textboxLayout="default"
|
||
animationType="slide-up"
|
||
useInvertedBackground={false}
|
||
carouselMode="buttons"
|
||
/>
|
||
</div>
|
||
|
||
<div id="features" data-section="features">
|
||
<MetricCardTwo
|
||
title="Why Choose Luxury Haven"
|
||
description="By the numbers – our commitment to excellence"
|
||
tag="Our Excellence"
|
||
metrics={[
|
||
{
|
||
id: "1", value: "25+", description: "Years of Hospitality Excellence"
|
||
},
|
||
{
|
||
id: "2", value: "500+", description: "Premium Guest Rooms"
|
||
},
|
||
{
|
||
id: "3", value: "98%", description: "Guest Satisfaction Rate"
|
||
},
|
||
{
|
||
id: "4", value: "15+", description: "Award-Winning Facilities"
|
||
}
|
||
]}
|
||
gridVariant="uniform-all-items-equal"
|
||
textboxLayout="default"
|
||
animationType="slide-up"
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
|
||
<div id="testimonials" data-section="testimonials">
|
||
<TestimonialCardSix
|
||
title="Guest Reviews"
|
||
description="Hear from our satisfied guests about their unforgettable experiences"
|
||
tag="Testimonials"
|
||
testimonials={[
|
||
{
|
||
id: "1", name: "Sarah Mitchell", handle: "Business Traveler", testimonial: "Absolutely exceptional! The service was impeccable and the accommodations surpassed all my expectations. I'll definitely return for my next business trip.", imageSrc: "http://img.b2bpic.net/free-photo/happy-businesswoman-smiling-looking-camera-successful-confident-grey-haired-manager-sitting-office-room-workplace-business-management-concept_74855-7343.jpg", imageAlt: "woman portrait happy guest professional photo customer review"
|
||
},
|
||
{
|
||
id: "2", name: "James Rodriguez", handle: "Luxury Traveler", testimonial: "Five stars doesn't do justice to this hotel. Every detail was perfect, from the decor to the attentive staff. A truly luxurious experience.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport-terminal_107420-85070.jpg", imageAlt: "man portrait business traveler professional headshot customer testimonial"
|
||
},
|
||
{
|
||
id: "3", name: "Emily Chen", handle: "Couple's Retreat", testimonial: "Our honeymoon was made magical by the romantic ambiance and world-class service. We can't wait to come back with our families.", imageSrc: "http://img.b2bpic.net/free-photo/happy-couple-making-selfie-beach_23-2147648951.jpg", imageAlt: "couple portrait travel photo vacation guest family review"
|
||
},
|
||
{
|
||
id: "4", name: "Victoria Thompson", handle: "Leisure Guest", testimonial: "The spa treatments were heavenly and the dining experience was outstanding. This is the perfect place to unwind and relax.", imageSrc: "http://img.b2bpic.net/free-photo/woman-showing-ok-sign_23-2148990150.jpg", imageAlt: "woman smiling satisfied customer guest photo positive review"
|
||
},
|
||
{
|
||
id: "5", name: "Michael Anderson", handle: "Corporate Executive", testimonial: "Outstanding facilities and impeccable service. The conference rooms are top-notch and the team is incredibly professional.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-walking-with-trolley-bag-airport-terminal_107420-85050.jpg", imageAlt: "professional woman business guest corporate traveler guest portrait"
|
||
},
|
||
{
|
||
id: "6", name: "David Peterson", handle: "Frequent Guest", testimonial: "I've stayed at many luxury hotels, but Luxury Haven consistently exceeds expectations. The attention to detail is remarkable.", imageSrc: "http://img.b2bpic.net/free-photo/happy-stylish-caucasian-man-with-backpack-travel-rice-plantation-making-self-portrai-memories_273443-3007.jpg", imageAlt: "man portrait happy traveler satisfied guest customer photo"
|
||
}
|
||
]}
|
||
textboxLayout="default"
|
||
animationType="slide-up"
|
||
useInvertedBackground={false}
|
||
speed={50}
|
||
/>
|
||
</div>
|
||
|
||
<div id="pricing" data-section="pricing">
|
||
<PricingCardEight
|
||
title="Booking Plans"
|
||
description="Choose the perfect plan for your stay and unlock exclusive benefits"
|
||
tag="Special Offers"
|
||
plans={[
|
||
{
|
||
id: "standard", badge: "Popular Choice", badgeIcon: Sparkles,
|
||
price: "$180 - $250", subtitle: "Perfect for Standard & Deluxe Rooms", buttons: [
|
||
{ text: "Book Standard", href: "https://booking.example.com" }
|
||
],
|
||
features: [
|
||
"Complimentary breakfast", "Late checkout", "Free WiFi", "Gym access"
|
||
]
|
||
},
|
||
{
|
||
id: "premium", badge: "Best Value", badgeIcon: Crown,
|
||
price: "$450 - $650", subtitle: "Executive Suite & Premium Benefits", buttons: [
|
||
{ text: "Book Premium", href: "https://booking.example.com" }
|
||
],
|
||
features: [
|
||
"All Standard benefits", "Spa credit ($100)", "Fine dining discount", "Room upgrade guarantee", "Concierge service"
|
||
]
|
||
},
|
||
{
|
||
id: "vip", badge: "Exclusive", badgeIcon: Diamond,
|
||
price: "$1,000+", subtitle: "Presidential Suite & Full Service", buttons: [
|
||
{ text: "Book VIP", href: "https://booking.example.com" }
|
||
],
|
||
features: [
|
||
"All Premium benefits", "Personal butler service", "Private car service", "Unlimited dining credit", "Priority everything"
|
||
]
|
||
}
|
||
]}
|
||
textboxLayout="default"
|
||
animationType="slide-up"
|
||
useInvertedBackground={false}
|
||
carouselMode="buttons"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactCenter
|
||
tag="Stay Updated"
|
||
title="Subscribe to Our Newsletter"
|
||
description="Get exclusive deals, room updates, and hospitality tips delivered straight to your inbox. Join our community of satisfied guests."
|
||
background={{
|
||
variant: "radial-gradient"
|
||
}}
|
||
useInvertedBackground={false}
|
||
inputPlaceholder="Enter your email address"
|
||
buttonText="Subscribe"
|
||
termsText="We respect your privacy. Unsubscribe anytime. By subscribing, you agree to our terms and receive special hotel offers."
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterLogoReveal
|
||
logoText="Luxury Haven"
|
||
leftLink={{
|
||
text: "Privacy Policy", href: "#"
|
||
}}
|
||
rightLink={{
|
||
text: "Terms of Service", href: "#"
|
||
}}
|
||
/>
|
||
</div>
|
||
</ThemeProvider>
|
||
);
|
||
} |