Merge version_1_1776437235534 into main #1

Merged
bender merged 2 commits from version_1_1776437235534 into main 2026-04-17 14:48:27 +00:00

View File

@@ -13,341 +13,150 @@ import { MapPin, Sparkles, Utensils } from "lucide-react";
export default function App() {
return (
<>
<div id="nav" data-section="nav">
<NavbarCentered
logo="Grand Hotel"
navItems={[
{
name: "Rooms",
id: "rooms",
},
{
name: "Dining",
id: "dining",
},
{
name: "Amenities",
id: "amenities",
},
{
name: "Contact",
id: "contact",
},
]}
ctaButton={{
text: "Book Now",
href: "#contact",
}}
/>
</div>
<div id="nav" data-section="nav">
<NavbarCentered
logo="Grand Hotel"
navItems={[
{ name: "Rooms", href: "#rooms" },
{ name: "Dining", href: "#dining" },
{ name: "Amenities", href: "#amenities" },
{ name: "Contact", href: "#contact" },
]}
ctaButton={{
text: "Book Now", href: "#contact"}}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardGallery
tag="Welcome to Excellence"
title="Where Luxury Meets Comfort"
description="Experience unparalleled hospitality in the heart of the city, designed for those who appreciate the finer things."
primaryButton={{
text: "Book Your Stay",
href: "#contact",
}}
secondaryButton={{
text: "Explore Rooms",
href: "#rooms",
}}
items={[
{
imageSrc: "https://pixabay.com/get/g877d471cb9097f264ad6bbd1cb9ae6c2c9a7412358193dff6ad5e19e8e53afe7a3716e4567dea8d040df2c8196e06cb566b3411c39e2d415442bbc960fc45140_1280.jpg",
},
{
imageSrc: "https://pixabay.com/get/g06671c0412aee1f67b58bb5873ba020f81cfe192b3541c82e19bb877f13fb3f594985600e262931bca4daf8ac3ccffd501bbfc4e20fa1e0aba0c81fbc7314845_1280.jpg",
},
{
imageSrc: "https://pixabay.com/get/gc09a216fb8e67c1bc4dc5d1a7859bdf07d5a199129a5bf9798b67676c98765a5ec1b680856bc0c9ce4dd9574921c80793e64e4bae28438636d11f4b6cc43a53c_1280.jpg",
},
{
imageSrc: "https://pixabay.com/get/gce09e7e50fa1ac906d585e837ee56528381b06f4c43bac3058edc2e7f752a209fa99a79606a1dd915d323b153ee80da5140af77d4900092fc4d4f940b64738e0_1280.jpg",
},
{
imageSrc: "https://pixabay.com/get/g70c6bbf81f37ae6bc7e8f86653b51d6e372f0f3cf5716017e82076bcaeead63596a6d527d3f9df403ad66af472925e625f31590adc37d1882d58b17a45d9f02f_1280.jpg",
},
{
imageSrc: "https://pixabay.com/get/g6927027c81eecf7395def56dc6c20705ced6c5c85553cb235d4e251eab4a17425e08ee31cecccdce42658df5ca8efdf1663ce636138823ea9070394dcecac44f_1280.jpg",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardGallery
tag="Welcome to Excellence"
title="Where Luxury Meets Comfort"
description="Experience unparalleled hospitality in the heart of the city, designed for those who appreciate the finer things."
primaryButton={{
text: "Book Your Stay", href: "#contact"}}
secondaryButton={{
text: "Explore Rooms", href: "#rooms"}}
items={[
{ imageSrc: "https://pixabay.com/get/g877d471cb9097f264ad6bbd1cb9ae6c2c9a7412358193dff6ad5e19e8e53afe7a3716e4567dea8d040df2c8196e06cb566b3411c39e2d415442bbc960fc45140_1280.jpg" },
{ imageSrc: "https://pixabay.com/get/g06671c0412aee1f67b58bb5873ba020f81cfe192b3541c82e19bb877f13fb3f594985600e262931bca4daf8ac3ccffd501bbfc4e20fa1e0aba0c81fbc7314845_1280.jpg" },
{ imageSrc: "https://pixabay.com/get/gc09a216fb8e67c1bc4dc5d1a7859bdf07d5a199129a5bf9798b67676c98765a5ec1b680856bc0c9ce4dd9574921c80793e64e4bae28438636d11f4b6cc43a53c_1280.jpg" },
{ imageSrc: "https://pixabay.com/get/gce09e7e50fa1ac906d585e837ee56528381b06f4c43bac3058edc2e7f752a209fa99a79606a1dd915d323b153ee80da5140af77d4900092fc4d4f940b64738e0_1280.jpg" },
{ imageSrc: "https://pixabay.com/get/g70c6bbf81f37ae6bc7e8f86653b51d6e372f0f3cf5716017e82076bcaeead63596a6d527d3f9df403ad66af472925e625f31590adc37d1882d58b17a45d9f02f_1280.jpg" },
{ imageSrc: "https://pixabay.com/get/g6927027c81eecf7395def56dc6c20705ced6c5c85553cb235d4e251eab4a17425e08ee31cecccdce42658df5ca8efdf1663ce636138823ea9070394dcecac44f_1280.jpg" },
]}
/>
</div>
<div id="about" data-section="about">
<AboutFeaturesSplit
tag="Our Heritage"
title="A Legacy of Hospitality"
description="Since 1920, Grand Hotel has been a beacon of service and elegance, blending historical charm with contemporary amenities."
items={[
{
icon: Sparkles,
title: "5-Star Service",
description: "Concierge and staff dedicated to your needs.",
},
{
icon: MapPin,
title: "Prime Location",
description: "Located near cultural and business centers.",
},
{
icon: Utensils,
title: "Fine Dining",
description: "World-class cuisine prepared by Michelin-starred chefs.",
},
]}
imageSrc="https://pixabay.com/get/g2a054d042e47cf71de31c56ff92629101b5b87ce7810af778eadf4d537e0b531c2b2873b880b09156de185f4c80217d5_1280.jpg"
/>
</div>
<div id="about" data-section="about">
<AboutFeaturesSplit
tag="Our Heritage"
title="A Legacy of Hospitality"
description="Since 1920, Grand Hotel has been a beacon of service and elegance, blending historical charm with contemporary amenities."
items={[
{ icon: Sparkles, title: "5-Star Service", description: "Concierge and staff dedicated to your needs." },
{ icon: MapPin, title: "Prime Location", description: "Located near cultural and business centers." },
{ icon: Utensils, title: "Fine Dining", description: "World-class cuisine prepared by Michelin-starred chefs." },
]}
imageSrc={{ imageSrc: "https://pixabay.com/get/g2a054d042e47cf71de31c56ff92629101b5b87ce7810af778eadf4d537e0b531c2b2873b880b09156de185f4c80217d5_1280.jpg" }}
/>
</div>
<div id="amenities" data-section="amenities">
<FeaturesFlipCards
tag="Elevated Living"
title="Premium Amenities"
description="Discover the services that set us apart from the rest."
items={[
{
title: "Full-Service Spa",
descriptions: [
"Relaxing saunas",
"Organic treatments",
"Meditation rooms",
],
imageSrc: "https://pixabay.com/get/g821fc523aa918575deb6cbb05eee5d09a4a65d4031ad594a2553c944397ad3a8645321c7c800f3c139b8b660c633a24aab82e097a8260867c0c4c86e91268912_1280.jpg",
},
{
title: "Infinity Pool",
descriptions: [
"Heated water",
"Poolside service",
"Stunning views",
],
imageSrc: "https://pixabay.com/get/gc87d94486f1849f5e7612231e1fd2883adaf9e211405831e1a468cae81c95d39f1fe9858c6184c89920df8775f3bd00ca36354eafe5b54cc01d33bac5cc15443_1280.jpg",
},
{
title: "Private Lounge",
descriptions: [
"Exclusive access",
"Premium drinks",
"Quiet work space",
],
imageSrc: "https://pixabay.com/get/g79b9e5b956b426ce3c2c28fa35094305d400ed1482a7d76d7daaaf2d7c20bbb5a368eb601737a78c0adc2fe264666cbf27f51f88981ceaababc8125867be5e25_1280.jpg",
},
]}
/>
</div>
<div id="amenities" data-section="amenities">
<FeaturesFlipCards
tag="Elevated Living"
title="Premium Amenities"
description="Discover the services that set us apart from the rest."
items={[
{ title: "Full-Service Spa", descriptions: ["Relaxing saunas", "Organic treatments", "Meditation rooms"], imageSrc: "https://pixabay.com/get/g821fc523aa918575deb6cbb05eee5d09a4a65d4031ad594a2553c944397ad3a8645321c7c800f3c139b8b660c633a24aab82e097a8260867c0c4c86e91268912_1280.jpg" },
{ title: "Infinity Pool", descriptions: ["Heated water", "Poolside service", "Stunning views"], imageSrc: "https://pixabay.com/get/gc87d94486f1849f5e7612231e1fd2883adaf9e211405831e1a468cae81c95d39f1fe9858c6184c89920df8775f3bd00ca36354eafe5b54cc01d33bac5cc15443_1280.jpg" },
{ title: "Private Lounge", descriptions: ["Exclusive access", "Premium drinks", "Quiet work space"], imageSrc: "https://pixabay.com/get/g79b9e5b956b426ce3c2c28fa35094305d400ed1482a7d76d7daaaf2d7c20bbb5a368eb601737a78c0adc2fe264666cbf27f51f88981ceaababc8125867be5e25_1280.jpg" },
]}
/>
</div>
<div id="rooms" data-section="rooms">
<PricingSplitCards
tag="Stay With Us"
title="Choose Your Sanctuary"
description="Luxurious rooms designed for ultimate relaxation and productivity."
plans={[
{
tag: "Popular",
price: "$350",
period: "/night",
description: "Spacious room with king bed and city views.",
primaryButton: {
text: "Book Room",
href: "#contact",
},
featuresTitle: "Included Amenities",
features: [
"King-sized bed",
"Nespresso machine",
"High-speed Wi-Fi",
"Walk-in shower",
],
},
{
tag: "Elite",
price: "$650",
period: "/night",
description: "Luxury suite with separate lounge and balcony.",
primaryButton: {
text: "Book Suite",
href: "#contact",
},
featuresTitle: "Luxury Inclusions",
features: [
"Panoramic balcony view",
"Personal butler service",
"Premium linen selection",
"Free breakfast",
"Early check-in",
],
},
]}
/>
</div>
<div id="rooms" data-section="rooms">
<PricingSplitCards
tag="Stay With Us"
title="Choose Your Sanctuary"
description="Luxurious rooms designed for ultimate relaxation and productivity."
plans={[
{ tag: "Popular", price: "$350", period: "/night", description: "Spacious room with king bed and city views.", primaryButton: { text: "Book Room", href: "#contact" }, featuresTitle: "Included Amenities", features: ["King-sized bed", "Nespresso machine", "High-speed Wi-Fi", "Walk-in shower"] },
{ tag: "Elite", price: "$650", period: "/night", description: "Luxury suite with separate lounge and balcony.", primaryButton: { text: "Book Suite", href: "#contact" }, featuresTitle: "Luxury Inclusions", features: ["Panoramic balcony view", "Personal butler service", "Premium linen selection", "Free breakfast", "Early check-in"] },
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricsMediaCards
tag="Our Impact"
title="By The Numbers"
description="Celebrating a decade of excellence in the hospitality industry."
metrics={[
{
value: "120+",
title: "Luxury Rooms",
description: "Equipped with the finest technology and comfort.",
imageSrc: "https://pixabay.com/get/g201d6394149d894b09e63eafd0da23abfdc8d4b07def125603bbba517bfbade7536de9888a5a0db40bf0de0d7d0a65643d1dda1ed98ebe418eacc0279323cb1e_1280.jpg",
},
{
value: "15k+",
title: "Happy Guests",
description: "Creating memories that last a lifetime.",
imageSrc: "https://pixabay.com/get/g0c62b4faec808f6fb54ca4b150eac8f2743c374ee24ac9d264facff8b63f2394458d9be575c158edc9f76e5f521d9bc2b39d5e32386b33925e5e1dfe22e35d8b_1280.jpg",
},
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricsMediaCards
tag="Our Impact"
title="By The Numbers"
description="Celebrating a decade of excellence in the hospitality industry."
metrics={[
{ value: "120+", title: "Luxury Rooms", description: "Equipped with the finest technology and comfort.", imageSrc: "https://pixabay.com/get/g201d6394149d894b09e63eafd0da23abfdc8d4b07def125603bbba517bfbade7536de9888a5a0db40bf0de0d7d0a65643d1dda1ed98ebe418eacc0279323cb1e_1280.jpg" },
{ value: "15k+", title: "Happy Guests", description: "Creating memories that last a lifetime.", imageSrc: "https://pixabay.com/get/g0c62b4faec808f6fb54ca4b150eac8f2743c374ee24ac9d264facff8b63f2394458d9be575c158edc9f76e5f521d9bc2b39d5e32386b33925e5e1dfe22e35d8b_1280.jpg" },
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialMarqueeCards
tag="Guest Stories"
title="Voices of Grand Hotel"
description="What our guests say about their stay."
testimonials={[
{
name: "Elena R.",
role: "Travel Blogger",
quote: "The absolute pinnacle of luxury and service.",
imageSrc: "https://pixabay.com/get/gcebae0b3a40bb33034a198992b1482e189e6b348b2c0d52414ef148b30e0409963f39f521b36c62c15fedba9437a81ad117dc5b149a5183dc0e708ddafbcc2de_1280.jpg",
},
{
name: "Marcus W.",
role: "Corporate CEO",
quote: "A seamless and rejuvenating business trip experience.",
imageSrc: "https://pixabay.com/get/gd4bb2b9597a27879f3e6efae580d89bdfe89951a154e9e678b15d21b8fc461a38d03903118d09ef535da60cf5ec718fed4b79041d6bf4c3be79ad7e36b6aa8b3_1280.jpg",
},
{
name: "Sarah P.",
role: "Artist",
quote: "Everything about this hotel is pure magic.",
imageSrc: "https://pixabay.com/get/g1e1b937ca424d2360b4bb008e731c1fa14c6d5fbe0739a6ab27473c5338520cf8f9b774ffc1e377d3af60a3592243a79cd2d4d3ca10b514929aa546bd918f734_1280.jpg",
},
{
name: "David L.",
role: "Architecture Student",
quote: "Remarkable design and impeccable hospitality.",
imageSrc: "https://pixabay.com/get/gdd3af963c897a3546bf0d0cab43746db362a7d598222facc57ab9f284d4d3655792b39d34d53c3988f761caf8e0846a1f311159a2e477cbdfb07b3983a65a9f1_1280.jpg",
},
{
name: "Isabella K.",
role: "Designer",
quote: "Unforgettable stay. Will return very soon.",
imageSrc: "https://pixabay.com/get/g1c0bf50c4e908abc37183172efa9ec91686fae568ce2d27da3da4f478ed70e67e49742ec7058f0512e04fa1f7542ee42fe24e0d3ca791d3297fa010bce7ea8dd_1280.jpg",
},
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialMarqueeCards
tag="Guest Stories"
title="Voices of Grand Hotel"
description="What our guests say about their stay."
testimonials={[
{ name: "Elena R.", role: "Travel Blogger", quote: "The absolute pinnacle of luxury and service.", imageSrc: "https://pixabay.com/get/gcebae0b3a40bb33034a198992b1482e189e6b348b2c0d52414ef148b30e0409963f39f521b36c62c15fedba9437a81ad117dc5b149a5183dc0e708ddafbcc2de_1280.jpg" },
{ name: "Marcus W.", role: "Corporate CEO", quote: "A seamless and rejuvenating business trip experience.", imageSrc: "https://pixabay.com/get/gd4bb2b9597a27879f3e6efae580d89bdfe89951a154e9e678b15d21b8fc461a38d03903118d09ef535da60cf5ec718fed4b79041d6bf4c3be79ad7e36b6aa8b3_1280.jpg" },
{ name: "Sarah P.", role: "Artist", quote: "Everything about this hotel is pure magic.", imageSrc: "https://pixabay.com/get/g1e1b937ca424d2360b4bb008e731c1fa14c6d5fbe0739a6ab27473c5338520cf8f9b774ffc1e377d3af60a3592243a79cd2d4d3ca10b514929aa546bd918f734_1280.jpg" },
{ name: "David L.", role: "Architecture Student", quote: "Remarkable design and impeccable hospitality.", imageSrc: "https://pixabay.com/get/gdd3af963c897a3546bf0d0cab43746db362a7d598222facc57ab9f284d4d3655792b39d34d53c3988f761caf8e0846a1f311159a2e477cbdfb07b3983a65a9f1_1280.jpg" },
{ name: "Isabella K.", role: "Designer", quote: "Unforgettable stay. Will return very soon.", imageSrc: "https://pixabay.com/get/g1c0bf50c4e908abc37183172efa9ec91686fae568ce2d27da3da4f478ed70e67e49742ec7058f0512e04fa1f7542ee42fe24e0d3ca791d3297fa010bce7ea8dd_1280.jpg" },
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
tag="Need Help?"
title="Frequently Asked Questions"
description="Answers to your most common questions before your stay."
items={[
{
question: "What are check-in times?",
answer: "Check-in is at 3:00 PM.",
},
{
question: "Are pets allowed?",
answer: "We welcome small pets with advance notice.",
},
{
question: "Is breakfast included?",
answer: "Complimentary breakfast is served in the terrace.",
},
]}
imageSrc="https://pixabay.com/get/gb6302a67d9ad734508759fb15704e9b8642b3124b6a9aa3dcd11e132285bd281212a0275aa5f9b63a00890cc484264739e18525a82111bbd4bdd1e6c219952fe_1280.jpg"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
tag="Need Help?"
title="Frequently Asked Questions"
description="Answers to your most common questions before your stay."
items={[
{ question: "What are check-in times?", answer: "Check-in is at 3:00 PM." },
{ question: "Are pets allowed?", answer: "We welcome small pets with advance notice." },
{ question: "Is breakfast included?", answer: "Complimentary breakfast is served in the terrace." },
]}
imageSrc={{ imageSrc: "https://pixabay.com/get/gb6302a67d9ad734508759fb15704e9b8642b3124b6a9aa3dcd11e132285bd281212a0275aa5f9b63a00890cc484264739e18525a82111bbd4bdd1e6c219952fe_1280.jpg" }}
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
tag="Get in Touch"
title="Start Your Booking"
description="Connect with our team to customize your perfect stay."
inputs={[
{
name: "fullname",
type: "text",
placeholder: "Full Name",
required: true,
},
{
name: "email",
type: "email",
placeholder: "Email Address",
required: true,
},
]}
textarea={{
name: "message",
placeholder: "Please tell us your preferred dates and room type.",
rows: 4,
required: true,
}}
buttonText="Send Reservation Request"
imageSrc="https://pixabay.com/get/g964daeaa64630d4f6c4f2fe63245ab0c96dc245f2c7448c9960507495260fea64fc8d3a89f964031b9649e5046c4f2ee6fd1cd308ea6a85909342c5127e9c4ab_1280.jpg"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
tag="Get in Touch"
title="Start Your Booking"
description="Connect with our team to customize your perfect stay."
inputs={[
{ name: "fullname", type: "text", placeholder: "Full Name", required: true },
{ name: "email", type: "email", placeholder: "Email Address", required: true },
]}
textarea={{ name: "message", placeholder: "Please tell us your preferred dates and room type.", rows: 4, required: true }}
buttonText="Send Reservation Request"
imageSrc={{ imageSrc: "https://pixabay.com/get/g964daeaa64630d4f6c4f2fe63245ab0c96dc245f2c7448c9960507495260fea64fc8d3a89f964031b9649e5046c4f2ee6fd1cd308ea6a85909342c5127e9c4ab_1280.jpg" }}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimpleCard
brand="Grand Hotel"
columns={[
{
title: "Explore",
items: [
<div id="footer" data-section="footer">
<FooterSimpleCard
brand="Grand Hotel"
columns={[
{
label: "Rooms",
href: "#rooms",
title: "Explore", items: [{ label: "Rooms", href: "#rooms" }, { label: "Dining", href: "#" }, { label: "Wellness", href: "#" }],
},
{
label: "Dining",
href: "#",
title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }],
},
{
label: "Wellness",
href: "#",
},
],
},
{
title: "Legal",
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
],
},
]}
copyright="© 2024 Grand Hotel. All rights reserved."
links={[
{
label: "Instagram",
href: "#",
},
{
label: "Twitter",
href: "#",
},
]}
/>
</div>
]}
copyright="© 2024 Grand Hotel. All rights reserved."
links={[{ label: "Instagram", href: "#" }, { label: "Twitter", href: "#" }]}
/>
</div>
</>
);
}