Merge version_1 into main #2
365
src/app/page.tsx
365
src/app/page.tsx
@@ -15,268 +15,127 @@ import { Camera } from "lucide-react";
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
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">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Features",
|
||||
id: "#features",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "#pricing",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "#testimonials",
|
||||
},
|
||||
]}
|
||||
brandName="FlashBooth"
|
||||
button={{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Features", id: "#features" },
|
||||
{ name: "Pricing", id: "#pricing" },
|
||||
{ name: "Testimonials", id: "#testimonials" }
|
||||
]}
|
||||
brandName="FlashBooth"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Capture the Fun Moments"
|
||||
description="Elevate your next event with our premium, modern photobooth experience. Instant prints, digital sharing, and endless smiles guaranteed."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your Booth",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg?_wi=1",
|
||||
imageAlt: "Fun at an event",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg?_wi=2",
|
||||
imageAlt: "Fun at an event",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg?_wi=3",
|
||||
imageAlt: "Fun at an event",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg?_wi=4",
|
||||
imageAlt: "Fun at an event",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg?_wi=5",
|
||||
imageAlt: "Fun at an event",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg?_wi=6",
|
||||
imageAlt: "Fun at an event",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Capture the Fun Moments"
|
||||
description="Elevate your next event with our premium, modern photobooth experience. Instant prints, digital sharing, and endless smiles guaranteed."
|
||||
buttons={[{ text: "Book Your Booth", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg", imageAlt: "Fun at an event" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg", imageAlt: "Fun at an event" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg", imageAlt: "Fun at an event" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg", imageAlt: "Fun at an event" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg", imageAlt: "Fun at an event" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/astonished-happy-young-woman-with-stylish-coiffure-mirror-hairdresser-salon_197531-3683.jpg", imageAlt: "Fun at an event" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="About Us"
|
||||
title="Making Memories Count"
|
||||
description="At FlashBooth, we specialize in high-energy, high-quality photobooth experiences for every type of event."
|
||||
subdescription="From weddings and galas to corporate branding events, we bring the fun with professional-grade lighting, props, and instant print technology."
|
||||
icon={Camera}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/person-taking-photo-his-best-friends-new-year-s-eve-party_23-2148724190.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="About Us"
|
||||
title="Making Memories Count"
|
||||
description="At FlashBooth, we specialize in high-energy, high-quality photobooth experiences for every type of event."
|
||||
subdescription="From weddings and galas to corporate branding events, we bring the fun with professional-grade lighting, props, and instant print technology."
|
||||
icon={Camera}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/person-taking-photo-his-best-friends-new-year-s-eve-party_23-2148724190.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Instant Prints",
|
||||
description: "High-quality glossy photos printed on-site in seconds.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-african-woman-pointing-while-redhead-lady-photographing_171337-15372.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Digital Sharing",
|
||||
description: "Guests can instantly text or email their photos directly.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-african-woman-pointing-while-redhead-lady-photographing_171337-15372.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
title: "Fun Props",
|
||||
description: "A curated collection of fun props for every occasion.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-african-woman-pointing-while-redhead-lady-photographing_171337-15372.jpg?_wi=3",
|
||||
},
|
||||
]}
|
||||
title="Why FlashBooth?"
|
||||
description="The best features for the best party."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Instant Prints", description: "High-quality glossy photos printed on-site in seconds.", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-african-woman-pointing-while-redhead-lady-photographing_171337-15372.jpg" },
|
||||
{ title: "Digital Sharing", description: "Guests can instantly text or email their photos directly.", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-african-woman-pointing-while-redhead-lady-photographing_171337-15372.jpg" },
|
||||
{ title: "Fun Props", description: "A curated collection of fun props for every occasion.", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-african-woman-pointing-while-redhead-lady-photographing_171337-15372.jpg" }
|
||||
]}
|
||||
title="Why FlashBooth?"
|
||||
description="The best features for the best party."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "silver",
|
||||
badge: "Essential",
|
||||
price: "$499",
|
||||
subtitle: "Perfect for small parties",
|
||||
features: [
|
||||
"3 hours",
|
||||
"Unlimited prints",
|
||||
"Digital copy",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "gold",
|
||||
badge: "Popular",
|
||||
price: "$699",
|
||||
subtitle: "Great for weddings",
|
||||
features: [
|
||||
"5 hours",
|
||||
"Unlimited prints",
|
||||
"Digital copy",
|
||||
"Custom frame",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "platinum",
|
||||
badge: "VIP",
|
||||
price: "$999",
|
||||
subtitle: "Best for big events",
|
||||
features: [
|
||||
"8 hours",
|
||||
"Unlimited prints",
|
||||
"Digital copy",
|
||||
"Custom frame",
|
||||
"On-site tech",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Simple Pricing"
|
||||
description="Pick the package that fits your celebration."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{ id: "silver", badge: "Essential", price: "$499", subtitle: "Perfect for small parties", features: ["3 hours", "Unlimited prints", "Digital copy"], buttons: [{ text: "Book Now", href: "#contact" }] },
|
||||
{ id: "gold", badge: "Popular", price: "$699", subtitle: "Great for weddings", features: ["5 hours", "Unlimited prints", "Digital copy", "Custom frame"], buttons: [{ text: "Book Now", href: "#contact" }] },
|
||||
{ id: "platinum", badge: "VIP", price: "$999", subtitle: "Best for big events", features: ["8 hours", "Unlimited prints", "Digital copy", "Custom frame", "On-site tech"], buttons: [{ text: "Book Now", href: "#contact" }] }
|
||||
]}
|
||||
title="Simple Pricing"
|
||||
description="Pick the package that fits your celebration."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Anna S.",
|
||||
handle: "@annas",
|
||||
testimonial: "Best photobooth ever!",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-cheerful-groom-bride-happily-taking-selfie-together-garden-restaurant_574295-1284.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark D.",
|
||||
handle: "@markd",
|
||||
testimonial: "Fantastic setup and quality.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/people-taking-part-business-event_23-2149333727.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Sarah P.",
|
||||
handle: "@sarahp",
|
||||
testimonial: "Guests couldn't get enough.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-men-bachelor-party_23-2149275466.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "James B.",
|
||||
handle: "@jamesb",
|
||||
testimonial: "Super smooth and professional.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/group-friends-2018-party_23-2147717224.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Lisa K.",
|
||||
handle: "@lisak",
|
||||
testimonial: "Worth every penny.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/group-friends-2018-party_23-2147717224.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
showRating={true}
|
||||
title="Loved by Guests"
|
||||
description="Read what people say about our services."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Anna S.", handle: "@annas", testimonial: "Best photobooth ever!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-cheerful-groom-bride-happily-taking-selfie-together-garden-restaurant_574295-1284.jpg" },
|
||||
{ id: "2", name: "Mark D.", handle: "@markd", testimonial: "Fantastic setup and quality.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/people-taking-part-business-event_23-2149333727.jpg" },
|
||||
{ id: "3", name: "Sarah P.", handle: "@sarahp", testimonial: "Guests couldn't get enough.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-men-bachelor-party_23-2149275466.jpg" },
|
||||
{ id: "4", name: "James B.", handle: "@jamesb", testimonial: "Super smooth and professional.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/group-friends-2018-party_23-2147717224.jpg" },
|
||||
{ id: "5", name: "Lisa K.", handle: "@lisak", testimonial: "Worth every penny.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/group-friends-2018-party_23-2147717224.jpg" }
|
||||
]}
|
||||
showRating={true}
|
||||
title="Loved by Guests"
|
||||
description="Read what people say about our services."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Contact"
|
||||
title="Ready to Start?"
|
||||
description="Send us a message to secure your date."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get a Quote",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Contact"
|
||||
title="Ready to Start?"
|
||||
description="Send us a message to secure your date."
|
||||
buttons={[{ text: "Get a Quote", href: "#contact" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="FlashBooth"
|
||||
leftLink={{
|
||||
text: "© 2024 FlashBooth",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="FlashBooth"
|
||||
leftLink={{ text: "© 2024 FlashBooth", href: "#" }}
|
||||
rightLink={{ text: "Privacy Policy", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user