Merge version_1 into main #1
343
src/app/page.tsx
343
src/app/page.tsx
@@ -26,253 +26,114 @@ export default function LandingPage() {
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Rooms",
|
||||
id: "#rooms",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="Planet Hotel"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "#hero" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Rooms", id: "#rooms" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Planet Hotel"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
title="Luxury Beyond Imagination"
|
||||
description="Welcome to Planet Hotel – where elegance meets comfort."
|
||||
kpis={[
|
||||
{
|
||||
value: "5-Star",
|
||||
label: "Rating",
|
||||
},
|
||||
{
|
||||
value: "100+",
|
||||
label: "Rooms",
|
||||
},
|
||||
{
|
||||
value: "24/7",
|
||||
label: "Service",
|
||||
},
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/restaurant-room-with-two-long-dinner-tables_140725-8455.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
avatars={[
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/handsome-man-wearing-suit_114579-2826.jpg",
|
||||
alt: "Guest 1",
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/smiling-business-woman_114579-2815.jpg",
|
||||
alt: "Guest 2",
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/elegant-man-suit_114579-2819.jpg",
|
||||
alt: "Guest 3",
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/happy-business-woman_114579-2809.jpg",
|
||||
alt: "Guest 4",
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/business-man-smiling_114579-2822.jpg",
|
||||
alt: "Guest 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Join 10,000+ happy guests"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Premium Dining",
|
||||
icon: Utensils,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Free Wi-Fi",
|
||||
icon: Wifi,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Spa & Wellness",
|
||||
icon: Sparkles,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Concierge",
|
||||
icon: Bell,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Valet Parking",
|
||||
icon: Car,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Luxury Beyond Imagination"
|
||||
description="Welcome to Planet Hotel – where elegance meets comfort."
|
||||
kpis={[
|
||||
{ value: "5-Star", label: "Rating" },
|
||||
{ value: "100+", label: "Rooms" },
|
||||
{ value: "24/7", label: "Service" },
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[{ text: "Book Now", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/restaurant-room-with-two-long-dinner-tables_140725-8455.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
avatars={[
|
||||
{ src: "https://img.b2bpic.net/free-photo/handsome-man-wearing-suit_114579-2826.jpg", alt: "Guest 1" },
|
||||
{ src: "https://img.b2bpic.net/free-photo/smiling-business-woman_114579-2815.jpg", alt: "Guest 2" },
|
||||
{ src: "https://img.b2bpic.net/free-photo/elegant-man-suit_114579-2819.jpg", alt: "Guest 3" },
|
||||
{ src: "https://img.b2bpic.net/free-photo/happy-business-woman_114579-2809.jpg", alt: "Guest 4" },
|
||||
{ src: "https://img.b2bpic.net/free-photo/business-man-smiling_114579-2822.jpg", alt: "Guest 5" },
|
||||
]}
|
||||
avatarText="Join 10,000+ happy guests"
|
||||
marqueeItems={[
|
||||
{ type: "text-icon", text: "Premium Dining", icon: Utensils },
|
||||
{ type: "text-icon", text: "Free Wi-Fi", icon: Wifi },
|
||||
{ type: "text-icon", text: "Spa & Wellness", icon: Sparkles },
|
||||
{ type: "text-icon", text: "Concierge", icon: Bell },
|
||||
{ type: "text-icon", text: "Valet Parking", icon: Car },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={false}
|
||||
heading={[
|
||||
{
|
||||
type: "text",
|
||||
content: "About ",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/3d-rendering-beautiful-luxury-bedroom-suite-hotel-with-working-table_105762-2154.jpg",
|
||||
alt: "Hotel Logo",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
content: " Planet Hotel",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore More",
|
||||
href: "#about",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={false}
|
||||
heading={[
|
||||
{ type: "text", content: "About " },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/3d-rendering-beautiful-luxury-bedroom-suite-hotel-with-working-table_105762-2154.jpg", alt: "Hotel Logo" },
|
||||
{ type: "text", content: " Planet Hotel" },
|
||||
]}
|
||||
buttons={[{ text: "Explore More", href: "#about" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="rooms" data-section="rooms">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Luxury",
|
||||
name: "Deluxe Room",
|
||||
price: "From $299",
|
||||
rating: 5,
|
||||
reviewCount: "120",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-beautiful-luxury-bedroom-suite-hotel-with-working-table_105762-2154.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Premium",
|
||||
name: "Executive Suite",
|
||||
price: "From $499",
|
||||
rating: 5,
|
||||
reviewCount: "85",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-beautiful-comtemporary-luxury-bedroom-suite-hotel-with-tv_105762-2058.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Ultimate",
|
||||
name: "Presidential Suite",
|
||||
price: "From $999",
|
||||
rating: 5,
|
||||
reviewCount: "42",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-luxury-modern-bedroom-suite-hotel-with-tv-cabinet_105762-2282.jpg",
|
||||
},
|
||||
]}
|
||||
title="Our Rooms"
|
||||
description="Experience comfort in every suite."
|
||||
/>
|
||||
</div>
|
||||
<div id="rooms" data-section="rooms">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "1", brand: "Luxury", name: "Deluxe Room", price: "From $299", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-beautiful-luxury-bedroom-suite-hotel-with-working-table_105762-2154.jpg" },
|
||||
{ id: "2", brand: "Premium", name: "Executive Suite", price: "From $499", rating: 5, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-beautiful-comtemporary-luxury-bedroom-suite-hotel-with-tv_105762-2058.jpg" },
|
||||
{ id: "3", brand: "Ultimate", name: "Presidential Suite", price: "From $999", rating: 5, reviewCount: "42", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-luxury-modern-bedroom-suite-hotel-with-tv-cabinet_105762-2282.jpg" },
|
||||
]}
|
||||
title="Our Rooms"
|
||||
description="Experience comfort in every suite."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
sideDescription="Everything you need to know about your stay at Planet Hotel."
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "What are the check-in and check-out times?",
|
||||
content: "Check-in is at 3:00 PM and check-out is at 11:00 AM.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Is breakfast included in the room rate?",
|
||||
content: "Yes, a gourmet breakfast buffet is included with every reservation.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Are pets allowed at the hotel?",
|
||||
content: "We are a pet-friendly hotel. Please contact our concierge for specific policies.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
sideDescription="Everything you need to know about your stay at Planet Hotel."
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{ id: "1", title: "What are the check-in and check-out times?", content: "Check-in is at 3:00 PM and check-out is at 11:00 AM." },
|
||||
{ id: "2", title: "Is breakfast included in the room rate?", content: "Yes, a gourmet breakfast buffet is included with every reservation." },
|
||||
{ id: "3", title: "Are pets allowed at the hotel?", content: "We are a pet-friendly hotel. Please contact our concierge for specific policies." },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
tag="Reservations"
|
||||
title="Book Your Stay"
|
||||
description="Contact us today for availability."
|
||||
tagIcon={Calendar}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
tag="Reservations"
|
||||
title="Book Your Stay"
|
||||
description="Contact us today for availability."
|
||||
tagIcon={Calendar}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Planet Hotel",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Rooms",
|
||||
href: "#rooms",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2026 Planet Hotel. All Rights Reserved."
|
||||
bottomRightText="Luxury Redefined"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "Planet Hotel", items: [{ label: "About Us", href: "#about" }, { label: "Rooms", href: "#rooms" }] },
|
||||
{ title: "Support", items: [{ label: "Contact", href: "#contact" }, { label: "Privacy Policy", href: "#" }] },
|
||||
]}
|
||||
bottomLeftText="© 2026 Planet Hotel. All Rights Reserved."
|
||||
bottomRightText="Luxury Redefined"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user