Merge version_2 into main #2
240
src/app/page.tsx
240
src/app/page.tsx
@@ -4,15 +4,12 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import AboutMetric from '@/components/sections/about/AboutMetric';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
||||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import { Award, CheckCircle, Coffee, Flame, Heart, ShoppingCart, Sparkles, Star, Truck, Users } from "lucide-react";
|
||||
import { CircuitBoard, Code, Zap, Globe, Mail } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -29,167 +26,90 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Menu", id: "products" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Sharmz"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Technical Boards", id: "products" },
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Jood"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Authentic Shawarma, Freshly Crafted."
|
||||
description="Experience the boldest Middle Eastern flavors. Locally sourced, expertly spiced, and served with passion."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/flat-lay-composition-mexican-food-with-copyspace_23-2148140321.jpg"
|
||||
imageAlt="authentic shawarma wrap street food"
|
||||
buttons={[
|
||||
{ text: "View Menu", href: "#products" },
|
||||
{ text: "Book a Table", href: "#contact" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Precision Boards & Web Solutions"
|
||||
description="Specialized high-performance technical boards for mobile devices, and bespoke website development for your digital presence."
|
||||
buttons={[
|
||||
{ text: "View Boards", href: "#products" },
|
||||
{ text: "Contact for Web Services", href: "#contact" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Our Passion for Taste"
|
||||
metrics={[
|
||||
{ icon: Flame, label: "Years in Business", value: "10+" },
|
||||
{ icon: Award, label: "Recipes Perfected", value: "25" },
|
||||
{ icon: Users, label: "Happy Guests", value: "50k+" },
|
||||
{ icon: Flame, label: "Culinary Experts", value: "15" },
|
||||
{ icon: Star, label: "Daily Visitors", value: "300+" },
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureHoverPattern
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ icon: CircuitBoard, title: "Technical Hardware", description: "High-grade phone circuit boards and repair components." },
|
||||
{ icon: Code, title: "Web Development", description: "Modern, fast, and scalable websites tailored to your needs." },
|
||||
{ icon: Zap, title: "Performance Focused", description: "Optimized solutions for hardware and software projects." },
|
||||
]}
|
||||
title="What Jood Offers"
|
||||
description="Bridging the gap between technical hardware and digital excellence."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureHoverPattern
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ icon: Flame, title: "Authentic Recipes", description: "Generations of tradition in every bite." },
|
||||
{ icon: Truck, title: "Fast Delivery", description: "From our grill to your door, fast." },
|
||||
{ icon: Coffee, title: "Cozy Ambience", description: "A perfect spot for friends and family." },
|
||||
{ icon: Heart, title: "Fresh Ingredients", description: "Daily farm-to-table vegetable delivery." },
|
||||
{ icon: Sparkles, title: "Handmade Sauces", description: "Signature dips crafted in-house daily." },
|
||||
]}
|
||||
title="Why Sharmz?"
|
||||
description="The secret is in the spice blend."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "b1", name: "Mobile Logic Board - V1", price: "$49.99", imageSrc: "https://images.unsplash.com/photo-1597484661910-34507309995c?q=80&w=800" },
|
||||
{ id: "b2", name: "Device Interface Board", price: "$35.50", imageSrc: "https://images.unsplash.com/photo-1555664424-778a1e5e1b48?q=80&w=800" },
|
||||
{ id: "b3", name: "Advanced Power Module", price: "$59.99", imageSrc: "https://images.unsplash.com/photo-1518770660439-4636190af475?q=80&w=800" },
|
||||
]}
|
||||
title="Featured Components"
|
||||
description="Quality-checked technical boards for various mobile devices."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Classic Beef Wrap", price: "$9.99", imageSrc: "http://img.b2bpic.net/free-photo/iskender-doner-with-mixed-foods-melted-cheese-metallic-decorative-platter-top-view_114579-2854.jpg" },
|
||||
{ id: "p2", name: "Chicken Shawarma Roll", price: "$8.99", imageSrc: "http://img.b2bpic.net/free-photo/lavash-doner-with-chicken-tomatoes-lettuce_140725-7967.jpg" },
|
||||
{ id: "p3", name: "Large Platter", price: "$15.99", imageSrc: "http://img.b2bpic.net/free-photo/saj-made-from-vegetables-meat-charcoal_140725-3569.jpg" },
|
||||
{ id: "p4", name: "Falafel Delight", price: "$7.99", imageSrc: "http://img.b2bpic.net/free-photo/big-sandwich-hamburger-with-juicy-chicken-burger-cheese-tomato-red-onion-wooden-table_2829-19644.jpg" },
|
||||
{ id: "p5", name: "Hummus & Pita", price: "$5.99", imageSrc: "http://img.b2bpic.net/free-photo/chickpea-hummus-with-olive-oil-parsley-paprika-bowl-wooden-table_123827-35805.jpg" },
|
||||
{ id: "p6", name: "Garlic Sauce Side", price: "$1.50", imageSrc: "http://img.b2bpic.net/free-photo/delicious-meal-with-sambal-composition_23-2149076093.jpg" },
|
||||
]}
|
||||
title="Our Menu Favorites"
|
||||
description="Everything fresh, everything flavorful."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Get in Touch"
|
||||
title="Ready to discuss your project?"
|
||||
description="Whether you need specialized hardware or a high-end website, let's build something great together."
|
||||
onSubmit={(email) => console.log("Inquiry from:", email)}
|
||||
buttonText="Send Inquiry"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "m1", value: "1.2k", title: "Daily Orders", description: "Fresh meals daily", icon: ShoppingCart },
|
||||
{ id: "m2", value: "4.8", title: "Average Rating", description: "Loved by the community", icon: Star },
|
||||
{ id: "m3", value: "20", title: "Staff Members", description: "Dedicated to quality", icon: Users },
|
||||
{ id: "m4", value: "500", title: "Seats Available", description: "Cozy dining room", icon: Coffee },
|
||||
{ id: "m5", value: "100%", title: "Freshness", description: "Zero frozen meat", icon: CheckCircle },
|
||||
]}
|
||||
title="By the Numbers"
|
||||
description="Consistent quality you can count on."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo
|
||||
textboxLayout="default"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Mark S.", role: "Foodie", testimonial: "The best shawarma in town!", imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-asian-man-friends-reunion_23-2149244687.jpg" },
|
||||
{ id: "t2", name: "Elena R.", role: "Regular", testimonial: "I come here at least twice a week.", imageSrc: "http://img.b2bpic.net/free-photo/medium-woman-taking-food-photo_23-2149250048.jpg" },
|
||||
{ id: "t3", name: "James B.", role: "Visitor", testimonial: "Incredible spice balance.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-friends-eating-delicious-pizza_23-2150317018.jpg" },
|
||||
{ id: "t4", name: "Sarah P.", role: "Fan", testimonial: "Everything is fresh and fast.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-with-delicious-pizza_23-2150307057.jpg" },
|
||||
{ id: "t5", name: "Tom V.", role: "Student", testimonial: "Amazing prices for huge portions.", imageSrc: "http://img.b2bpic.net/free-photo/cute-elegant-calm-happy-woman-green-summer-dress-sits-with-coffee-cafe-enjoying-morning_343596-3669.jpg" },
|
||||
]}
|
||||
title="Community Love"
|
||||
description="What our guests are saying."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "f1", title: "Do you offer delivery?", content: "Yes, we partner with all major apps." },
|
||||
{ id: "f2", title: "Are there vegetarian options?", content: "Our falafel is fresh and 100% vegetarian." },
|
||||
{ id: "f3", title: "Can we book for groups?", content: "Yes, we handle small group bookings." },
|
||||
{ id: "f4", title: "Are you open on holidays?", content: "Yes, we operate regular hours on most holidays." },
|
||||
{ id: "f5", title: "Is parking available?", content: "Street parking is available directly in front." },
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Find answers quickly."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Visit Us"
|
||||
title="Hungry? Let's talk."
|
||||
description="Join our newsletter for weekly specials and secret menu drops."
|
||||
mediaAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/chef-preparing-food-kitchen-restaurant_1253-1014.jpg"
|
||||
imageAlt="professional restaurant kitchen preparation"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=oog3gp"
|
||||
logoText="Shawarma Sharmz"
|
||||
columns={[
|
||||
{ title: "Links", items: [
|
||||
{ label: "Menu", href: "#products" },
|
||||
{ label: "About", href: "#about" },
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
] },
|
||||
{ title: "Socials", items: [
|
||||
{ label: "Instagram", href: "#" },
|
||||
{ label: "Facebook", href: "#" },
|
||||
{ label: "TikTok", href: "#" },
|
||||
] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
logoText="Jood Tech & Web"
|
||||
columns={[
|
||||
{ title: "Navigation", items: [
|
||||
{ label: "Home", href: "#hero" },
|
||||
{ label: "Hardware", href: "#products" },
|
||||
{ label: "Web Services", href: "#features" },
|
||||
] },
|
||||
{ title: "Connect", items: [
|
||||
{ label: "Email", href: "mailto:hello@jood.tech" },
|
||||
{ label: "LinkedIn", href: "#" },
|
||||
] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user