281 lines
14 KiB
TypeScript
281 lines
14 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import FeatureBento from '@/components/sections/feature/FeatureBento';
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
import HeroLogo from '@/components/sections/hero/HeroLogo';
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
import { Sparkles, Star } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-magnetic"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="compact"
|
|
sizing="medium"
|
|
background="circleGradient"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "#hero"},
|
|
{
|
|
name: "About", id: "#about"},
|
|
{
|
|
name: "Products", id: "#products"},
|
|
{
|
|
name: "Pricing", id: "#pricing"},
|
|
{
|
|
name: "Contact", id: "#contact"},
|
|
]}
|
|
brandName="Lebanese Quirks"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogo
|
|
logoText="Lebanese Quirks"
|
|
description="Your daily dose of funny 3D printed gadgets and customized treasures, straight from the heart of Lebanon. Get ready to laugh and be amazed!"
|
|
buttons={[
|
|
{
|
|
text: "Shop Now", href: "#products"},
|
|
{
|
|
text: "Customize Yours", href: "#contact"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/different-colors-pasta-board-marble-background_114579-59560.jpg"
|
|
imageAlt="Funny 3D printed Lebanese-themed products"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
useInvertedBackground={false}
|
|
title="Bringing Lebanese Charm to Your Everyday!"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureBento
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Concept to Reality", description: "Share your hilarious idea, and we'll sketch out the blueprint.", bentoComponent: "media-stack", items: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-with-magnifying-glass_23-2148577690.jpg", imageAlt: "Sketch of a 3D printed concept"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/collection-decorations-halloween_23-2148635848.jpg", imageAlt: "CAD model of the product"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/designer-using-3d-printer_23-2150942080.jpg", imageAlt: "Sketch of a 3D printed concept"},
|
|
]
|
|
},
|
|
{
|
|
title: "Precision Printing", description: "Our machines work their magic, layer by layer, bringing your vision to life.", bentoComponent: "media-stack", items: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/3d-printer-with-word-3d-printed-it_188544-38191.jpg", imageAlt: "3D printer in action"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/balloon-twist-shaped-like-plane_23-2151625288.jpg", imageAlt: "3D print in progress"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/still-life-small-decorative-objects-with-vivid-colors_23-2149732895.jpg", imageAlt: "3D printer in action"},
|
|
]
|
|
},
|
|
{
|
|
title: "Customized with Care", description: "Hand-finished and perfected, ensuring every quirk is just right for you.", bentoComponent: "media-stack", items: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/christmas-valentine-s-day-new-year-portrait-happy-brunette-girl-wearing-warm-sweater-holding-gift-box-isolated-dark-textured-background_613910-18176.jpg", imageAlt: "Finished 3D printed product"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/pinecone-with-green-branch-tree-white-table_114579-75992.jpg", imageAlt: "Happy customer receiving product"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/papel-picado-party-decorations_23-2149399220.jpg", imageAlt: "Finished 3D printed product"},
|
|
]
|
|
},
|
|
]}
|
|
title="Your Imagination, Our 3D Magic!"
|
|
description="We don't just print; we bring your wildest Lebanese dreams to life. Want a mini 'Argileh' or a personalized 'Tarboosh'? You got it! Here's how we make it happen."
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "1", name: "Miniature Cedar Tree", price: "$15.00", imageSrc: "http://img.b2bpic.net/free-photo/pinecone-with-green-branch-tree-white-table_114579-75992.jpg", imageAlt: "3D Printed Miniature Cedar Tree"},
|
|
{
|
|
id: "2", name: "Lebanese Flag Coasters", price: "$25.00", imageSrc: "http://img.b2bpic.net/free-photo/composition-4-july-independence-day-usa_185193-111645.jpg", imageAlt: "3D Printed Lebanese Flag Coasters"},
|
|
{
|
|
id: "3", name: "Zaatar Shaker Holder", price: "$20.00", imageSrc: "http://img.b2bpic.net/free-photo/bowls-glass-with-milk_23-2147680292.jpg", imageAlt: "3D Printed Zaatar Shaker Holder"},
|
|
{
|
|
id: "4", name: "Fairuz Phone Stand", price: "$22.00", imageSrc: "http://img.b2bpic.net/free-photo/woman-portrait_1296-430.jpg", imageAlt: "3D Printed Fairuz Phone Stand"},
|
|
{
|
|
id: "5", name: "Shisha Air Freshener", price: "$18.00", imageSrc: "http://img.b2bpic.net/free-photo/arabic-shisha-with-metallic-equipments_114579-3730.jpg", imageAlt: "3D Printed Shisha Air Freshener"},
|
|
{
|
|
id: "6", name: "Baklava Keychain", price: "$10.00", imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-cream-cake-with-candies-cookies-fruits-grey-background-cake-cream-biscuit-sweet-cookie-dessert_140725-99218.jpg", imageAlt: "3D Printed Baklava Keychain"},
|
|
]}
|
|
title="Our Quirky Collection"
|
|
description="Discover our best-selling 3D printed treasures, guaranteed to spark joy and perhaps a little confusion (in a good way!). Perfect for gifts or just treating yourself to something truly unique."
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardEight
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
plans={[
|
|
{
|
|
id: "basic", badge: "Shu Fi", price: "$49", subtitle: "Small tweaks, big smiles!", buttons: [
|
|
{
|
|
text: "Start Laughing", href: "#contact"},
|
|
],
|
|
features: [
|
|
"Up to 2 minor customizations", "Standard 3D print material", "Email support", "Digital proof"],
|
|
},
|
|
{
|
|
id: "pro", badge: "Ya Khara", badgeIcon: Sparkles,
|
|
price: "$99", subtitle: "For those with a bigger funny bone!", buttons: [
|
|
{
|
|
text: "Get Quirky", href: "#contact"},
|
|
],
|
|
features: [
|
|
"Up to 5 moderate customizations", "Premium 3D print materials", "Priority email support", "2 revisions included"],
|
|
},
|
|
{
|
|
id: "ultimate", badge: "Wallah!", badgeIcon: Star,
|
|
price: "$199", subtitle: "Bring your wildest Lebanese dreams to life!", buttons: [
|
|
{
|
|
text: "Go All Out", href: "#contact"},
|
|
],
|
|
features: [
|
|
"Full custom design & consultation", "Exotic 3D print materials", "Dedicated phone support", "Unlimited revisions", "Hand-painted accents"],
|
|
},
|
|
]}
|
|
title="Customization Packages"
|
|
description="Want something truly one-of-a-kind? Our bespoke services cater to every imagination, from subtle tweaks to full-blown Lebanese masterpieces. Pick the package that best fits your funny bone!"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah J.", role: "Chief Laughter Officer", company: "Humor HQ", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-male-gardener-uniform-with-closed-eyes-holding-hat-isolated-purple_141793-87201.jpg", imageAlt: "Sarah J. photo"},
|
|
{
|
|
id: "2", name: "Ali K.", role: "Innovation Enthusiast", company: "Beirut Tech", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-female-pointing-red-gift-worker-uniform-looking-pleased-front-view_176474-34464.jpg", imageAlt: "Ali K. photo"},
|
|
{
|
|
id: "3", name: "Maria R.", role: "Joy Creator", company: "Smiles Inc.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-handsome-guy-wearing-hat-spreading-hands-isolated-green-wall_141793-91613.jpg", imageAlt: "Maria R. photo"},
|
|
{
|
|
id: "4", name: "Jad M.", role: "Quirk Collector", company: "Gadget Guild", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/3d-view-yellow-emoji_23-2150473719.jpg", imageAlt: "Jad M. photo"},
|
|
{
|
|
id: "5", name: "Maya S.", role: "Design Lover", company: "Creative Minds", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/front-view-two-happy-guys-with-santa-hats-showing-their-presents-beige-isolated-background_140725-50294.jpg", imageAlt: "Maya S. photo"},
|
|
]}
|
|
kpiItems={[
|
|
{
|
|
value: "1000+", label: "Happy Customers"},
|
|
{
|
|
value: "5-Star", label: "Laughter Guaranteed"},
|
|
{
|
|
value: "Nationwide", label: "Smiles Delivered"},
|
|
]}
|
|
title="What Our 'Zghayyar' Fans Say"
|
|
description="Our customers love our products so much, they almost can't believe they're not edible. Check out these hilarious reviews!"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "1", title: "Can I print a falafel sandwich?", content: "While we appreciate your culinary enthusiasm, our 3D printers prefer plastic over chickpeas! But we can print you a realistic-looking falafel keychain. Close enough, right?"},
|
|
{
|
|
id: "2", title: "Is it safe to put a 3D printed 'arak' bottle in the sun?", content: "Our products are made from durable materials, but like a good 'arak' drinker, they prefer the shade! Extreme heat might make them a bit... wobbly. Keep them cool, just like your spirits!"},
|
|
{
|
|
id: "3", title: "Do you offer 'Mama's approval' guarantees?", content: "We aim for 100% Mama-approved designs! While we can't guarantee a 'yalla get married' compliment, we're confident your Mama will find our products 'ktir helween' (very beautiful). If not, we'll try again!"},
|
|
{
|
|
id: "4", title: "Can I get a 3D print of my Teta's (grandma's) famous cookie recipe?", content: "We might not be able to print the actual recipe, but we can definitely 3D print a custom cookie cutter in the shape of her favorite 'kaak' or 'maamoul'! Now you can bake her legacy!"},
|
|
]}
|
|
sideTitle="Got Questions? We've Got Hilarious Answers!"
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
text="Ready for some Lebanese laughs? Get in Touch! Let's bring your funny 3D printed ideas to life. Yalla, what are you waiting for?"
|
|
buttons={[
|
|
{
|
|
text: "Send Us a Message", href: "mailto:hello@lebanesequirks.com"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
logoText="Lebanese Quirks"
|
|
columns={[
|
|
{
|
|
title: "Products", items: [
|
|
{
|
|
label: "Our Collection", href: "#products"},
|
|
{
|
|
label: "Custom Orders", href: "#pricing"},
|
|
],
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{
|
|
label: "About Us", href: "#about"},
|
|
{
|
|
label: "FAQs", href: "#faq"},
|
|
],
|
|
},
|
|
{
|
|
title: "Connect", items: [
|
|
{
|
|
label: "Contact", href: "#contact"},
|
|
{
|
|
label: "Instagram", href: "https://instagram.com/lebanesequirks"},
|
|
{
|
|
label: "Facebook", href: "https://facebook.com/lebanesequirks"},
|
|
],
|
|
},
|
|
]}
|
|
copyrightText="© 2024 Lebanese Quirks. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|