303 lines
9.7 KiB
TypeScript
303 lines
9.7 KiB
TypeScript
"use client"
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
|
|
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
|
import SplitAboutMetric from '@/components/sections/about/SplitAboutMetric';
|
|
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
|
|
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
import FaqBase from '@/components/sections/faq/FaqBase';
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
|
import { Waves, Utensils, Dumbbell } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-magnetic"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="smallMedium"
|
|
sizing="mediumLarge"
|
|
background="grid"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="layered-depth"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleMinimal
|
|
brandName="Luxury Hotels"
|
|
button={{
|
|
text: "Book Now",
|
|
href: "#contact"
|
|
}}
|
|
className="w-full"
|
|
buttonClassName="px-6 py-2"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboard
|
|
logoText="Luxury Hotels"
|
|
description="Experience unparalleled comfort and elegance. Your perfect getaway awaits in our world-class accommodations."
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184710583-yt05ru42.jpg"
|
|
imageAlt="Luxurious hotel lobby with modern design"
|
|
frameStyle="card"
|
|
logoLineHeight={1.1}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<SplitAboutMetric
|
|
title="Crafted for Your Comfort"
|
|
description={[
|
|
"Since 1998, we have been dedicated to providing exceptional hospitality experiences. Our properties are carefully designed to blend modern amenities with timeless elegance, ensuring every guest feels valued and pampered."
|
|
]}
|
|
metrics={[
|
|
{
|
|
label: "Years of Excellence",
|
|
value: "25+"
|
|
},
|
|
{
|
|
label: "Guest Rooms Worldwide",
|
|
value: "1,200+"
|
|
}
|
|
]}
|
|
showBorder={false}
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="rooms" data-section="rooms">
|
|
<FeatureCardSixteen
|
|
title="Discover Our Room Types"
|
|
description="Choose from our carefully curated selection of accommodations, each designed with your comfort and style in mind."
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
negativeCard={{
|
|
title: "Standard Room",
|
|
items: [
|
|
"Basic furnishings",
|
|
"City view",
|
|
"Standard amenities",
|
|
"Shared facilities"
|
|
]
|
|
}}
|
|
positiveCard={{
|
|
title: "Premium Suite",
|
|
items: [
|
|
"Luxury furnishings",
|
|
"Ocean or mountain view",
|
|
"Premium spa amenities",
|
|
"Exclusive concierge service",
|
|
"Private lounge access"
|
|
]
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="amenities" data-section="amenities">
|
|
<MetricCardThree
|
|
title="World-Class Amenities"
|
|
description="Enjoy our premium facilities designed to enhance your stay with comfort, wellness, and entertainment."
|
|
metrics={[
|
|
{
|
|
id: "1",
|
|
icon: Waves,
|
|
title: "Swimming Pool",
|
|
value: "2"
|
|
},
|
|
{
|
|
id: "2",
|
|
icon: Utensils,
|
|
title: "Restaurants",
|
|
value: "3"
|
|
},
|
|
{
|
|
id: "3",
|
|
icon: Dumbbell,
|
|
title: "Fitness Center",
|
|
value: "24/7"
|
|
},
|
|
{
|
|
id: "4",
|
|
icon: Dumbbell,
|
|
title: "Spa & Wellness",
|
|
value: "Full"
|
|
}
|
|
]}
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFifteen
|
|
testimonial="Our stay was absolutely unforgettable. The staff went above and beyond to make us feel welcome, and every detail of the hotel reflected excellence and care."
|
|
rating={5}
|
|
author="Sarah Mitchell, Traveler"
|
|
avatars={[
|
|
{
|
|
src: "/placeholders/placeholder1.webp",
|
|
alt: "Sarah Mitchell"
|
|
},
|
|
{
|
|
src: "/placeholders/placeholder1.webp",
|
|
alt: "Guest review"
|
|
},
|
|
{
|
|
src: "/placeholders/placeholder1.webp",
|
|
alt: "Guest review"
|
|
},
|
|
{
|
|
src: "/placeholders/placeholder1.webp",
|
|
alt: "Guest review"
|
|
}
|
|
]}
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
title="Frequently Asked Questions"
|
|
description="Find answers to common questions about your stay with us."
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
animationType="smooth"
|
|
faqs={[
|
|
{
|
|
id: "1",
|
|
title: "What is your cancellation policy?",
|
|
content: "We offer free cancellation up to 48 hours before arrival. Cancellations within 48 hours will incur a charge of one night's stay."
|
|
},
|
|
{
|
|
id: "2",
|
|
title: "Do you offer airport transportation?",
|
|
content: "Yes, we provide airport pickup and drop-off services. Please arrange this during your booking or contact our concierge."
|
|
},
|
|
{
|
|
id: "3",
|
|
title: "Are pets allowed?",
|
|
content: "Selected rooms are pet-friendly with a daily fee. Please notify us at the time of booking if you plan to bring a pet."
|
|
},
|
|
{
|
|
id: "4",
|
|
title: "What is included in the room rate?",
|
|
content: "Our rates include complimentary Wi-Fi, breakfast, access to the fitness center, and use of the business center."
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
title="Plan Your Stay"
|
|
description="Contact our team to make a reservation, ask questions, or request special arrangements for your visit."
|
|
inputs={[
|
|
{
|
|
name: "name",
|
|
type: "text",
|
|
placeholder: "Full Name",
|
|
required: true
|
|
},
|
|
{
|
|
name: "email",
|
|
type: "email",
|
|
placeholder: "Email Address",
|
|
required: true
|
|
}
|
|
]}
|
|
textarea={{
|
|
name: "message",
|
|
placeholder: "Tell us about your stay needs...",
|
|
rows: 4,
|
|
required: true
|
|
}}
|
|
useInvertedBackground="noInvert"
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766452376695-4rxtbd0x.jpg"
|
|
imageAlt="Hotel reception desk"
|
|
buttonText="Send Inquiry"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="Luxury Hotels"
|
|
columns={[
|
|
{
|
|
title: "Rooms & Rates",
|
|
items: [
|
|
{
|
|
label: "Deluxe Rooms",
|
|
href: "#rooms"
|
|
},
|
|
{
|
|
label: "Suites",
|
|
href: "#rooms"
|
|
},
|
|
{
|
|
label: "Group Bookings",
|
|
href: "#contact"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Amenities",
|
|
items: [
|
|
{
|
|
label: "Spa & Wellness",
|
|
href: "#amenities"
|
|
},
|
|
{
|
|
label: "Restaurants",
|
|
href: "#amenities"
|
|
},
|
|
{
|
|
label: "Events",
|
|
href: "#contact"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Company",
|
|
items: [
|
|
{
|
|
label: "About Us",
|
|
href: "#about"
|
|
},
|
|
{
|
|
label: "Contact",
|
|
href: "#contact"
|
|
},
|
|
{
|
|
label: "Careers",
|
|
href: "#contact"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Policies",
|
|
items: [
|
|
{
|
|
label: "Terms & Conditions",
|
|
href: "/terms"
|
|
},
|
|
{
|
|
label: "Privacy Policy",
|
|
href: "/privacy"
|
|
}
|
|
]
|
|
}
|
|
]}
|
|
copyrightText="© 2025 Luxury Hotels. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |