341 lines
14 KiB
TypeScript
341 lines
14 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import HeroLogoBillboardSplitImage from '@/components/sections/hero/HeroLogoBillboardSplitImage';
|
|
import AboutPhoneTimeline from '@/components/sections/about/AboutPhoneTimeline';
|
|
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
|
import MetricCardFive from '@/components/sections/metrics/MetricCardFive';
|
|
import ContactInline from '@/components/sections/contact/ContactInline';
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
|
|
export default function LuxeHavenPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="sharp"
|
|
contentWidth="large"
|
|
sizing="large"
|
|
background="animatedGrid"
|
|
cardStyle="elevated-accent-light"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="normal"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="Luxe Haven"
|
|
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185877436-fl4vf3vx.jpg"
|
|
logoAlt="Luxe Haven Hotel Logo"
|
|
navItems={[
|
|
{ name: "Rooms", id: "rooms" },
|
|
{ name: "Dining", id: "dining" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "About", id: "about" }
|
|
]}
|
|
button={{
|
|
text: "Reserve Now",
|
|
href: "#contact"
|
|
}}
|
|
className="fixed top-6 left-0 right-0 z-50 flex justify-center"
|
|
navItemClassName="text-sm font-medium transition-colors"
|
|
buttonClassName="px-6 py-2 rounded-lg font-medium"
|
|
buttonTextClassName="font-medium"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboardSplitImage
|
|
logoText="LUXE HAVEN"
|
|
description="Experience unparalleled luxury in our award-winning hotel. Where timeless elegance meets contemporary comfort. Discover the art of hospitality redefined."
|
|
buttons={[
|
|
{ text: "Reserve Your Stay", href: "#contact" },
|
|
{ text: "Explore Rooms", href: "#rooms" }
|
|
]}
|
|
layoutOrder="default"
|
|
splitImageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184712312-lhl1h85w.jpg"
|
|
splitImageAlt="Luxury hotel suite bedroom"
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184710583-yt05ru42.jpg"
|
|
imageAlt="Hotel lobby and entrance"
|
|
frameStyle="card"
|
|
className="relative z-10"
|
|
containerClassName="max-w-7xl mx-auto px-6"
|
|
logoContainerClassName="mb-12"
|
|
descriptionClassName="text-xl md:text-2xl leading-relaxed mb-8"
|
|
buttonContainerClassName="flex gap-4"
|
|
buttonClassName="px-8 py-3 rounded-none"
|
|
splitMediaWrapperClassName="aspect-video rounded-lg overflow-hidden"
|
|
mediaWrapperClassName="rounded-lg overflow-hidden"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<AboutPhoneTimeline
|
|
tag="Our Legacy"
|
|
title="Crafted for the Discerning Traveler"
|
|
description="Since 1985, Luxe Haven has stood as a beacon of luxury hospitality. Our commitment to excellence, attention to detail, and personalized service have earned us recognition as one of the world's premier destinations. We believe every guest deserves an experience beyond expectation."
|
|
phoneOne={{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184720628-griec8yy.jpg",
|
|
imageAlt: "Hotel booking experience"
|
|
}}
|
|
phoneTwo={{
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185878910-obewt98e.jpg",
|
|
imageAlt: "Reservation management"
|
|
}}
|
|
textboxLayout="default"
|
|
buttons={[
|
|
{ text: "Learn Our Story", href: "#" }
|
|
]}
|
|
useInvertedBackground="noInvert"
|
|
tagClassName="text-sm font-medium"
|
|
titleClassName="text-4xl md:text-5xl font-bold mb-6"
|
|
descriptionClassName="text-lg leading-relaxed mb-8 opacity-90"
|
|
/>
|
|
</div>
|
|
|
|
<div id="rooms" data-section="rooms">
|
|
<FeatureCardSeven
|
|
title="Our Signature Collections"
|
|
description="Each room is a masterpiece of design and comfort. From intimate suites to sprawling penthouses, discover accommodations that redefine luxury living."
|
|
tag="Accommodations"
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: "Premier Suites",
|
|
description: "Expansive living spaces with panoramic views, marble bathrooms, and personalized concierge service. Experience uncompromising luxury with amenities curated for the sophisticated traveler.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184718060-6nx8o2ui.jpg",
|
|
imageAlt: "Premier Suite"
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Spa & Wellness Suites",
|
|
description: "Dedicated wellness spaces featuring private steam rooms, soaking tubs, and rainfall showers. Complete with access to our world-class spa facilities and wellness programs.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184718910-pnoqmtth.jpg",
|
|
imageAlt: "Spa Suite"
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "Culinary Experiences",
|
|
description: "In-room dining at its finest with Michelin-starred cuisine delivered to your private quarters. Our master chefs prepare bespoke menus tailored to your preferences.",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184717131-qr8fo1hm.jpg",
|
|
imageAlt: "Fine Dining Room Service"
|
|
}
|
|
]}
|
|
animationType="blur-reveal"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
|
|
textBoxDescriptionClassName="text-lg opacity-90 mb-8"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<ProductCardFour
|
|
title="Premium Services & Amenities"
|
|
description="Indulge in our comprehensive array of world-class services designed to enhance your stay."
|
|
tag="Experiences"
|
|
products={[
|
|
{
|
|
id: "spa",
|
|
name: "Spa & Wellness",
|
|
price: "Complimentary",
|
|
variant: "6 Treatment Rooms",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184719816-2670gl5k.jpg",
|
|
imageAlt: "Spa treatment room"
|
|
},
|
|
{
|
|
id: "concierge",
|
|
name: "24/7 Concierge",
|
|
price: "Included",
|
|
variant: "Personal Assistants",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184710583-yt05ru42.jpg",
|
|
imageAlt: "Concierge service"
|
|
},
|
|
{
|
|
id: "gym",
|
|
name: "Fitness Center",
|
|
price: "Included",
|
|
variant: "State-of-the-Art Equipment",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184718910-pnoqmtth.jpg",
|
|
imageAlt: "Fitness facility"
|
|
},
|
|
{
|
|
id: "pool",
|
|
name: "Infinity Pool",
|
|
price: "Included",
|
|
variant: "Heated Year-Round",
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184712312-lhl1h85w.jpg",
|
|
imageAlt: "Swimming pool"
|
|
}
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
containerStyle="default"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
|
|
textBoxDescriptionClassName="text-lg opacity-90 mb-8"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardOne
|
|
title="Guest Accolades"
|
|
description="Hear from distinguished travelers who have experienced Luxe Haven's world-renowned hospitality."
|
|
tag="Reviews"
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Margaret Richardson",
|
|
role: "Travel Critic",
|
|
company: "Global Luxury Magazine",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140101670-ttp7xdlv.jpg",
|
|
imageAlt: "Margaret Richardson"
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "James Wellington",
|
|
role: "Executive",
|
|
company: "International Hotels Group",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163678723-295psgl3.jpg",
|
|
imageAlt: "James Wellington"
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Sofia Hartmann",
|
|
role: "Designer",
|
|
company: "Architectural Digest",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184724760-wxlm9bjg.jpg",
|
|
imageAlt: "Sofia Hartmann"
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "Alexander Rousseau",
|
|
role: "Sommelier",
|
|
company: "Michelin Guide",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140152452-p4x3ah4p.jpg",
|
|
imageAlt: "Alexander Rousseau"
|
|
},
|
|
{
|
|
id: "5",
|
|
name: "Elena Moretti",
|
|
role: "Entrepreneur",
|
|
company: "Forbes",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185880597-ieb2jad3.jpg",
|
|
imageAlt: "Elena Moretti"
|
|
},
|
|
{
|
|
id: "6",
|
|
name: "Christopher Hayes",
|
|
role: "Philanthropist",
|
|
company: "Harvard Business Review",
|
|
rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185881440-0jwi2e86.jpg",
|
|
imageAlt: "Christopher Hayes"
|
|
}
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="scale-rotate"
|
|
containerStyle="default"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
|
|
textBoxDescriptionClassName="text-lg opacity-90 mb-8"
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardFive
|
|
title="By The Numbers"
|
|
description="Our commitment to excellence reflected in achievements and recognitions."
|
|
metrics={[
|
|
{
|
|
id: "1",
|
|
value: "450+",
|
|
description: "Luxurious rooms and suites across multiple categories"
|
|
},
|
|
{
|
|
id: "2",
|
|
value: "38",
|
|
description: "International awards for hospitality and design excellence"
|
|
},
|
|
{
|
|
id: "3",
|
|
value: "98%",
|
|
description: "Guest satisfaction rating across all platforms"
|
|
},
|
|
{
|
|
id: "4",
|
|
value: "1985",
|
|
description: "Year established as beacon of luxury hospitality"
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
variant="border"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
|
|
textBoxDescriptionClassName="text-lg opacity-90 mb-8"
|
|
metricValueClassName="text-6xl md:text-7xl font-bold"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactInline
|
|
text="Ready to experience luxury redefined? Reserve your stay at Luxe Haven."
|
|
animationType="entrance-slide"
|
|
inputPlaceholder="Enter your email address"
|
|
buttonText="Reserve Now"
|
|
useInvertedBackground="noInvert"
|
|
textClassName="text-3xl md:text-4xl font-bold"
|
|
containerClassName="py-16 md:py-24"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185877436-fl4vf3vx.jpg"
|
|
logoWidth={40}
|
|
logoHeight={40}
|
|
copyrightText="© 2025 Luxe Haven Hotels. All rights reserved."
|
|
columns={[
|
|
{
|
|
title: "Accommodations",
|
|
items: [
|
|
{ label: "Premier Suites", href: "#rooms" },
|
|
{ label: "Spa Suites", href: "#rooms" },
|
|
{ label: "Penthouse Villas", href: "#rooms" }
|
|
]
|
|
},
|
|
{
|
|
title: "Services",
|
|
items: [
|
|
{ label: "Spa & Wellness", href: "#services" },
|
|
{ label: "Fine Dining", href: "#services" },
|
|
{ label: "Concierge", href: "#services" }
|
|
]
|
|
},
|
|
{
|
|
title: "Information",
|
|
items: [
|
|
{ label: "Contact Us", href: "#contact" },
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms & Conditions", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
footerClassName="bg-gradient-to-t from-black to-transparent"
|
|
copyrightTextClassName="text-sm opacity-60"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |