Merge version_1 into main #1
@@ -22,71 +22,53 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "Gallery",
|
||||
id: "/gallery",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Kim's Creations"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Gallery", id: "/gallery" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Kim's Creations"
|
||||
button={{ text: "Get Started", href: "/contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Booking"
|
||||
title="Ready to Celebrate?"
|
||||
description="Reach out to discuss your event balloon needs. Let's make something amazing together."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Booking"
|
||||
title="Ready to Celebrate?"
|
||||
description="Reach out to discuss your event balloon needs. Let's make something amazing together."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="legal" data-section="legal">
|
||||
<LegalSection
|
||||
layout="section"
|
||||
title="Booking & Cancellation Policy"
|
||||
sections={[
|
||||
{
|
||||
heading: "Deposit Terms",
|
||||
content: {
|
||||
type: "paragraph",
|
||||
text: "A 50% non-refundable deposit is required to secure your date.",
|
||||
},
|
||||
},
|
||||
{
|
||||
heading: "Cancellation Policy",
|
||||
content: {
|
||||
type: "list",
|
||||
items: [
|
||||
"Cancel 14 days before: 50% refund",
|
||||
"Cancel within 7 days: No refund",
|
||||
"Date changes subject to availability",
|
||||
],
|
||||
},
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="legal" data-section="legal">
|
||||
<LegalSection
|
||||
layout="section"
|
||||
title="Booking & Cancellation Policy"
|
||||
sections={[
|
||||
{
|
||||
heading: "Deposit Terms", content: {
|
||||
text: "A 50% non-refundable deposit is required to secure your date."},
|
||||
},
|
||||
{
|
||||
heading: "Cancellation Policy", content: {
|
||||
items: [
|
||||
"Cancel 14 days before: 50% refund", "Cancel within 7 days: No refund", "Date changes subject to availability"],
|
||||
},
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Kim's Creations"
|
||||
copyrightText="© 2025 Kim's Creations | Balloon Styling & Rentals"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Kim's Creations"
|
||||
copyrightText="© 2025 Kim's Creations | Balloon Styling & Rentals"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
@@ -22,146 +22,55 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "Gallery",
|
||||
id: "/gallery",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Kim's Creations"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Gallery", id: "/gallery" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Kim's Creations"
|
||||
button={{ text: "Contact Us", href: "/contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "Custom",
|
||||
name: "Luxury Arch",
|
||||
price: "$150",
|
||||
rating: 5,
|
||||
reviewCount: "24",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-with-balloons-walking-towards-man_23-2147699167.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "Custom",
|
||||
name: "Balloon Garland",
|
||||
price: "$200",
|
||||
rating: 5,
|
||||
reviewCount: "18",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/table-arrangement-birthday-event-with-cake-rose_23-2149312295.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "Custom",
|
||||
name: "Table Clusters",
|
||||
price: "$75",
|
||||
rating: 4,
|
||||
reviewCount: "40",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confetti-falling-from-martin-glass-with-balloons-desk-bathroom_23-2148092549.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
brand: "Custom",
|
||||
name: "Sculpture Set",
|
||||
price: "$120",
|
||||
rating: 5,
|
||||
reviewCount: "12",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/balloon-twist-shaped-like-tree_23-2151625302.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
brand: "Custom",
|
||||
name: "Anniversary Setup",
|
||||
price: "$250",
|
||||
rating: 5,
|
||||
reviewCount: "30",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-with-handpan_23-2149454395.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
brand: "Custom",
|
||||
name: "Backdrop Decor",
|
||||
price: "$300",
|
||||
rating: 5,
|
||||
reviewCount: "22",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-balloons-elephant-toy_181624-46606.jpg",
|
||||
},
|
||||
]}
|
||||
title="Our Creations"
|
||||
description="Explore our favorite setups and balloon arrangements."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", brand: "Custom", name: "Luxury Arch", price: "$150", rating: 5, reviewCount: "24", imageSrc: "http://img.b2bpic.net/free-photo/woman-with-balloons-walking-towards-man_23-2147699167.jpg" },
|
||||
{ id: "p2", brand: "Custom", name: "Balloon Garland", price: "$200", rating: 5, reviewCount: "18", imageSrc: "http://img.b2bpic.net/free-photo/table-arrangement-birthday-event-with-cake-rose_23-2149312295.jpg" },
|
||||
{ id: "p3", brand: "Custom", name: "Table Clusters", price: "$75", rating: 4, reviewCount: "40", imageSrc: "http://img.b2bpic.net/free-photo/confetti-falling-from-martin-glass-with-balloons-desk-bathroom_23-2148092549.jpg" },
|
||||
]}
|
||||
title="Our Creations"
|
||||
description="Explore our favorite setups and balloon arrangements."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah J.",
|
||||
role: "Party Host",
|
||||
testimonial: "The balloon arch was perfect! Really made the room look magical.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-florist-speaking-phone_23-2147760930.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Michael B.",
|
||||
role: "Groom",
|
||||
testimonial: "Great professional service. Everything was set up on time.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-bride-posing-with-flowers_23-2149722039.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Emily P.",
|
||||
role: "Event Planner",
|
||||
testimonial: "Stunning work! Highly recommended for any event.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-woman-celebrating-carnival_23-2147852536.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David L.",
|
||||
role: "Business Owner",
|
||||
testimonial: "Excellent balloon setup for our store opening.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-beautiful-girl-wearing-party-hat-holding-balloons-showing-phone-call-gesture_141793-127003.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Jessica R.",
|
||||
role: "Parent",
|
||||
testimonial: "My daughter loved her birthday display! Thank you so much.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-women-surprising-man-work_23-2149295501.jpg",
|
||||
},
|
||||
]}
|
||||
title="Loved By Our Clients"
|
||||
description="Hear what our amazing clients have to say."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Sarah J.", role: "Party Host", testimonial: "The balloon arch was perfect! Really made the room look magical.", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-florist-speaking-phone_23-2147760930.jpg" },
|
||||
{ id: "t2", name: "Michael B.", role: "Groom", testimonial: "Great professional service. Everything was set up on time.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-bride-posing-with-flowers_23-2149722039.jpg" },
|
||||
{ id: "t3", name: "Emily P.", role: "Event Planner", testimonial: "Stunning work! Highly recommended for any event.", imageSrc: "http://img.b2bpic.net/free-photo/happy-woman-celebrating-carnival_23-2147852536.jpg" },
|
||||
]}
|
||||
title="Loved By Our Clients"
|
||||
description="Hear what our amazing clients have to say."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Kim's Creations"
|
||||
copyrightText="© 2025 Kim's Creations | Balloon Styling & Rentals"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Kim's Creations"
|
||||
copyrightText="© 2025 Kim's Creations | Balloon Styling & Rentals"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
245
src/app/page.tsx
245
src/app/page.tsx
@@ -26,170 +26,99 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "Gallery",
|
||||
id: "/gallery",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Kim's Creations"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Gallery", id: "/gallery" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Kim's Creations"
|
||||
button={{ text: "Get Started", href: "/contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Making Your Special Events Pop!"
|
||||
description="Professional balloon setups and rentals for birthdays, weddings, and corporate milestones. We bring the celebration to you."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/bunch-different-colored-balloons-holiday-concept_169016-4772.jpg"
|
||||
imageAlt="Balloon setups for events"
|
||||
buttons={[
|
||||
{
|
||||
text: "View Gallery",
|
||||
href: "/gallery",
|
||||
},
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "/contact",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Making Your Special Events Pop!"
|
||||
description="Professional balloon setups and rentals for birthdays, weddings, and corporate milestones. We bring the celebration to you."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/bunch-different-colored-balloons-holiday-concept_169016-4772.jpg"
|
||||
imageAlt="Balloon setups for events"
|
||||
buttons={[
|
||||
{ text: "View Gallery", href: "/gallery" },
|
||||
{ text: "Contact Us", href: "/contact" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Creative Balloon Artistry"
|
||||
description="Kim's Creations is dedicated to turning every ordinary space into an extraordinary experience with high-quality, custom balloon designs. We love helping you celebrate life's biggest moments."
|
||||
metrics={[
|
||||
{
|
||||
value: "500+",
|
||||
title: "Events Styled",
|
||||
},
|
||||
{
|
||||
value: "100%",
|
||||
title: "Smiles Delivered",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/beautiful-woman-with-curly-blonde-hair-makes-peace-gesture-eye-dressed-fashionable-orange-jacket-celebrates-special-occasion-holds-bunch-inflated-balloons-isolated-purple-background_273609-62416.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Creative Balloon Artistry"
|
||||
description="Kim's Creations is dedicated to turning every ordinary space into an extraordinary experience with high-quality, custom balloon designs. We love helping you celebrate life's biggest moments."
|
||||
metrics={[
|
||||
{ value: "500+", title: "Events Styled" },
|
||||
{ value: "100%", title: "Smiles Delivered" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/beautiful-woman-with-curly-blonde-hair-makes-peace-gesture-eye-dressed-fashionable-orange-jacket-celebrates-special-occasion-holds-bunch-inflated-balloons-isolated-purple-background_273609-62416.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Why Choose Kim's Creations?"
|
||||
description="We prioritize quality, creativity, and customer satisfaction in every design."
|
||||
features={[
|
||||
{
|
||||
icon: Star,
|
||||
title: "Premium Materials",
|
||||
description: "High-quality, long-lasting balloons for every event.",
|
||||
},
|
||||
{
|
||||
icon: Palette,
|
||||
title: "Custom Designs",
|
||||
description: "Tailored arrangements to match your theme.",
|
||||
},
|
||||
{
|
||||
icon: Clock,
|
||||
title: "Punctual Setup",
|
||||
description: "We ensure everything is ready when your guests arrive.",
|
||||
},
|
||||
{
|
||||
icon: Smile,
|
||||
title: "Satisfaction Guaranteed",
|
||||
description: "We aren't happy until you are.",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: "Expert Styling",
|
||||
description: "Professional decorators with a creative eye.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Why Choose Kim's Creations?"
|
||||
description="We prioritize quality, creativity, and customer satisfaction in every design."
|
||||
features={[
|
||||
{ icon: Star, title: "Premium Materials", description: "High-quality, long-lasting balloons for every event." },
|
||||
{ icon: Palette, title: "Custom Designs", description: "Tailored arrangements to match your theme." },
|
||||
{ icon: Clock, title: "Punctual Setup", description: "We ensure everything is ready when your guests arrive." },
|
||||
{ icon: Smile, title: "Satisfaction Guaranteed", description: "We aren't happy until you are." },
|
||||
{ icon: Award, title: "Expert Styling", description: "Professional decorators with a creative eye." },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="socialProof" data-section="socialProof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Trusted by Top Local Venues"
|
||||
description="We work closely with the best event locations in the city."
|
||||
names={[
|
||||
"The Grand Hall",
|
||||
"Riverside Events",
|
||||
"Sunset Gardens",
|
||||
"The Oak Ballroom",
|
||||
"Elite Plaza",
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="socialProof" data-section="socialProof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Trusted by Top Local Venues"
|
||||
description="We work closely with the best event locations in the city."
|
||||
names={["The Grand Hall", "Riverside Events", "Sunset Gardens", "The Oak Ballroom", "Elite Plaza"]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Simple Pricing Packages"
|
||||
description="Transparent pricing for your peace of mind."
|
||||
plans={[
|
||||
{
|
||||
id: "basic",
|
||||
title: "Standard Party",
|
||||
price: "$150",
|
||||
period: "starting at",
|
||||
features: [
|
||||
"Balloon Bouquet",
|
||||
"Simple Arch",
|
||||
"Delivery included",
|
||||
],
|
||||
button: {
|
||||
text: "Book Now",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/balloon-twist-shaped-like-giraffe_23-2151625295.jpg",
|
||||
},
|
||||
{
|
||||
id: "premium",
|
||||
title: "Luxury Milestone",
|
||||
price: "$350",
|
||||
period: "starting at",
|
||||
features: [
|
||||
"Custom Garland",
|
||||
"Photo Backdrop",
|
||||
"Setup & Cleanup",
|
||||
"Design Consultation",
|
||||
],
|
||||
button: {
|
||||
text: "Book Now",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-balloon-twist-sculpture_23-2151657514.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Simple Pricing Packages"
|
||||
description="Transparent pricing for your peace of mind."
|
||||
plans={[
|
||||
{
|
||||
id: "basic", title: "Standard Party", price: "$150", period: "starting at", features: ["Balloon Bouquet", "Simple Arch", "Delivery included"],
|
||||
button: { text: "Book Now" },
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/balloon-twist-shaped-like-giraffe_23-2151625295.jpg"},
|
||||
{
|
||||
id: "premium", title: "Luxury Milestone", price: "$350", period: "starting at", features: ["Custom Garland", "Photo Backdrop", "Setup & Cleanup", "Design Consultation"],
|
||||
button: { text: "Book Now" },
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-balloon-twist-sculpture_23-2151657514.jpg"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Kim's Creations"
|
||||
copyrightText="© 2025 Kim's Creations | Balloon Styling & Rentals"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Kim's Creations"
|
||||
copyrightText="© 2025 Kim's Creations | Balloon Styling & Rentals"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user