Update src/app/page.tsx
This commit is contained in:
277
src/app/page.tsx
277
src/app/page.tsx
@@ -31,22 +31,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="John's Famous Flowers"
|
||||
/>
|
||||
@@ -54,48 +42,17 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="John's Famous Flowers"
|
||||
description="Bringing beauty into your life with our hand-picked, artisanal floral arrangements."
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Now",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Shop Now", href: "#products" }]}
|
||||
carouselItems={[
|
||||
{
|
||||
id: "1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-tulips-table_23-2148480711.jpg",
|
||||
imageAlt: "Flowers",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-pink-white-color-roses-alstroemeria-flowers-white-background_141793-8151.jpg",
|
||||
imageAlt: "Flowers",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/spring-composition-with-snowdrops-crocuses-close-up_169016-30378.jpg",
|
||||
imageAlt: "Flowers",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/white-flowers-wooden-fence-closeup_169016-20746.jpg",
|
||||
imageAlt: "Flowers",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-luxurious-bouquet-pink-red-roses-white-dahlias-black-background_181624-24023.jpg",
|
||||
imageAlt: "Flowers",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vibrant-gerbera-daisies_23-2151961701.jpg",
|
||||
imageAlt: "Flowers",
|
||||
},
|
||||
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-tulips-table_23-2148480711.jpg", imageAlt: "Flowers" },
|
||||
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/side-view-pink-white-color-roses-alstroemeria-flowers-white-background_141793-8151.jpg", imageAlt: "Flowers" },
|
||||
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/spring-composition-with-snowdrops-crocuses-close-up_169016-30378.jpg", imageAlt: "Flowers" },
|
||||
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/white-flowers-wooden-fence-closeup_169016-20746.jpg", imageAlt: "Flowers" },
|
||||
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-luxurious-bouquet-pink-red-roses-white-dahlias-black-background_181624-24023.jpg", imageAlt: "Flowers" },
|
||||
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/vibrant-gerbera-daisies_23-2151961701.jpg", imageAlt: "Flowers" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -105,21 +62,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
title="Our Passion"
|
||||
metrics={[
|
||||
{
|
||||
icon: Star,
|
||||
label: "Arrangements Sold",
|
||||
value: "15,000+",
|
||||
},
|
||||
{
|
||||
icon: Smile,
|
||||
label: "Happy Clients",
|
||||
value: "10,000+",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
label: "Years Active",
|
||||
value: "20+",
|
||||
},
|
||||
{ icon: Star, label: "Arrangements Sold", value: "15,000+" },
|
||||
{ icon: Smile, label: "Happy Clients", value: "10,000+" },
|
||||
{ icon: Award, label: "Years Active", value: "20+" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -131,21 +76,9 @@ export default function LandingPage() {
|
||||
title="Why Choose Us"
|
||||
description="We don't just sell flowers; we curate experiences."
|
||||
accordionItems={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Freshness Guaranteed",
|
||||
content: "We source daily from local farms.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Artisanal Design",
|
||||
content: "Every bouquet is designed by hand.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Fast Delivery",
|
||||
content: "Same-day delivery available across the city.",
|
||||
},
|
||||
{ id: "f1", title: "Freshness Guaranteed", content: "We source daily from local farms." },
|
||||
{ id: "f2", title: "Artisanal Design", content: "Every bouquet is designed by hand." },
|
||||
{ id: "f3", title: "Fast Delivery", content: "Same-day delivery available across the city." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/birthday-flowers-with-empty-note_23-2149053811.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
@@ -159,42 +92,12 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Romantic Roses",
|
||||
price: "$55.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/bouquet-red-roses-female-hands-white-background-top-view_169016-26131.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Spring Tulips",
|
||||
price: "$45.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-bicycle-basket_23-2149681985.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Golden Sunflowers",
|
||||
price: "$40.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ai-generated-sunflowers_23-2150681824.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Wedding Floral Set",
|
||||
price: "$150.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/alley-leading-wedding-arch_1304-4051.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Mixed Seasonal",
|
||||
price: "$60.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flower-composition-bucket-roses-chrysanthemum-side-view_141793-4420.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Elegant Orchid",
|
||||
price: "$75.00",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-plants-deco_23-2149198533.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Romantic Roses", price: "$55.00", imageSrc: "http://img.b2bpic.net/free-photo/bouquet-red-roses-female-hands-white-background-top-view_169016-26131.jpg" },
|
||||
{ id: "p2", name: "Spring Tulips", price: "$45.00", imageSrc: "http://img.b2bpic.net/free-photo/still-life-bicycle-basket_23-2149681985.jpg" },
|
||||
{ id: "p3", name: "Golden Sunflowers", price: "$40.00", imageSrc: "http://img.b2bpic.net/free-photo/ai-generated-sunflowers_23-2150681824.jpg" },
|
||||
{ id: "p4", name: "Wedding Floral Set", price: "$150.00", imageSrc: "http://img.b2bpic.net/free-photo/alley-leading-wedding-arch_1304-4051.jpg" },
|
||||
{ id: "p5", name: "Mixed Seasonal", price: "$60.00", imageSrc: "http://img.b2bpic.net/free-photo/flower-composition-bucket-roses-chrysanthemum-side-view_141793-4420.jpg" },
|
||||
{ id: "p6", name: "Elegant Orchid", price: "$75.00", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-plants-deco_23-2149198533.jpg" },
|
||||
]}
|
||||
title="Our Creations"
|
||||
description="Browse our latest signature bouquets."
|
||||
@@ -208,52 +111,16 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "m",
|
||||
badge: "Monthly",
|
||||
price: "$40/mo",
|
||||
subtitle: "Perfect for homes",
|
||||
buttons: [
|
||||
{
|
||||
text: "Subscribe",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"1 delivery per month",
|
||||
"Standard seasonal flowers",
|
||||
],
|
||||
id: "m", badge: "Monthly", price: "$40/mo", subtitle: "Perfect for homes", buttons: [{ text: "Subscribe", href: "#" }],
|
||||
features: ["1 delivery per month", "Standard seasonal flowers"],
|
||||
},
|
||||
{
|
||||
id: "w",
|
||||
badge: "Weekly",
|
||||
price: "$120/mo",
|
||||
subtitle: "For offices",
|
||||
buttons: [
|
||||
{
|
||||
text: "Subscribe",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"4 deliveries per month",
|
||||
"Premium selection",
|
||||
],
|
||||
id: "w", badge: "Weekly", price: "$120/mo", subtitle: "For offices", buttons: [{ text: "Subscribe", href: "#" }],
|
||||
features: ["4 deliveries per month", "Premium selection"],
|
||||
},
|
||||
{
|
||||
id: "p",
|
||||
badge: "Pro",
|
||||
price: "$250/mo",
|
||||
subtitle: "For events",
|
||||
buttons: [
|
||||
{
|
||||
text: "Subscribe",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
features: [
|
||||
"Weekly luxury arrangements",
|
||||
"Priority support",
|
||||
],
|
||||
id: "p", badge: "Pro", price: "$250/mo", subtitle: "For events", buttons: [{ text: "Subscribe", href: "#" }],
|
||||
features: ["Weekly luxury arrangements", "Priority support"],
|
||||
},
|
||||
]}
|
||||
title="Subscription Plans"
|
||||
@@ -263,49 +130,15 @@ export default function LandingPage() {
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alice M.",
|
||||
handle: "@alice",
|
||||
testimonial: "The best flower shop in town!",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-young-beautiful-smiling-woman-looking-trendy-girl-casual-summer-hoodie-skirt-clothes_158538-1428.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Bob D.",
|
||||
handle: "@bob",
|
||||
testimonial: "My wife absolutely loved the roses.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-cheerful-smiling-man-looking-happy-express-enthusiastic-optimistic-emotions-seei_1258-113416.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Carla F.",
|
||||
handle: "@carla",
|
||||
testimonial: "Amazing service and beautiful arrangements.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-happy-man-showing-approval_23-2148230800.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David G.",
|
||||
handle: "@david",
|
||||
testimonial: "Fast delivery and very fresh flowers.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-satisfied-happy-young-man-glasses-working-cafe-sitting-coworking-space-with-laptop-showing-thumbs-up-like-approve-smth-good-chatting-giving-online-lessons_1258-314620.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Eva P.",
|
||||
handle: "@eva",
|
||||
testimonial: "Worth every penny. Stunning work.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-female-florist-medium-shot_23-2148463258.jpg",
|
||||
},
|
||||
{ id: "1", name: "Alice M.", handle: "@alice", testimonial: "The best flower shop in town!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-young-beautiful-smiling-woman-looking-trendy-girl-casual-summer-hoodie-skirt-clothes_158538-1428.jpg" },
|
||||
{ id: "2", name: "Bob D.", handle: "@bob", testimonial: "My wife absolutely loved the roses.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-cheerful-smiling-man-looking-happy-express-enthusiastic-optimistic-emotions-seei_1258-113416.jpg" },
|
||||
{ id: "3", name: "Carla F.", handle: "@carla", testimonial: "Amazing service and beautiful arrangements.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-happy-man-showing-approval_23-2148230800.jpg" },
|
||||
{ id: "4", name: "David G.", handle: "@david", testimonial: "Fast delivery and very fresh flowers.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-satisfied-happy-young-man-glasses-working-cafe-sitting-coworking-space-with-laptop-showing-thumbs-up-like-approve-smth-good-chatting-giving-online-lessons_1258-314620.jpg" },
|
||||
{ id: "5", name: "Eva P.", handle: "@eva", testimonial: "Worth every penny. Stunning work.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-female-florist-medium-shot_23-2148463258.jpg" },
|
||||
]}
|
||||
showRating={true}
|
||||
title="Customer Stories"
|
||||
@@ -319,16 +152,8 @@ export default function LandingPage() {
|
||||
title="Get in Touch"
|
||||
description="Have special requests or event needs? We'd love to hear from you."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
},
|
||||
{ name: "name", type: "text", placeholder: "Your Name" },
|
||||
{ name: "email", type: "email", placeholder: "Your Email" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/bunch-fresh-flowers-glass-desk_23-2147929233.jpg"
|
||||
/>
|
||||
@@ -337,30 +162,8 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Shop",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "Pricing",
|
||||
href: "#pricing",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ items: [{ label: "Shop", href: "#products" }, { label: "Pricing", href: "#pricing" }] },
|
||||
{ items: [{ label: "Contact", href: "#contact" }, { label: "About", href: "#about" }] },
|
||||
]}
|
||||
logoText="John's Famous Flowers"
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user