Merge version_1 into main #1
477
src/app/page.tsx
477
src/app/page.tsx
@@ -20,352 +20,159 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Rooms",
|
||||
id: "rooms",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Brothers Hotel"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Rooms", id: "rooms" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Brothers Hotel"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Timeless Comfort, Modern Hospitality"
|
||||
description="Experience the Brothers Hotel, where heritage meets sophisticated contemporary living in the heart of the city."
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-styled-small-entryway_23-2150712925.jpg",
|
||||
imageAlt: "Luxurious Hotel Lobby",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-romantic-breakfast-bed-arrangement_23-2150927747.jpg",
|
||||
imageAlt: "Comfortable Suite",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-couple-having-lunch_23-2150598339.jpg",
|
||||
imageAlt: "Fine Dining Experience",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/couple-enjoying-coffee-shop_23-2148366675.jpg",
|
||||
imageAlt: "Hotel Entrance",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bed-arrangements-still-life_23-2150532970.jpg",
|
||||
imageAlt: "Relaxing Room Interior",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Timeless Comfort, Modern Hospitality"
|
||||
description="Experience the Brothers Hotel, where heritage meets sophisticated contemporary living in the heart of the city."
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/modern-styled-small-entryway_23-2150712925.jpg", imageAlt: "Luxurious Hotel Lobby" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-romantic-breakfast-bed-arrangement_23-2150927747.jpg", imageAlt: "Comfortable Suite" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/side-view-couple-having-lunch_23-2150598339.jpg", imageAlt: "Fine Dining Experience" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/couple-enjoying-coffee-shop_23-2148366675.jpg", imageAlt: "Hotel Entrance" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/bed-arrangements-still-life_23-2150532970.jpg", imageAlt: "Relaxing Room Interior" }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Our Story"
|
||||
description="Brothers Hotel was built on the values of brotherhood, integrity, and exceptional service. We provide a home away from home for travelers who appreciate the finer details in life."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/female-receptionist-elegant-suit-work-hours_23-2149714396.jpg"
|
||||
imageAlt="Our Reception Area"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Our Story"
|
||||
description="Brothers Hotel was built on the values of brotherhood, integrity, and exceptional service. We provide a home away from home for travelers who appreciate the finer details in life."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/female-receptionist-elegant-suit-work-hours_23-2149714396.jpg"
|
||||
imageAlt="Our Reception Area"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
label: "Service",
|
||||
title: "24/7 Concierge",
|
||||
items: [
|
||||
"Personalized travel assistance",
|
||||
"Local restaurant reservations",
|
||||
"Airport pickup services",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
label: "Wellness",
|
||||
title: "Luxury Spa",
|
||||
items: [
|
||||
"Hot stone massage therapy",
|
||||
"Sauna and steam rooms",
|
||||
"Full fitness center access",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
label: "Dining",
|
||||
title: "Gourmet Kitchen",
|
||||
items: [
|
||||
"Daily farm-to-table breakfast",
|
||||
"Room service available 24/7",
|
||||
"Exclusive lounge area access",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Exceptional Amenities"
|
||||
description="Everything you need for a comfortable stay."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "f1", label: "Service", title: "24/7 Concierge", items: ["Personalized travel assistance", "Local restaurant reservations", "Airport pickup services"] },
|
||||
{ id: "f2", label: "Wellness", title: "Luxury Spa", items: ["Hot stone massage therapy", "Sauna and steam rooms", "Full fitness center access"] },
|
||||
{ id: "f3", label: "Dining", title: "Gourmet Kitchen", items: ["Daily farm-to-table breakfast", "Room service available 24/7", "Exclusive lounge area access"] }
|
||||
]}
|
||||
title="Exceptional Amenities"
|
||||
description="Everything you need for a comfortable stay."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="rooms" data-section="rooms">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "r1",
|
||||
brand: "Luxury",
|
||||
name: "Superior Suite",
|
||||
price: "$350/night",
|
||||
rating: 5,
|
||||
reviewCount: "120",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pillow-bed_74190-6082.jpg",
|
||||
},
|
||||
{
|
||||
id: "r2",
|
||||
brand: "Standard",
|
||||
name: "Deluxe Queen",
|
||||
price: "$250/night",
|
||||
rating: 4,
|
||||
reviewCount: "85",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-luxury-bedroom-suite-bathroom_105762-1791.jpg",
|
||||
},
|
||||
{
|
||||
id: "r3",
|
||||
brand: "Comfort",
|
||||
name: "Business King",
|
||||
price: "$280/night",
|
||||
rating: 5,
|
||||
reviewCount: "92",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-various-cleaning-products_23-2150829673.jpg",
|
||||
},
|
||||
{
|
||||
id: "r4",
|
||||
brand: "Suite",
|
||||
name: "Penthouse",
|
||||
price: "$750/night",
|
||||
rating: 5,
|
||||
reviewCount: "45",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/businessman-posing-cafe_1157-45700.jpg",
|
||||
},
|
||||
{
|
||||
id: "r5",
|
||||
brand: "Relax",
|
||||
name: "Garden View",
|
||||
price: "$300/night",
|
||||
rating: 4,
|
||||
reviewCount: "67",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-having-fun-party_23-2149130683.jpg",
|
||||
},
|
||||
{
|
||||
id: "r6",
|
||||
brand: "Simple",
|
||||
name: "Standard Twin",
|
||||
price: "$200/night",
|
||||
rating: 4,
|
||||
reviewCount: "50",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/book-photo-camera-laid-blanket_23-2147911501.jpg",
|
||||
},
|
||||
]}
|
||||
title="Exquisite Rooms"
|
||||
description="Choose from our carefully designed accommodations."
|
||||
/>
|
||||
</div>
|
||||
<div id="rooms" data-section="rooms">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{ id: "r1", brand: "Luxury", name: "Superior Suite", price: "$350/night", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/pillow-bed_74190-6082.jpg" },
|
||||
{ id: "r2", brand: "Standard", name: "Deluxe Queen", price: "$250/night", rating: 4, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/modern-luxury-bedroom-suite-bathroom_105762-1791.jpg" },
|
||||
{ id: "r3", brand: "Comfort", name: "Business King", price: "$280/night", rating: 5, reviewCount: "92", imageSrc: "http://img.b2bpic.net/free-photo/still-life-various-cleaning-products_23-2150829673.jpg" },
|
||||
{ id: "r4", brand: "Suite", name: "Penthouse", price: "$750/night", rating: 5, reviewCount: "45", imageSrc: "http://img.b2bpic.net/free-photo/businessman-posing-cafe_1157-45700.jpg" },
|
||||
{ id: "r5", brand: "Relax", name: "Garden View", price: "$300/night", rating: 4, reviewCount: "67", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-having-fun-party_23-2149130683.jpg" },
|
||||
{ id: "r6", brand: "Simple", name: "Standard Twin", price: "$200/night", rating: 4, reviewCount: "50", imageSrc: "http://img.b2bpic.net/free-photo/book-photo-camera-laid-blanket_23-2147911501.jpg" }
|
||||
]}
|
||||
title="Exquisite Rooms"
|
||||
description="Choose from our carefully designed accommodations."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
icon: Users,
|
||||
title: "Happy Guests",
|
||||
value: "15,000+",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
icon: Award,
|
||||
title: "Awards Won",
|
||||
value: "24",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
icon: Clock,
|
||||
title: "Years Active",
|
||||
value: "35+",
|
||||
},
|
||||
]}
|
||||
title="Quality at Scale"
|
||||
description="Decades of experience in the industry."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", icon: Users, title: "Happy Guests", value: "15,000+" },
|
||||
{ id: "m2", icon: Award, title: "Awards Won", value: "24" },
|
||||
{ id: "m3", icon: Clock, title: "Years Active", value: "35+" }
|
||||
]}
|
||||
title="Quality at Scale"
|
||||
description="Decades of experience in the industry."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah Miller",
|
||||
role: "Travel Blogger",
|
||||
company: "Wanderlust Co",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-air-hostess-talking-her-mobile-phone_107420-85038.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "John Doe",
|
||||
role: "Executive",
|
||||
company: "Alpha Tech",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-handsome-afro-american-traveler-brown-jacket-hat-with-backpack-stands-studio-isolated-dark-background_613910-6590.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Emily Smith",
|
||||
role: "Architect",
|
||||
company: "Urban Designs",
|
||||
rating: 5,
|
||||
imageSrc: "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",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Mark Wilson",
|
||||
role: "Manager",
|
||||
company: "Global Corp",
|
||||
rating: 4,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-photo-camera_23-2148700793.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Anna Johnson",
|
||||
role: "Creative",
|
||||
company: "Design Studio",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-with-afro-hair-smile-broadly-dressed-beige-coat-strolls-city-sunny-autumn-day-uses-smartphone-with-delight-has-fun-texting-cellular-browses-web-pages_273609-55300.jpg",
|
||||
},
|
||||
]}
|
||||
title="Guest Experiences"
|
||||
description="What our guests say about us."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Sarah Miller", role: "Travel Blogger", company: "Wanderlust Co", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-air-hostess-talking-her-mobile-phone_107420-85038.jpg" },
|
||||
{ id: "t2", name: "John Doe", role: "Executive", company: "Alpha Tech", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-handsome-afro-american-traveler-brown-jacket-hat-with-backpack-stands-studio-isolated-dark-background_613910-6590.jpg" },
|
||||
{ id: "t3", name: "Emily Smith", role: "Architect", company: "Urban Designs", rating: 5, imageSrc: "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" },
|
||||
{ id: "t4", name: "Mark Wilson", role: "Manager", company: "Global Corp", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-photo-camera_23-2148700793.jpg" },
|
||||
{ id: "t5", name: "Anna Johnson", role: "Creative", company: "Design Studio", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-with-afro-hair-smile-broadly-dressed-beige-coat-strolls-city-sunny-autumn-day-uses-smartphone-with-delight-has-fun-texting-cellular-browses-web-pages_273609-55300.jpg" }
|
||||
]}
|
||||
title="Guest Experiences"
|
||||
description="What our guests say about us."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Is parking available?",
|
||||
content: "Yes, we offer complimentary valet parking for all our guests.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Are pets allowed?",
|
||||
content: "Unfortunately, we are currently a pet-free hotel.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Check-in/Check-out times?",
|
||||
content: "Check-in is at 3:00 PM, and check-out is at 11:00 AM.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/senior-woman-checksin-hotel-desk_482257-79976.jpg"
|
||||
title="Common Inquiries"
|
||||
description="Everything you need to know before your arrival."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "Is parking available?", content: "Yes, we offer complimentary valet parking for all our guests." },
|
||||
{ id: "q2", title: "Are pets allowed?", content: "Unfortunately, we are currently a pet-free hotel." },
|
||||
{ id: "q3", title: "Check-in/Check-out times?", content: "Check-in is at 3:00 PM, and check-out is at 11:00 AM." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/senior-woman-checksin-hotel-desk_482257-79976.jpg"
|
||||
title="Common Inquiries"
|
||||
description="Everything you need to know before your arrival."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Book Your Stay"
|
||||
description="Contact our reception team for inquiries and bookings."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email Address",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/tablet-standing-isolated-table_1303-22646.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={true}
|
||||
title="Book Your Stay"
|
||||
description="Contact our reception team for inquiries and bookings."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email Address", required: true }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/tablet-standing-isolated-table_1303-22646.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Brothers Hotel"
|
||||
columns={[
|
||||
{
|
||||
title: "Info",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "FAQs",
|
||||
href: "#faq",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 Brothers Hotel"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Brothers Hotel"
|
||||
columns={[
|
||||
{ title: "Info", items: [{ label: "About Us", href: "#about" }, { label: "Privacy Policy", href: "#" }] },
|
||||
{ title: "Support", items: [{ label: "Contact", href: "#contact" }, { label: "FAQs", href: "#faq" }] }
|
||||
]}
|
||||
copyrightText="© 2025 Brothers Hotel"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user