Compare commits
5 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| b784839e6a | |||
| 5ab7a013c2 | |||
| 77c5021d4b | |||
| b732139ba9 | |||
| 765212f359 |
426
src/app/page.tsx
426
src/app/page.tsx
@@ -2,17 +2,14 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
||||
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
||||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
|
||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||||
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
||||
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
|
||||
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
|
||||
import { Star } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -32,26 +29,12 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Our Story",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Suites",
|
||||
id: "rooms",
|
||||
},
|
||||
{
|
||||
name: "Experiences",
|
||||
id: "amenities",
|
||||
},
|
||||
{
|
||||
name: "Dining",
|
||||
id: "dining",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{ name: "Our Story", id: "about" },
|
||||
{ name: "Suites", id: "rooms" },
|
||||
{ name: "Speciality", id: "speciality" },
|
||||
{ name: "Dining", id: "dining" },
|
||||
{ name: "Loyalty", id: "loyalty" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
]}
|
||||
brandName="Hôtel Nadjem"
|
||||
/>
|
||||
@@ -59,111 +42,51 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{
|
||||
variant: "rotated-rays-animated",
|
||||
}}
|
||||
background={{ variant: "rotated-rays-animated" }}
|
||||
title="Where Stars Rest"
|
||||
description="An intimate sanctuary of celestial elegance. Hôtel Nadjem invites you to experience luxury reimagined."
|
||||
tag="Collection Prestige"
|
||||
buttons={[
|
||||
{
|
||||
text: "Reserve Stay",
|
||||
href: "#booking",
|
||||
},
|
||||
{
|
||||
text: "Discover Suites",
|
||||
href: "#rooms",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Reserve Stay", href: "#booking" }, { text: "Discover Suites", href: "#rooms" }]}
|
||||
carouselItems={[
|
||||
{
|
||||
id: "c1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hallway-modern-style_1127-3391.jpg",
|
||||
imageAlt: "Luxurious Hotel Entrance",
|
||||
},
|
||||
{
|
||||
id: "c2",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-luxurious-hotel-interior-space_23-2150683453.jpg",
|
||||
imageAlt: "Elegant Hotel Lobby",
|
||||
},
|
||||
{
|
||||
id: "c3",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/luxury-hotel-reception-hall-office-with-decor-shelf_105762-1676.jpg",
|
||||
imageAlt: "Sophisticated Hotel Decor",
|
||||
},
|
||||
{
|
||||
id: "c4",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/look-through-threads-with-buds-chrysanthemums-plastic-chairs-standing-hall_1304-3345.jpg",
|
||||
imageAlt: "Celestial Inspired Design",
|
||||
},
|
||||
{
|
||||
id: "c5",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hallway-hotel-floor_23-2149304103.jpg",
|
||||
imageAlt: "Private Sanctuary View",
|
||||
},
|
||||
{
|
||||
id: "c6",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-modern-steel-elevator-lift-lobby-business-hotel-with-luxury-design_105762-2042.jpg",
|
||||
imageAlt: "Night Sky Inspiration",
|
||||
},
|
||||
{ id: "c1", imageSrc: "http://img.b2bpic.net/free-photo/hallway-modern-style_1127-3391.jpg", imageAlt: "Luxurious Hotel Entrance" },
|
||||
{ id: "c2", imageSrc: "http://img.b2bpic.net/free-photo/view-luxurious-hotel-interior-space_23-2150683453.jpg", imageAlt: "Elegant Hotel Lobby" },
|
||||
{ id: "c3", imageSrc: "http://img.b2bpic.net/free-photo/luxury-hotel-reception-hall-office-with-decor-shelf_105762-1676.jpg", imageAlt: "Sophisticated Hotel Decor" },
|
||||
{ id: "c4", imageSrc: "http://img.b2bpic.net/free-photo/look-through-threads-with-buds-chrysanthemums-plastic-chairs-standing-hall_1304-3345.jpg", imageAlt: "Celestial Inspired Design" },
|
||||
{ id: "c5", imageSrc: "http://img.b2bpic.net/free-photo/hallway-hotel-floor_23-2149304103.jpg", imageAlt: "Private Sanctuary View" },
|
||||
{ id: "c6", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-modern-steel-elevator-lift-lobby-business-hotel-with-luxury-design_105762-2042.jpg", imageAlt: "Night Sky Inspiration" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "48+",
|
||||
title: "Suites",
|
||||
description: "Luxury accommodations",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/decor-white-bedroom-modern-lifestyle_1203-5180.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "5★",
|
||||
title: "Rating",
|
||||
description: "Prestige service",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fit-tanned-caucasian-woman-light-blue-mint-color-overall-teracce-balcony-luxury-villa-with-amazing-tropical-sea-view_343596-3021.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "3x",
|
||||
title: "Awards",
|
||||
description: "Global hospitality winners",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-bed-with-man-bathrobe-background_1163-10.jpg",
|
||||
},
|
||||
]}
|
||||
title="Our Prestige"
|
||||
description="Excellence defined by every detail."
|
||||
/>
|
||||
<div id="speciality" data-section="speciality">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
title="Signature Pâtisserie Experience"
|
||||
description="Discover our master-crafted delicacies, perfected through generations of French culinary artistry."
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Bergame Eclairs", description: "Hand-piped with our signature Madagascar vanilla bean cream.", imageSrc: "http://img.b2bpic.net/free-photo/delicious-chocolate-pastry_144627-25133.jpg" },
|
||||
{ title: "Celestial Macarons", description: "A delicate balance of texture and intense floral notes.", imageSrc: "http://img.b2bpic.net/free-photo/colorful-macaroons_1147-193.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={false}
|
||||
heading={[
|
||||
{
|
||||
type: "text",
|
||||
content: "Born from the poetry of the night sky",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/photorealistic-wooden-house-interior-with-timber-decor-furnishings_23-2151263507.jpg",
|
||||
alt: "Hotel Motif",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Learn More",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
<div id="loyalty" data-section="loyalty">
|
||||
<FeatureCardTwentyOne
|
||||
title="Loyalty Rewards Program"
|
||||
description="Join our inner circle and enjoy exclusive privileges as a frequent guest of Hôtel Nadjem."
|
||||
tag="Member Perks"
|
||||
tagIcon={Star}
|
||||
accordionItems={[
|
||||
{ id: "l1", title: "Priority Upgrades", content: "Complimentary suite upgrades upon availability." },
|
||||
{ id: "l2", title: "Exclusive Tasting Events", content: "Early access to seasonal Pâtisserie collection launches." },
|
||||
{ id: "l3", title: "Personal Concierge", content: "A dedicated contact for every aspect of your stay." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/champagne-glasses_1150-1375.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="rooms" data-section="rooms">
|
||||
@@ -173,278 +96,33 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "Standard",
|
||||
name: "Étoile Room",
|
||||
price: "€180",
|
||||
rating: 5,
|
||||
reviewCount: "120",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hotel-white-home-lamp-cushion_1203-5183.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "Prestige",
|
||||
name: "Suite Lunaire",
|
||||
price: "€420",
|
||||
rating: 5,
|
||||
reviewCount: "85",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-balcony-terrace-resting-drinking_8353-12363.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "Signature",
|
||||
name: "Grand Nadjem Suite",
|
||||
price: "€1,200",
|
||||
rating: 5,
|
||||
reviewCount: "40",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/outdoor-swimming-pool_1203-2954.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
brand: "Standard",
|
||||
name: "Deluxe View Room",
|
||||
price: "€250",
|
||||
rating: 4,
|
||||
reviewCount: "60",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-luxury-comfortable-white-pillow-blanket-decoration-interior-bedroom_74190-12644.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
brand: "Prestige",
|
||||
name: "Royal Terrace Suite",
|
||||
price: "€550",
|
||||
rating: 5,
|
||||
reviewCount: "95",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-romantic-breakfast-bed-arrangement_23-2150927747.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
brand: "Signature",
|
||||
name: "Penthouse Loft",
|
||||
price: "€1,500",
|
||||
rating: 5,
|
||||
reviewCount: "20",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/living-room-with-modern-beautiful-decoration_181624-30650.jpg",
|
||||
},
|
||||
{ id: "p1", brand: "Standard", name: "Étoile Room", price: "€180", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/hotel-white-home-lamp-cushion_1203-5183.jpg" },
|
||||
{ id: "p2", brand: "Prestige", name: "Suite Lunaire", price: "€420", rating: 5, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-balcony-terrace-resting-drinking_8353-12363.jpg" },
|
||||
{ id: "p3", brand: "Signature", name: "Grand Nadjem Suite", price: "€1,200", rating: 5, reviewCount: "40", imageSrc: "http://img.b2bpic.net/free-photo/outdoor-swimming-pool_1203-2954.jpg" },
|
||||
]}
|
||||
title="Suites & Chambers"
|
||||
description="Quiet elegance for the discerning traveller."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="amenities" data-section="amenities">
|
||||
<FeatureCardTwentyOne
|
||||
useInvertedBackground={false}
|
||||
title="A World Within Our Walls"
|
||||
description="Thoughtfully curated wellness and relaxation."
|
||||
accordionItems={[
|
||||
{
|
||||
id: "a1",
|
||||
title: "Spa Céleste",
|
||||
content: "Ancient rituals and hammam treatments.",
|
||||
},
|
||||
{
|
||||
id: "a2",
|
||||
title: "Infinity Pool",
|
||||
content: "Heated rooftop pool with horizon views.",
|
||||
},
|
||||
{
|
||||
id: "a3",
|
||||
title: "Observatory",
|
||||
content: "Telescopic exploration of constellations.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/relaxed-couple-wearing-bathrobes-while-enjoying-health-spa-focus-is-man_637285-7504.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="dining" data-section="dining">
|
||||
<PricingCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "d1",
|
||||
tag: "Signature",
|
||||
price: "Amuse",
|
||||
period: "Bouche",
|
||||
description: "Starters.",
|
||||
button: {
|
||||
text: "Reserve",
|
||||
},
|
||||
featuresTitle: "Chef's selection",
|
||||
features: [
|
||||
"Seasonal",
|
||||
"Refined",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "d2",
|
||||
tag: "Main",
|
||||
price: "€68",
|
||||
period: "Agneau",
|
||||
description: "Tajine d'Agneau Doré.",
|
||||
button: {
|
||||
text: "Reserve",
|
||||
},
|
||||
featuresTitle: "Details",
|
||||
features: [
|
||||
"French",
|
||||
"North African",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "d3",
|
||||
tag: "Experience",
|
||||
price: "€185",
|
||||
period: "Degustation",
|
||||
description: "7 Course menu.",
|
||||
button: {
|
||||
text: "Reserve",
|
||||
},
|
||||
featuresTitle: "Included",
|
||||
features: [
|
||||
"Pairing",
|
||||
"Signature",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Restaurant Sirius"
|
||||
description="Celestial culinary excellence."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="experience" data-section="experience">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "e1",
|
||||
title: "Bespoke Arrivals",
|
||||
content: "Preferences noted before check-in.",
|
||||
},
|
||||
{
|
||||
id: "e2",
|
||||
title: "Artisan Turndown",
|
||||
content: "Personalized evening service.",
|
||||
},
|
||||
{
|
||||
id: "e3",
|
||||
title: "Memory Keeping",
|
||||
content: "We recall your favorite details.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/3d-rendering-seminar-meeting-banquet-hall-room_105762-1773.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
title="The Nadjem Promise"
|
||||
description="Luxury is the art of considered detail."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFifteen
|
||||
useInvertedBackground={false}
|
||||
testimonial="An extraordinary sanctuary where time seems to stand still. Nadjem is the epitome of thoughtful, celestial luxury."
|
||||
rating={5}
|
||||
author="Nadia Al-Rashid, London"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/female-manager-eyeglasses-with-folder-hand_171337-16702.jpg",
|
||||
alt: "Guest 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/handsome-smiling-stylish-hipster-man-walking-city-street-with-leather-talking-phone-business-trip-bag-wearing-sweatshot-sunglasses-urban-style-trend-sunny-day-traveling_285396-4658.jpg",
|
||||
alt: "Guest 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/businessman-talking-mobile-phone-waiting-area_107420-85120.jpg",
|
||||
alt: "Guest 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/there-is-nothing-better-than-coffee-garden_329181-11609.jpg",
|
||||
alt: "Guest 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/luxury-sexy-attractive-woman-dressed-black-dress-posing-pier-luxury-resort-hotel-wearing-sunglasses-summer-vacation-tropical-beach_285396-6377.jpg",
|
||||
alt: "Guest 5",
|
||||
},
|
||||
]}
|
||||
avatars={[]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
text="Your place among the stars awaits. Contact us for bespoke reservations or inquiries about our exclusive event spaces."
|
||||
buttons={[
|
||||
{
|
||||
text: "Call Reservations",
|
||||
href: "tel:+213123456789",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Hotel",
|
||||
items: [
|
||||
{
|
||||
label: "Our Story",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Suites",
|
||||
href: "#rooms",
|
||||
},
|
||||
{
|
||||
label: "Experiences",
|
||||
href: "#amenities",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Guest Services",
|
||||
items: [
|
||||
{
|
||||
label: "Reservations",
|
||||
href: "#booking",
|
||||
},
|
||||
{
|
||||
label: "Concierge",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "+213 23 456 789",
|
||||
href: "tel:+213123456789",
|
||||
},
|
||||
{
|
||||
label: "reservations@hotelnadjem.com",
|
||||
href: "mailto:reservations@hotelnadjem.com",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Hotel", items: [{ label: "Our Story", href: "#about" }, { label: "Suites", href: "#rooms" }, { label: "Loyalty", href: "#loyalty" }] },
|
||||
{ title: "Guest Services", items: [{ label: "Reservations", href: "#" }, { label: "Concierge", href: "#" }] },
|
||||
{ title: "Contact", items: [{ label: "reservations@hotelnadjem.com", href: "mailto:reservations@hotelnadjem.com" }] },
|
||||
]}
|
||||
bottomLeftText="© 2025 Hôtel Nadjem. All rights reserved."
|
||||
bottomRightText="Collection Prestige"
|
||||
@@ -453,4 +131,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #ffffff;
|
||||
--card: #f9f9f9;
|
||||
--foreground: #000612e6;
|
||||
--primary-cta: #15479c;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #f9f9f9;
|
||||
--secondary-cta-text: #000612e6;
|
||||
--accent: #e2e2e2;
|
||||
--background-accent: #c4c4c4;
|
||||
--background: #f6f0e9;
|
||||
--card: #efe7dd;
|
||||
--foreground: #2b180a;
|
||||
--primary-cta: #2b180a;
|
||||
--primary-cta-text: #f6f0e9;
|
||||
--secondary-cta: #efe7dd;
|
||||
--secondary-cta-text: #2b180a;
|
||||
--accent: #94877c;
|
||||
--background-accent: #afa094;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user