371 lines
15 KiB
TypeScript
371 lines
15 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
|
|
import HeroSplitTestimonial from "@/components/sections/hero/HeroSplitTestimonial";
|
|
import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
|
|
import TextAbout from "@/components/sections/about/TextAbout";
|
|
import ProductCardOne from "@/components/sections/product/ProductCardOne";
|
|
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
|
|
import BlogCardThree from "@/components/sections/blog/BlogCardThree";
|
|
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
|
import ContactSplit from "@/components/sections/contact/ContactSplit";
|
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
|
|
|
export default function HomePage() {
|
|
const navItems = [
|
|
{ name: "Home", id: "home" },
|
|
{ name: "Rooms", id: "rooms" },
|
|
{ name: "Dining", id: "dining" },
|
|
{ name: "Events", id: "events" },
|
|
{ name: "Gallery", id: "gallery" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Contact", id: "contact" }
|
|
];
|
|
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="rounded"
|
|
contentWidth="smallMedium"
|
|
sizing="largeSizeMediumTitles"
|
|
background="aurora"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="bold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
brandName="Meridien Hotel"
|
|
navItems={navItems}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitTestimonial
|
|
title="Experience Timeless Luxury in Gujranwala"
|
|
description="Luxury rooms, exceptional dining, and unforgettable events."
|
|
tag="⭐ Rated 4.3 by 1,700+ guests"
|
|
tagAnimation="slide-up"
|
|
mediaAnimation="blur-reveal"
|
|
background={{ variant: "aurora" }}
|
|
buttons={[
|
|
{ text: "BOOK A ROOM", href: "/rooms" },
|
|
{ text: "PLAN AN EVENT", href: "/events" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
imageSrc="http://img.b2bpic.net/free-photo/blue-sea-water-summer-silhouette_1203-3871.jpg"
|
|
imageAlt="Meridien Hotel Luxury Exterior Night View"
|
|
testimonials={[
|
|
{
|
|
name: "Sarah Khan",
|
|
handle: "@sarahkhan",
|
|
testimonial: "From the moment you step in, the atmosphere feels luxurious and welcoming. Exceptional service!",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-successful-young-businesswoman_1262-5844.jpg",
|
|
imageAlt: "Sarah Khan"
|
|
},
|
|
{
|
|
name: "Ahmed Hassan",
|
|
handle: "@ahmedhassan",
|
|
testimonial: "The finest dining experience in Gujranwala. Every dish is a masterpiece.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1626.jpg",
|
|
imageAlt: "Ahmed Hassan"
|
|
},
|
|
{
|
|
name: "Fatima Ali",
|
|
handle: "@fatimaali",
|
|
testimonial: "Our wedding at Meridien was absolutely perfect. Professional team, beautiful venue!",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-blonde-confident-young-businesswoman-against-gray-background_23-2148029500.jpg",
|
|
imageAlt: "Fatima Ali"
|
|
},
|
|
{
|
|
name: "Hassan Malik",
|
|
handle: "@hassanmalik",
|
|
testimonial: "Best hotel in the city. Comfort, luxury, and hospitality all in one place.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5361.jpg",
|
|
imageAlt: "Hassan Malik"
|
|
}
|
|
]}
|
|
testimonialRotationInterval={5000}
|
|
/>
|
|
</div>
|
|
|
|
<div id="quick-features" data-section="quick-features">
|
|
<FeatureCardSeven
|
|
title="Why Choose Meridien Hotel"
|
|
description="Experience world-class hospitality with our premium amenities and services"
|
|
tag="Our Services"
|
|
tagAnimation="slide-up"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: "Luxury Rooms",
|
|
description: "Elegantly designed suites with premium bedding and modern amenities",
|
|
imageSrc: "http://img.b2bpic.net/free-psd/teal-velvet-upholstered-bed-luxurious-bedroom-design_632498-24118.jpg",
|
|
imageAlt: "Luxury Hotel Room",
|
|
buttons: [
|
|
{ text: "View Rooms", href: "/rooms" }
|
|
]
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Fine Dining",
|
|
description: "Award-winning cuisine and exquisite culinary experiences",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/decorated-wedding-reception-venue-with-view-sea-through-windows_637285-1001.jpg",
|
|
imageAlt: "Restaurant Fine Dining",
|
|
buttons: [
|
|
{ text: "View Menu", href: "/dining" }
|
|
]
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "Grand Events",
|
|
description: "Perfect venues for weddings, conferences, and celebrations",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/candles-burn-standing-tall-vases-floor_1304-5614.jpg",
|
|
imageAlt: "Grand Event Wedding Hall",
|
|
buttons: [
|
|
{ text: "Plan Event", href: "/events" }
|
|
]
|
|
},
|
|
{
|
|
id: 4,
|
|
title: "Prime Location",
|
|
description: "Conveniently located on GT Road with easy access to the city",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-compass-travel-map_23-2149554761.jpg",
|
|
imageAlt: "Hotel Location Map"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
tag="About Meridien"
|
|
tagAnimation="slide-up"
|
|
title="A New Standard of Hospitality"
|
|
useInvertedBackground={false}
|
|
buttons={[
|
|
{ text: "Learn More", href: "/about" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="rooms" data-section="rooms">
|
|
<ProductCardOne
|
|
title="Relax in Elegant Comfort"
|
|
description="Choose from our carefully curated selection of luxury rooms and suites"
|
|
tag="Room Collection"
|
|
tagAnimation="slide-up"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
gridVariant="three-columns-all-equal-width"
|
|
products={[
|
|
{
|
|
id: "deluxe",
|
|
name: "Deluxe Room",
|
|
price: "PKR 12,000 - 15,000",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/asian-women-wake-up-from-sleep-are-stretch-herself-morning-weekend-sit-bed-luxury-room-relax-weekend-concept_1253-1031.jpg",
|
|
imageAlt: "Deluxe Room"
|
|
},
|
|
{
|
|
id: "executive",
|
|
name: "Executive Room",
|
|
price: "PKR 18,000 - 22,000",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-sitting-bed-hotel-stylish-evening-dress-sensual-mood-talking-phone-smiling-flirty-looking-sexy_285396-6176.jpg",
|
|
imageAlt: "Executive Room"
|
|
},
|
|
{
|
|
id: "family-suite",
|
|
name: "Family Suite",
|
|
price: "PKR 25,000 - 35,000",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/interior-modern-comfortable-hotel-room_1232-1823.jpg",
|
|
imageAlt: "Family Suite"
|
|
}
|
|
]}
|
|
buttons={[
|
|
{ text: "View All Rooms", href: "/rooms" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardThirteen
|
|
title="What Our Guests Say"
|
|
description="Real experiences from our valued guests"
|
|
tag="Guest Reviews"
|
|
tagAnimation="slide-up"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
showRating={true}
|
|
carouselMode="buttons"
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Sarah Khan",
|
|
handle: "@sarahkhan",
|
|
testimonial: "From the moment you step in, the atmosphere feels luxurious and welcoming. The staff went above and beyond to make our stay memorable.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-successful-young-businesswoman_1262-5844.jpg",
|
|
imageAlt: "Sarah Khan"
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Ahmed Hassan",
|
|
handle: "@ahmedhassan",
|
|
testimonial: "The finest dining experience in Gujranwala. Every dish is a masterpiece, and the presentation is impeccable.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1626.jpg",
|
|
imageAlt: "Ahmed Hassan"
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Fatima Ali",
|
|
handle: "@fatimaali",
|
|
testimonial: "Our wedding at Meridien was absolutely perfect. The venue is stunning, and the entire team was professional and attentive.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-blonde-confident-young-businesswoman-against-gray-background_23-2148029500.jpg",
|
|
imageAlt: "Fatima Ali"
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "Hassan Malik",
|
|
handle: "@hassanmalik",
|
|
testimonial: "Best hotel in the city. The rooms are luxurious, the food is exceptional, and the hospitality is unmatched.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5361.jpg",
|
|
imageAlt: "Hassan Malik"
|
|
},
|
|
{
|
|
id: "5",
|
|
name: "Amina Shahid",
|
|
handle: "@aminashahid",
|
|
testimonial: "A hidden gem in Gujranwala. The attention to detail is remarkable, and every corner is beautifully designed.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/blond-business-woman-sitting-couch_23-2148095778.jpg",
|
|
imageAlt: "Amina Shahid"
|
|
},
|
|
{
|
|
id: "6",
|
|
name: "Malik Tariq",
|
|
handle: "@maliktariq",
|
|
testimonial: "Perfect for business trips and leisure getaways. The complimentary breakfast and WiFi are much appreciated.",
|
|
rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-corporate-manager-sitting-with-hands-clasped-outside-office_662251-2057.jpg",
|
|
imageAlt: "Malik Tariq"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
title="Trusted by Leading Brands"
|
|
description="Meridien Hotel is the preferred choice for luxury stays and events"
|
|
tag="Featured In"
|
|
tagAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttonAnimation="slide-up"
|
|
names={[
|
|
"Trip Advisor",
|
|
"Google Hotels",
|
|
"Booking.com",
|
|
"Pakistan Tourism Board",
|
|
"Event Management Association",
|
|
"Fine Dining Network",
|
|
"Corporate Events Association"
|
|
]}
|
|
logos={[
|
|
"http://img.b2bpic.net/free-vector/gradient-social-media-logos_23-2148073196.jpg",
|
|
"http://img.b2bpic.net/free-psd/flat-design-car-sharing-landing-page_23-2150443236.jpg",
|
|
"http://img.b2bpic.net/free-vector/gradient-oasis-logo-design_23-2149420751.jpg",
|
|
"http://img.b2bpic.net/free-photo/group-pakistani-man-wearing-traditional-clothes-salwar-kameez-kurta-with-pakistan-flags_627829-4830.jpg",
|
|
"http://img.b2bpic.net/free-vector/new-year-badge-collection-blue_23-2147718459.jpg",
|
|
"http://img.b2bpic.net/free-vector/pack-flat-design-catering-logos_23-2149010458.jpg",
|
|
"http://img.b2bpic.net/free-vector/flat-electronics-logos-pack_23-2148978776.jpg"
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact-cta" data-section="contact-cta">
|
|
<ContactSplit
|
|
tag="Get In Touch"
|
|
title="Experience Meridien Hospitality"
|
|
description="Book your stay, reserve dining, or plan your event today"
|
|
tagAnimation="slide-up"
|
|
mediaAnimation="blur-reveal"
|
|
background={{ variant: "aurora" }}
|
|
useInvertedBackground={false}
|
|
imageSrc="http://img.b2bpic.net/free-photo/female-receptionist-work-elegant-suit_23-2149714420.jpg"
|
|
imageAlt="Meridien Hotel Contact"
|
|
inputPlaceholder="Enter your email"
|
|
buttonText="Get Started"
|
|
mediaPosition="right"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{
|
|
title: "Navigation",
|
|
items: [
|
|
{ label: "Home", href: "/" },
|
|
{ label: "Rooms", href: "/rooms" },
|
|
{ label: "Dining", href: "/dining" },
|
|
{ label: "Events", href: "/events" },
|
|
{ label: "Gallery", href: "/gallery" }
|
|
]
|
|
},
|
|
{
|
|
title: "Information",
|
|
items: [
|
|
{ label: "About Us", href: "/about" },
|
|
{ label: "Contact", href: "/contact" },
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms & Conditions", href: "#" },
|
|
{ label: "Careers", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Services",
|
|
items: [
|
|
{ label: "Room Booking", href: "/rooms" },
|
|
{ label: "Dining Reservation", href: "/dining" },
|
|
{ label: "Event Planning", href: "/events" },
|
|
{ label: "Gift Cards", href: "#" },
|
|
{ label: "Corporate Packages", href: "/events" }
|
|
]
|
|
},
|
|
{
|
|
title: "Contact",
|
|
items: [
|
|
{ label: "Phone: +92-55-4105-100", href: "tel:+925541051000" },
|
|
{ label: "Email: reservations@meridien.pk", href: "mailto:reservations@meridien.pk" },
|
|
{ label: "Main GT Road, Gujranwala", href: "#" },
|
|
{ label: "WhatsApp: +92-300-1234567", href: "https://wa.me/923001234567" },
|
|
{ label: "Follow us on Social Media", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
bottomLeftText="© 2024 Meridien Hotel. All rights reserved."
|
|
bottomRightText="Crafted with luxury and care for discerning guests."
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |