12 Commits

4 changed files with 178 additions and 46 deletions

59
src/app/contact/page.tsx Normal file
View File

@@ -0,0 +1,59 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
export default function ContactPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="mediumLarge"
sizing="largeSmallSizeLargeTitles"
background="aurora"
cardStyle="soft-shadow"
primaryButtonStyle="double-inset"
secondaryButtonStyle="layered"
headingFontWeight="light"
>
<div className="min-h-screen bg-background">
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="Bee Job"
navItems={[
{ name: "Home", id: "/" },
{ name: "Products", id: "/products" },
{ name: "Pricing", id: "/pricing" },
{ name: "Contact", id: "/contact" },
]}
button={{
text: "Order Now", href: "/products"
}}
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
tag="Get In Touch"
title="Ready to Order Your Flowers?"
description="Subscribe to our newsletter for exclusive deals, new arrivals, and floral care tips delivered right to your inbox."
useInvertedBackground="invertDefault"
imageSrc="https://img.b2bpic.net/free-photo/day-beauti-flowers-flower-white_1303-2012.jpg"
imageAlt="Gorgeous flower arrangement in a gift box"
mediaPosition="right"
inputPlaceholder="Enter your email address"
buttonText="Subscribe"
termsText="We respect your privacy. Unsubscribe anytime from our mailing list."
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal logoText="Bee Job" />
</div>
</div>
</ThemeProvider>
);
}

View File

@@ -1,4 +1,4 @@
"use client" "use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay'; import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
@@ -7,8 +7,7 @@ import ProductCardFour from '@/components/sections/product/ProductCardFour';
import AboutMetric from '@/components/sections/about/AboutMetric'; import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen'; import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix'; import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo'; import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal'; import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Sparkles, Leaf, Heart, Truck, Award } from 'lucide-react'; import { Sparkles, Leaf, Heart, Truck, Award } from 'lucide-react';
@@ -30,14 +29,13 @@ export default function LandingPage() {
<NavbarLayoutFloatingOverlay <NavbarLayoutFloatingOverlay
brandName="Bee Job" brandName="Bee Job"
navItems={[ navItems={[
{ name: "Home", id: "hero" }, { name: "Home", id: "/" },
{ name: "Products", id: "products" }, { name: "Products", id: "/products" },
{ name: "About", id: "about" }, { name: "Pricing", id: "/pricing" },
{ name: "Testimonials", id: "testimonials" }, { name: "Contact", id: "/contact" },
{ name: "Contact", id: "contact" },
]} ]}
button={{ button={{
text: "Order Now", href: "#products" text: "Order Now", href: "/products"
}} }}
/> />
</div> </div>
@@ -49,8 +47,8 @@ export default function LandingPage() {
tag="Premium Flowers" tag="Premium Flowers"
tagIcon={Sparkles} tagIcon={Sparkles}
buttons={[ buttons={[
{ text: "Shop Now", href: "#products" }, { text: "Shop Now", href: "/products" },
{ text: "Learn More", href: "#about" }, { text: "View Pricing", href: "/pricing" },
]} ]}
carouselItems={[ carouselItems={[
{ {
@@ -99,12 +97,11 @@ export default function LandingPage() {
}, },
]} ]}
gridVariant="uniform-all-items-equal" gridVariant="uniform-all-items-equal"
carouselMode="buttons"
animationType="slide-up" animationType="slide-up"
textboxLayout="default" textboxLayout="default"
useInvertedBackground="noInvert" useInvertedBackground="noInvert"
buttons={[ buttons={[
{ text: "View All Collections", href: "#products" }, { text: "View All Collections", href: "/products" },
]} ]}
/> />
</div> </div>
@@ -176,16 +173,15 @@ export default function LandingPage() {
</div> </div>
<div id="pricing" data-section="pricing"> <div id="pricing" data-section="pricing">
<PricingCardTwo <PricingCardThree
title="Flexible Plans for Every Occasion" title="Ready to Transform Your Occasions?"
description="Choose the perfect arrangement package for your special moment" description="Subscribe to our newsletter for exclusive deals, new arrivals, and floral care tips delivered right to your inbox."
tag="Pricing" tag="Pricing & Offers"
plans={[ plans={[
{ {
id: "1", badge: "Classic Arrangement", badgeIcon: Leaf, id: "1", badge: "Classic Arrangement", badgeIcon: Leaf,
price: "$49.99", subtitle: "Perfect for birthdays and celebrations", buttons: [ price: "$49.99", name: "Perfect for birthdays and celebrations", buttons: [
{ text: "Choose Plan" }, { text: "Choose Plan", href: "/products" },
{ text: "Customize" },
], ],
features: [ features: [
"6-8 stems of premium flowers", "Elegant vase included", "Standard delivery available", "Free greeting card" "6-8 stems of premium flowers", "Elegant vase included", "Standard delivery available", "Free greeting card"
@@ -193,9 +189,8 @@ export default function LandingPage() {
}, },
{ {
id: "2", badge: "Premium Bouquet", badgeIcon: Sparkles, id: "2", badge: "Premium Bouquet", badgeIcon: Sparkles,
price: "$84.99", subtitle: "Best for romantic occasions", buttons: [ price: "$84.99", name: "Best for romantic occasions", buttons: [
{ text: "Choose Plan" }, { text: "Choose Plan", href: "/products" },
{ text: "Customize" },
], ],
features: [ features: [
"12-15 stems of luxury flowers", "Premium decorative vase", "Same-day delivery included", "Personalized message card", "Complimentary ribbon wrap" "12-15 stems of luxury flowers", "Premium decorative vase", "Same-day delivery included", "Personalized message card", "Complimentary ribbon wrap"
@@ -203,9 +198,8 @@ export default function LandingPage() {
}, },
{ {
id: "3", badge: "Grand Celebration", badgeIcon: Heart, id: "3", badge: "Grand Celebration", badgeIcon: Heart,
price: "$149.99", subtitle: "For unforgettable moments", buttons: [ price: "$149.99", name: "For unforgettable moments", buttons: [
{ text: "Choose Plan" }, { text: "Choose Plan", href: "/products" },
{ text: "Customize" },
], ],
features: [ features: [
"20+ stems of exotic varieties", "Designer luxury arrangement", "Priority same-day delivery", "Bespoke consultation included", "Premium packaging", "Flower care guide provided" "20+ stems of exotic varieties", "Designer luxury arrangement", "Priority same-day delivery", "Bespoke consultation included", "Premium packaging", "Flower care guide provided"
@@ -215,22 +209,6 @@ export default function LandingPage() {
animationType="slide-up" animationType="slide-up"
textboxLayout="default" textboxLayout="default"
useInvertedBackground="noInvert" useInvertedBackground="noInvert"
carouselMode="buttons"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
tag="Get In Touch"
title="Ready to Order Your Flowers?"
description="Subscribe to our newsletter for exclusive deals, new arrivals, and floral care tips delivered right to your inbox."
useInvertedBackground="invertDefault"
imageSrc="https://img.b2bpic.net/free-photo/day-beauti-flowers-flower-white_1303-2012.jpg"
imageAlt="Gorgeous flower arrangement in a gift box"
mediaPosition="right"
inputPlaceholder="Enter your email address"
buttonText="Subscribe"
termsText="We respect your privacy. Unsubscribe anytime from our mailing list."
/> />
</div> </div>

97
src/app/pricing/page.tsx Normal file
View File

@@ -0,0 +1,97 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Sparkles, Leaf, Heart } from 'lucide-react';
export default function PricingPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="mediumLarge"
sizing="largeSmallSizeLargeTitles"
background="aurora"
cardStyle="soft-shadow"
primaryButtonStyle="double-inset"
secondaryButtonStyle="layered"
headingFontWeight="light"
>
<div className="min-h-screen bg-background">
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="Bee Job"
navItems={[
{ name: "Home", id: "/" },
{ name: "Products", id: "/products" },
{ name: "Pricing", id: "/pricing" },
{ name: "Contact", id: "/contact" },
]}
button={{
text: "Order Now", href: "/products"
}}
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardThree
title="Flexible Plans for Every Occasion"
description="Choose the perfect arrangement package for your special moment. All plans include free greeting card and careful delivery."
tag="Pricing"
plans={[
{
id: "1", badge: "Classic Arrangement", badgeIcon: Leaf,
price: "$49.99", name: "Perfect for birthdays and celebrations", buttons: [
{ text: "Choose Plan", href: "/products" },
{ text: "Customize", href: "/products" },
],
features: [
"6-8 stems of premium flowers", "Elegant vase included", "Standard delivery available", "Free greeting card"
],
},
{
id: "2", badge: "Premium Bouquet", badgeIcon: Sparkles,
price: "$84.99", name: "Best for romantic occasions", buttons: [
{ text: "Choose Plan", href: "/products" },
{ text: "Customize", href: "/products" },
],
features: [
"12-15 stems of luxury flowers", "Premium decorative vase", "Same-day delivery included", "Personalized message card", "Complimentary ribbon wrap"
],
},
{
id: "3", badge: "Grand Celebration", badgeIcon: Heart,
price: "$149.99", name: "For unforgettable moments", buttons: [
{ text: "Choose Plan", href: "/products" },
{ text: "Customize", href: "/products" },
],
features: [
"20+ stems of exotic varieties", "Designer luxury arrangement", "Priority same-day delivery", "Bespoke consultation included", "Premium packaging", "Flower care guide provided"
],
},
{
id: "4", price: "$199.99", name: "For corporate events and weddings", buttons: [
{ text: "Contact Us", href: "/contact" },
{ text: "Learn More", href: "/pricing" },
],
features: [
"30+ stems of premium selection", "Custom color schemes", "Multiple arrangement options", "Dedicated florist consultation", "Event planning support", "White glove delivery service", "Special occasion guarantee"
],
},
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground="noInvert"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal logoText="Bee Job" />
</div>
</div>
</ThemeProvider>
);
}

View File

@@ -66,9 +66,8 @@ export default function ProductsPage() {
navItems={[ navItems={[
{ name: "Home", id: "/" }, { name: "Home", id: "/" },
{ name: "Products", id: "/products" }, { name: "Products", id: "/products" },
{ name: "About", id: "about" }, { name: "Pricing", id: "/pricing" },
{ name: "Testimonials", id: "testimonials" }, { name: "Contact", id: "/contact" },
{ name: "Contact", id: "contact" },
]} ]}
button={{ button={{
text: "Order Now", href: "/products" text: "Order Now", href: "/products"
@@ -84,7 +83,6 @@ export default function ProductsPage() {
tagIcon={Leaf} tagIcon={Leaf}
products={allProducts} products={allProducts}
gridVariant="three-columns-all-equal-width" gridVariant="three-columns-all-equal-width"
carouselMode="buttons"
animationType="slide-up" animationType="slide-up"
textboxLayout="default" textboxLayout="default"
useInvertedBackground="noInvert" useInvertedBackground="noInvert"