288 lines
15 KiB
TypeScript
288 lines
15 KiB
TypeScript
"use client";
|
|
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
|
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import FeatureProcessSteps from '@/components/sections/feature/FeatureProcessSteps';
|
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
|
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-bubble"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="compact"
|
|
sizing="largeSmall"
|
|
background="circleGradient"
|
|
cardStyle="layered-gradient"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="bold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="Lily's"
|
|
navItems={[
|
|
{ name: "Bouquets", id: "featured-bouquets" },
|
|
{ name: "Occasions", id: "shop-by-occasion" },
|
|
{ name: "Custom Order", id: "custom-bouquet" },
|
|
{ name: "About", id: "why-choose" }
|
|
]}
|
|
button={{
|
|
text: "Order Now", href: "featured-bouquets"
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroCarouselLogo
|
|
logoText="LILY'S"
|
|
description="Absolutely beautiful flowers. Expert service. On-time delivery you can trust."
|
|
buttons={[
|
|
{ text: "Shop Bouquets", href: "featured-bouquets" },
|
|
{ text: "Order Delivery", href: "delivery-assurance" }
|
|
]}
|
|
slides={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/bouquet-pink-roses-with-green-leaves-inside-vase_114579-1439.jpg", imageAlt: "Fresh elegant floral bouquet arrangement"
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/bouquet-pink-roses-single-branch-rose-with-green-leaves-inside-vase_114579-1440.jpg", imageAlt: "Premium rose and peony collection"
|
|
},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/hands-packaging-flowers-wooden-table_23-2148096302.jpg", imageAlt: "Wrapped flowers ready for delivery"
|
|
}
|
|
]}
|
|
autoplayDelay={4000}
|
|
showDimOverlay={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="review-spotlight" data-section="review-spotlight">
|
|
<TestimonialCardOne
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Mitchell", role: "Event Planner", company: "Local Events Co.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/smiling-face-gorgeous-latin-american-woman_1262-5766.jpg"
|
|
},
|
|
{
|
|
id: "2", name: "Jessica Chen", role: "Customer", company: "Anniversary Celebration", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/pretty-smiling-woman-offering-glass-whiskey_23-2148037522.jpg"
|
|
},
|
|
{
|
|
id: "3", name: "Michael Torres", role: "Groom", company: "Wedding Day", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/handsome-groom-wedding-suit-posting-park_1150-9321.jpg"
|
|
},
|
|
{
|
|
id: "4", name: "Emily Rodriguez", role: "Regular Customer", company: "Birthday Bouquets", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/pretty-smiling-woman-offering-glass-whiskey_23-2148037522.jpg"
|
|
}
|
|
]}
|
|
title="Loved by Our Customers"
|
|
description="Absolutely beautiful flowers and great service! The bouquet was fresh, elegant, and exactly what I wanted. Delivery was fast and right on time. Will definitely order again."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="shop-by-occasion" data-section="shop-by-occasion">
|
|
<ProductCardTwo
|
|
title="Shop by Occasion"
|
|
description="Find the perfect bouquet for every special moment"
|
|
tag="Collections"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
gridVariant="three-columns-all-equal-width"
|
|
products={[
|
|
{
|
|
id: "birthday", brand: "Occasion", name: "Birthday Blooms", price: "$65 - $125", rating: 5,
|
|
reviewCount: "284", imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-bouquet-yellow-orange-dahliason-light-background_169016-39443.jpg"
|
|
},
|
|
{
|
|
id: "anniversary", brand: "Occasion", name: "Anniversary Romance", price: "$85 - $150", rating: 5,
|
|
reviewCount: "156", imageSrc: "http://img.b2bpic.net/free-photo/background-valentine-s-day-with-bouquet-roses-decorative-details_169016-26065.jpg"
|
|
},
|
|
{
|
|
id: "romance", brand: "Occasion", name: "Red Romance", price: "$75 - $140", rating: 5,
|
|
reviewCount: "312", imageSrc: "http://img.b2bpic.net/free-photo/composition-valentine39s-day-with-gift-box-bouquet-roses_169016-25825.jpg"
|
|
},
|
|
{
|
|
id: "sympathy", brand: "Occasion", name: "Sympathy & Peace", price: "$60 - $110", rating: 5,
|
|
reviewCount: "89", imageSrc: "http://img.b2bpic.net/free-photo/top-view-flowers-bouquet_23-2148455224.jpg"
|
|
},
|
|
{
|
|
id: "congrats", brand: "Occasion", name: "Congratulations", price: "$70 - $120", rating: 5,
|
|
reviewCount: "145", imageSrc: "http://img.b2bpic.net/free-photo/gerbera-flowers-paper-bag_23-2148268256.jpg"
|
|
},
|
|
{
|
|
id: "just-because", brand: "Occasion", name: "Just Because", price: "$50 - $95", rating: 5,
|
|
reviewCount: "201", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-bunch-flowers-wooden-background-horizontal-view-from_1220-1133.jpg"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="featured-bouquets" data-section="featured-bouquets">
|
|
<ProductCardTwo
|
|
title="Our Featured Collections"
|
|
description="Handpicked best-sellers and designer favorites"
|
|
tag="Best Sellers"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
gridVariant="three-columns-all-equal-width"
|
|
products={[
|
|
{
|
|
id: "elegance-supreme", brand: "Designer Favorite", name: "Elegance Supreme", price: "$95", rating: 5,
|
|
reviewCount: "178", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-female-florist-with-bouquet-hands-floristic-shop_613910-15136.jpg"
|
|
},
|
|
{
|
|
id: "rose-garden", brand: "Best Seller", name: "Rose Garden", price: "$85", rating: 5,
|
|
reviewCount: "312", imageSrc: "http://img.b2bpic.net/free-photo/decoration-artificial-flower-table-filtered-image-processed_1232-3695.jpg"
|
|
},
|
|
{
|
|
id: "blush-crush", brand: "Same-Day Available", name: "Blush Crush", price: "$75", rating: 5,
|
|
reviewCount: "245", imageSrc: "http://img.b2bpic.net/free-photo/closeup-bouquet-ranunculus-flowers_53876-144506.jpg"
|
|
},
|
|
{
|
|
id: "garden-dreams", brand: "Designer Favorite", name: "Garden Dreams", price: "$105", rating: 5,
|
|
reviewCount: "189", imageSrc: "http://img.b2bpic.net/free-photo/bridal-bouquet-lies-wooden-surface_8353-9652.jpg"
|
|
},
|
|
{
|
|
id: "tropical-paradise", brand: "Best Seller", name: "Tropical Paradise", price: "$90", rating: 5,
|
|
reviewCount: "267", imageSrc: "http://img.b2bpic.net/free-vector/watercolor-tropical-background-leaves_23-2147550635.jpg"
|
|
},
|
|
{
|
|
id: "white-elegance", brand: "Premium", name: "White Elegance", price: "$110", rating: 5,
|
|
reviewCount: "143", imageSrc: "http://img.b2bpic.net/free-photo/close-up-white-spring-peonies-flowers-bed_169016-21421.jpg"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="why-choose" data-section="why-choose">
|
|
<FeatureProcessSteps
|
|
tag="Why Lily's"
|
|
title="Why Choose Lily's Flower Shop"
|
|
description="More than just flowers—an experience in elegance and care"
|
|
useInvertedBackground={false}
|
|
stepsAnimation="slide-up"
|
|
steps={[
|
|
{
|
|
number: "01", title: "Fresh, Elegant Arrangements", description: "Every bouquet is handcrafted with the freshest premium flowers, arranged with meticulous attention to color harmony and visual balance.", tag: "Always Fresh"
|
|
},
|
|
{
|
|
number: "02", title: "Personalized Service", description: "We listen to what you want and deliver exactly that. Custom colors, styles, flowers, and budgets—crafted just for you.", tag: "Your Vision"
|
|
},
|
|
{
|
|
number: "03", title: "Reliable, On-Time Delivery", description: "Same-day and next-day delivery available. Every arrangement arrives fresh, beautifully presented, and on schedule—guaranteed.", tag: "Trusted Delivery"
|
|
},
|
|
{
|
|
number: "04", title: "Premium Presentation", description: "Elegant wrapping, luxury packaging, and thoughtful finishing touches make every delivery feel like a gift itself.", tag: "Premium Care"
|
|
},
|
|
{
|
|
number: "05", title: "Exceptional Customer Care", description: "Before, during, and after your order—we're here to answer questions, accommodate requests, and ensure you're thrilled.", tag: "Always Available"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="custom-bouquet" data-section="custom-bouquet">
|
|
<MetricSplitMediaAbout
|
|
tag="Design Your Own"
|
|
title="Custom Bouquet Service"
|
|
description="Can't find exactly what you're looking for? We create custom arrangements tailored to your vision. Tell us your occasion, preferred colors, style, and budget—and our florists will craft something uniquely beautiful."
|
|
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-flower-shop_23-2149247584.jpg"
|
|
imageAlt="Florist creating custom arrangement"
|
|
useInvertedBackground={false}
|
|
mediaAnimation="slide-up"
|
|
metrics={[
|
|
{
|
|
value: "100%", title: "Custom Orders Fulfilled"
|
|
},
|
|
{
|
|
value: "24-48hrs", title: "Typical Turnaround"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials-full" data-section="testimonials-full">
|
|
<TestimonialCardOne
|
|
title="Customer Stories"
|
|
description="Heartfelt moments shared by customers who chose Lily's"
|
|
tag="Real Reviews"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Angela Walsh", role: "Wife", company: "Anniversary Gift", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-cheerful-woman_329181-7271.jpg"
|
|
},
|
|
{
|
|
id: "2", name: "David Kim", role: "Groom", company: "Wedding Flowers", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/groom-with-wedding-bouquet_1328-4823.jpg"
|
|
},
|
|
{
|
|
id: "3", name: "Patricia Johnson", role: "Customer", company: "Sympathy Arrangement", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2826.jpg"
|
|
},
|
|
{
|
|
id: "4", name: "Robert Adams", role: "Customer", company: "Corporate Gift", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/blond-businessman-happy-expression_1194-3796.jpg"
|
|
},
|
|
{
|
|
id: "5", name: "Linda Martinez", role: "Regular Customer", company: "Monthly Deliveries", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/front-view-cute-girl-looking-away_23-2148436134.jpg"
|
|
},
|
|
{
|
|
id: "6", name: "James Chen", role: "Boyfriend", company: "Valentine's Day", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/man-with-red-rose-valentines-day_23-2148383164.jpg"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="delivery-assurance" data-section="delivery-assurance">
|
|
<MetricSplitMediaAbout
|
|
tag="Delivery Guarantee"
|
|
title="Fast, Reliable Delivery"
|
|
description="We understand that timing matters. That's why we offer same-day delivery on orders placed by 2 PM, and next-day delivery on all other orders. Every bouquet arrives fresh, beautifully presented, and on time—or your satisfaction is guaranteed."
|
|
imageSrc="http://img.b2bpic.net/free-photo/female-florist-promoting-mixed-flower-basket_114579-2775.jpg"
|
|
imageAlt="Florist preparing delivery arrangement"
|
|
useInvertedBackground={false}
|
|
mediaAnimation="slide-up"
|
|
metrics={[
|
|
{
|
|
value: "99.8%", title: "On-Time Delivery Rate"
|
|
},
|
|
{
|
|
value: "2 Hours", title: "Local Delivery Average"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoReveal
|
|
logoText="Lily's"
|
|
leftLink={{
|
|
text: "Privacy Policy", href: "#"
|
|
}}
|
|
rightLink={{
|
|
text: "Contact Us", href: "#"
|
|
}}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |