bender/3c9dcc85-606c-482a-8f75-bb88496e5432
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

merge into: bender:version_2
Branches Tags
bender:main bender:version_4 bender:version_3 bender:version_2 bender:version_1
...
pull from: bender:version_3
Branches Tags
bender:main bender:version_4 bender:version_3 bender:version_2 bender:version_1

14 Commits
version_2 ... version_3

Author SHA1 Message Date
bender
9fb12e6a3e Update src/app/order/page.tsx 2026-04-15 16:53:48 +00:00
bender
d6921a8d20 Update src/app/gallery/page.tsx 2026-04-15 16:53:48 +00:00
bender
13dc36b3fe Update src/app/order/page.tsx 2026-04-15 16:53:24 +00:00
bender
ccf954c014 Update src/app/menu/page.tsx 2026-04-15 16:53:24 +00:00
bender
78eddb7cb9 Update src/app/gallery/page.tsx 2026-04-15 16:53:23 +00:00
bender
b6b399263c Update src/app/contact/page.tsx 2026-04-15 16:53:23 +00:00
bender
f3a0e7957d Update src/app/about/page.tsx 2026-04-15 16:53:22 +00:00
bender
e0cce9ea72 Update src/app/styles/variables.css 2026-04-15 16:52:44 +00:00
bender
7559df2749 Update src/app/order/page.tsx 2026-04-15 16:52:44 +00:00
bender
7c185a4982 Update src/app/menu/page.tsx 2026-04-15 16:52:43 +00:00
bender
b3ef3ae3e3 Update src/app/gallery/page.tsx 2026-04-15 16:52:43 +00:00
bender
7c78bbda91 Update src/app/contact/page.tsx 2026-04-15 16:52:42 +00:00
bender
eed3adf4ec Update src/app/about/page.tsx 2026-04-15 16:52:42 +00:00
bender
16f349e41b Merge version_2 into main 
Merge version_2 into main
 2026-04-15 16:51:38 +00:00
6 changed files with 267 additions and 456 deletions
Expand all files Collapse all files

115
src/app/about/page.tsx
View File

@@ -2,82 +2,59 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react"; import ReactLenis from "lenis/react";
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen'; import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import SplitAbout from '@/components/sections/about/SplitAbout'; import SplitAbout from '@/components/sections/about/SplitAbout';
import { User, Users, UserCheck, UserCog } from "lucide-react";
export default function AboutPage() { export default function AboutPage() {
return ( return (
<ThemeProvider <ThemeProvider
defaultButtonVariant="text-stagger" defaultButtonVariant="text-stagger"
defaultTextAnimation="reveal-blur" defaultTextAnimation="entrance-slide"
borderRadius="rounded" background="circleGradient"
contentWidth="smallMedium" cardStyle="glass-elevated"
sizing="mediumLargeSizeMediumTitles" primaryButtonStyle="gradient"
background="grid" secondaryButtonStyle="glass"
cardStyle="glass-elevated" headingFontWeight="normal"
primaryButtonStyle="shadow" borderRadius="rounded"
secondaryButtonStyle="solid" contentWidth="smallMedium"
headingFontWeight="bold" sizing="mediumLargeSizeMediumTitles"
> >
<ReactLenis root> <ReactLenis root>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleFullscreen <NavbarStyleFullscreen
navItems={[ navItems={[
{ name: "Home", id: "/" }, { name: "Home", id: "/" },
{ name: "Menu", id: "/menu" }, { name: "About", id: "/about" },
{ name: "About", id: "/about" }, { name: "Gallery", id: "/gallery" },
{ name: "Gallery", id: "/gallery" }, { name: "Contact", id: "/contact" },
{ name: "Contact", id: "/contact" }, ]}
{ name: "Order Online", id: "/order" }, brandName="Lolly’s Food Joint"
]} />
brandName="Lolly’s Food Joint" </div>
/> <SplitAbout
</div> title="About Lolly’s"
description="We started with a simple dream: to serve the best street food in town. Every ingredient we use is carefully selected to ensure you have an unforgettable dining experience."
<div id="about" data-section="about"> bulletPoints={[
<SplitAbout { title: "Fresh Ingredients", description: "Locally sourced daily." },
textboxLayout="default" { title: "Handcrafted", description: "Made with care by chefs." },
useInvertedBackground={false} { title: "Quality", description: "High standards every time." },
title="Our Origins" ]}
description="Founded by food lovers." imageSrc="http://img.b2bpic.net/free-photo/man-preparing-salad-with-fresh-vegetables-wooden-table-cooking-tasty-healthy-food-black-background-vegetarian-food-healthy-cooking-concept_639032-421.jpg"
imageSrc="http://img.b2bpic.net/free-photo/rustic-chandelier-made-bulbs-ropes-dining-table-vintage-kitchen_181624-9173.jpg" textboxLayout="split"
mediaAnimation="slide-up" useInvertedBackground={false}
bulletPoints={[ />
{ title: "Heritage", description: "Traditional recipes." }, <div id="footer" data-section="footer">
{ title: "Innovation", description: "Modern twists." }, <FooterSimple
]} columns={[
/> { title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Gallery", href: "/gallery" }] },
</div> { title: "Order", items: [{ label: "Contact Us", href: "/contact" }] },
]}
<div id="feature" data-section="feature"> bottomLeftText="© 2024 Lolly's Food Joint"
<FeatureCardTwentySix bottomRightText="All rights reserved."
textboxLayout="default" />
useInvertedBackground={false} </div>
title="Our Team"
description="The people behind the flavor."
features={[
{ title: "Expert Chefs", description: "Culinary mastery.", buttonIcon: User, imageSrc: "http://img.b2bpic.net/free-photo/delicious-realistic-burger_23-2150902326.jpg?_wi=2", imageAlt: "Delicious realistic burger" },
{ title: "Fast Servers", description: "Friendly service.", buttonIcon: Users, imageSrc: "http://img.b2bpic.net/free-photo/hamburger-chips_23-2147695734.jpg?_wi=4", imageAlt: "Delicious realistic burger" },
{ title: "Quality Staff", description: "Training daily.", buttonIcon: UserCheck, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-eating-burger-street-cafe-close-up_169016-43231.jpg?_wi=4", imageAlt: "Delicious realistic burger" },
{ title: "Manager", description: "Service excellence.", buttonIcon: UserCog, imageSrc: "http://img.b2bpic.net/free-photo/attractive-young-woman-hands-holds-two-burgers-blurred-background_169016-43235.jpg?_wi=4", imageAlt: "Delicious realistic burger" },
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Menu", href: "/menu" }] },
{ title: "Order", items: [{ label: "Order Online", href: "/order" }, { label: "Contact Us", href: "/contact" }] },
]}
bottomLeftText="© 2024 Lolly's Food Joint"
bottomRightText="All rights reserved."
/>
</div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );
} }

110
src/app/contact/page.tsx
View File

@@ -2,79 +2,55 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react"; import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen'; import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import { MapPin } from "lucide-react"; import FooterSimple from '@/components/sections/footer/FooterSimple';
import ContactSplit from '@/components/sections/contact/ContactSplit';
export default function ContactPage() { export default function ContactPage() {
return ( return (
<ThemeProvider <ThemeProvider
defaultButtonVariant="text-stagger" defaultButtonVariant="text-stagger"
defaultTextAnimation="reveal-blur" defaultTextAnimation="entrance-slide"
borderRadius="rounded" background="circleGradient"
contentWidth="smallMedium" cardStyle="glass-elevated"
sizing="mediumLargeSizeMediumTitles" primaryButtonStyle="gradient"
background="grid" secondaryButtonStyle="glass"
cardStyle="glass-elevated" headingFontWeight="normal"
primaryButtonStyle="shadow" borderRadius="rounded"
secondaryButtonStyle="solid" contentWidth="smallMedium"
headingFontWeight="bold" sizing="mediumLargeSizeMediumTitles"
> >
<ReactLenis root> <ReactLenis root>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleFullscreen <NavbarStyleFullscreen
navItems={[ navItems={[
{ name: "Home", id: "/" }, { name: "Home", id: "/" },
{ name: "Menu", id: "/menu" }, { name: "About", id: "/about" },
{ name: "About", id: "/about" }, { name: "Gallery", id: "/gallery" },
{ name: "Gallery", id: "/gallery" }, { name: "Contact", id: "/contact" },
{ name: "Contact", id: "/contact" }, ]}
{ name: "Order Online", id: "/order" }, brandName="Lolly’s Food Joint"
]} />
brandName="Lolly’s Food Joint" </div>
/> <ContactSplit
</div> tag="Contact"
title="Contact Us"
<div id="contact" data-section="contact"> description="Have questions or want to host an event? Get in touch with us today!"
<ContactSplit background={{ variant: "sparkles-gradient" }}
useInvertedBackground={false} useInvertedBackground={false}
background={{ variant: "plain" }} imageSrc="http://img.b2bpic.net/free-photo/cinematic-film-location-decor_23-2151919025.jpg"
tag="Get in touch" />
title="Contact Us" <div id="footer" data-section="footer">
description="Send us a message." <FooterSimple
imageSrc="http://img.b2bpic.net/free-photo/blur-coffee-shop_1203-8643.jpg" columns={[
mediaAnimation="slide-up" { title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Gallery", href: "/gallery" }] },
/> { title: "Order", items: [{ label: "Contact Us", href: "/contact" }] },
</div> ]}
bottomLeftText="© 2024 Lolly's Food Joint"
<div id="feature" data-section="feature"> bottomRightText="All rights reserved."
<FeatureCardTwentySix />
textboxLayout="default" </div>
useInvertedBackground={false}
title="Locations"
description="Where to find us."
features={[
{ title: "Main Street", description: "123 Main St.", buttonIcon: MapPin, imageSrc: "http://img.b2bpic.net/free-photo/delicious-realistic-burger_23-2150902326.jpg?_wi=3", imageAlt: "Delicious realistic burger" },
{ title: "Park Ave", description: "456 Park Ave.", buttonIcon: MapPin, imageSrc: "http://img.b2bpic.net/free-photo/hamburger-chips_23-2147695734.jpg?_wi=5", imageAlt: "Delicious realistic burger" },
{ title: "City Mall", description: "789 City Mall.", buttonIcon: MapPin, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-eating-burger-street-cafe-close-up_169016-43231.jpg?_wi=5", imageAlt: "Delicious realistic burger" },
{ title: "East Side", description: "321 East St.", buttonIcon: MapPin, imageSrc: "http://img.b2bpic.net/free-photo/attractive-young-woman-hands-holds-two-burgers-blurred-background_169016-43235.jpg?_wi=5", imageAlt: "Delicious realistic burger" },
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Menu", href: "/menu" }] },
{ title: "Order", items: [{ label: "Order Online", href: "/order" }, { label: "Contact Us", href: "/contact" }] },
]}
bottomLeftText="© 2024 Lolly's Food Joint"
bottomRightText="All rights reserved."
/>
</div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );
} }

182
src/app/gallery/page.tsx
View File

@@ -2,145 +2,61 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react"; import ReactLenis from "lenis/react";
import FooterSimple from '@/components/sections/footer/FooterSimple';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen'; import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo'; import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import SplitAbout from '@/components/sections/about/SplitAbout';
export default function LandingPage() { export default function GalleryPage() {
return ( return (
<ThemeProvider <ThemeProvider
defaultButtonVariant="text-stagger" defaultButtonVariant="text-stagger"
defaultTextAnimation="reveal-blur" defaultTextAnimation="entrance-slide"
borderRadius="rounded" background="circleGradient"
contentWidth="smallMedium" cardStyle="glass-elevated"
sizing="mediumLargeSizeMediumTitles" primaryButtonStyle="gradient"
background="grid" secondaryButtonStyle="glass"
cardStyle="glass-elevated" headingFontWeight="normal"
primaryButtonStyle="shadow" borderRadius="rounded"
secondaryButtonStyle="solid" contentWidth="smallMedium"
headingFontWeight="bold" sizing="mediumLargeSizeMediumTitles"
> >
<ReactLenis root> <ReactLenis root>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleFullscreen <NavbarStyleFullscreen
navItems={[ navItems={[
{ { name: "Home", id: "/" },
name: "Home", { name: "About", id: "/about" },
id: "/", { name: "Gallery", id: "/gallery" },
}, { name: "Contact", id: "/contact" },
{ ]}
name: "Menu", brandName="Lolly’s Food Joint"
id: "/menu", />
}, </div>
{ <ProductCardTwo
name: "About", title="Our Gallery"
id: "/about", description="A collection of our favorite dishes and moments at the restaurant."
}, gridVariant="four-items-2x2-equal-grid"
{ animationType="slide-up"
name: "Gallery", textboxLayout="default"
id: "/gallery", useInvertedBackground={false}
}, products={[
{ { id: "g1", brand: "Food", name: "Signature Burger", price: "", rating: 5, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/home-made-tasty-burgers_628469-332.jpg?_wi=1" },
name: "Contact", { id: "g2", brand: "Drinks", name: "Fresh Shakes", price: "", rating: 5, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/cacao-milkshake-topped-with-colourful-sprinkles-ice-cream-oreo_140725-8264.jpg?_wi=1" },
id: "/contact", { id: "g3", brand: "Food", name: "Fresh Wraps", price: "", rating: 5, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/fast-fashion-concept-with-materials-textiles-disguised-as-sushi-rolls_23-2150771195.jpg?_wi=1" },
}, { id: "g4", brand: "Food", name: "Side Bites", price: "", rating: 5, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/delicious-creamy-melted-cheese_23-2149332823.jpg?_wi=1" },
{ ]}
name: "Order Online", />
id: "/order", <div id="footer" data-section="footer">
}, <FooterSimple
]} columns={[
brandName="Lolly’s Food Joint" { title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Gallery", href: "/gallery" }] },
/> { title: "Order", items: [{ label: "Contact Us", href: "/contact" }] },
</div> ]}
bottomLeftText="© 2024 Lolly's Food Joint"
<div id="product" data-section="product"> bottomRightText="All rights reserved."
<ProductCardTwo />
animationType="slide-up" </div>
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
title="Food Gallery"
description="Take a look inside."
products={[
{
id: "g1",
brand: "Gallery",
name: "Kitchen Vibes",
price: "$0",
rating: 5,
reviewCount: "0",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-cooking-pizza_23-2150405878.jpg",
},
{
id: "g2",
brand: "Gallery",
name: "Dining Room",
price: "$0",
rating: 5,
reviewCount: "0",
imageSrc: "http://img.b2bpic.net/free-photo/woman-arranging-dishware-table-restaurant_23-2147936226.jpg",
},
]}
/>
</div>
<div id="about" data-section="about">
<SplitAbout
textboxLayout="default"
useInvertedBackground={false}
title="Freshness Captured"
description="See the process."
imageSrc="http://img.b2bpic.net/free-photo/man-s-hands-cutting-ripe-pepper-into-slices-table-husband-kitchen-preparing-salad-black-background_639032-415.jpg"
mediaAnimation="slide-up"
bulletPoints={[
{
title: "Local Produce",
description: "Farm to plate.",
},
{
title: "Fresh Daily",
description: "Never frozen.",
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Menu",
href: "/menu",
},
],
},
{
title: "Order",
items: [
{
label: "Order Online",
href: "/order",
},
{
label: "Contact Us",
href: "/contact",
},
],
},
]}
bottomLeftText="© 2024 Lolly's Food Joint"
bottomRightText="All rights reserved."
/>
</div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );
} }

139
src/app/menu/page.tsx
View File

@@ -2,82 +2,87 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react"; import ReactLenis from "lenis/react";
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen'; import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo'; import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Sprout, WheatOff, ChefHat, Scale } from "lucide-react"; import { useState } from "react";
const categories = [
{ id: "burgers", name: "Burgers" },
{ id: "street-food", name: "Street Food" },
{ id: "wraps", name: "Wraps" },
{ id: "fries", name: "Fries & Sides" },
{ id: "drinks", name: "Drinks" },
{ id: "milkshakes", name: "Milkshakes" },
];
export default function MenuPage() { export default function MenuPage() {
const [activeCategory, setActiveCategory] = useState("burgers");
return ( return (
<ThemeProvider <ThemeProvider
defaultButtonVariant="text-stagger" defaultButtonVariant="text-stagger"
defaultTextAnimation="reveal-blur" defaultTextAnimation="entrance-slide"
borderRadius="rounded" background="circleGradient"
contentWidth="smallMedium" cardStyle="glass-elevated"
sizing="mediumLargeSizeMediumTitles" primaryButtonStyle="gradient"
background="grid" secondaryButtonStyle="glass"
cardStyle="glass-elevated" headingFontWeight="normal"
primaryButtonStyle="shadow" borderRadius="rounded"
secondaryButtonStyle="solid" contentWidth="smallMedium"
headingFontWeight="bold" sizing="mediumLargeSizeMediumTitles"
> >
<ReactLenis root> <ReactLenis root>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleFullscreen <NavbarStyleFullscreen
navItems={[ navItems={[
{ name: "Home", id: "/" }, { name: "Home", id: "/" },
{ name: "Menu", id: "/menu" }, { name: "Menu", id: "/menu" },
{ name: "About", id: "/about" }, { name: "About", id: "/about" },
{ name: "Gallery", id: "/gallery" }, { name: "Gallery", id: "/gallery" },
{ name: "Contact", id: "/contact" }, { name: "Contact", id: "/contact" },
{ name: "Order Online", id: "/order" }, { name: "Order Online", id: "/order" },
]} ]}
brandName="Lolly’s Food Joint" brandName="Lolly’s Food Joint"
/> />
</div> </div>
<div id="product" data-section="product"> <main className="pt-32 pb-20 px-6 max-w-4xl mx-auto">
<ProductCardTwo <h1 className="text-4xl md:text-5xl font-bold mb-10 text-center">Our Menu</h1>
animationType="slide-up"
textboxLayout="default" <div className="flex flex-wrap gap-2 justify-center mb-12">
gridVariant="uniform-all-items-equal" {categories.map((cat) => (
useInvertedBackground={false} <button
title="Full Menu" key={cat.id}
description="See our complete list of offerings." onClick={() => setActiveCategory(cat.id)}
products={[ className={`px-6 py-2 rounded-full transition ${activeCategory === cat.id ? "bg-primary text-white" : "bg-card hover:bg-muted"}`}
{ id: "m1", brand: "Burger", name: "BBQ Burger", price: "$13.99", rating: 5, reviewCount: "50", imageSrc: "http://img.b2bpic.net/free-photo/side-view-cheeseburger-grilled-beef-patty-with-cheese-lettuce-burger-buns_141793-4806.jpg" }, >
{ id: "m2", brand: "Sides", name: "Onion Rings", price: "$4.99", rating: 4, reviewCount: "30", imageSrc: "http://img.b2bpic.net/free-photo/fried-meat-with-potatoes-served-with-onions-tomatoes-greens_141793-1068.jpg" }, {cat.name}
]} </button>
/> ))}
</div> </div>
<div id="feature" data-section="feature"> <div className="grid gap-6 md:grid-cols-2">
<FeatureCardTwentySix {[1, 2, 3, 4, 5, 6].map((item) => (
textboxLayout="default" <div key={item} className="p-6 rounded-xl border border-border bg-card shadow-sm">
useInvertedBackground={false} <h3 className="text-xl font-bold">Signature Item {item}</h3>
title="Dietary Options" <p className="text-muted-foreground mt-2">Delicious description of our amazing {categories.find(c => c.id === activeCategory)?.name || "dish"}.</p>
description="We cater to all tastes." <p className="font-bold mt-4">$9.99</p>
features={[ </div>
{ title: "Vegan", description: "Plant-based goodness.", buttonIcon: Sprout, imageSrc: "http://img.b2bpic.net/free-photo/delicious-realistic-burger_23-2150902326.jpg?_wi=1", imageAlt: "Delicious realistic burger" }, ))}
{ title: "Gluten Free", description: "Delicious choices.", buttonIcon: WheatOff, imageSrc: "http://img.b2bpic.net/free-photo/hamburger-chips_23-2147695734.jpg?_wi=3", imageAlt: "Delicious realistic burger" }, </div>
{ title: "Halal", description: "Authentic quality.", buttonIcon: ChefHat, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-eating-burger-street-cafe-close-up_169016-43231.jpg?_wi=3", imageAlt: "Delicious realistic burger" }, </main>
{ title: "Low Calorie", description: "Healthy alternatives.", buttonIcon: Scale, imageSrc: "http://img.b2bpic.net/free-photo/attractive-young-woman-hands-holds-two-burgers-blurred-background_169016-43235.jpg?_wi=3", imageAlt: "Delicious realistic burger" },
]}
/>
</div>
<div id="footer" data-section="footer"> <div id="footer" data-section="footer">
<FooterSimple <FooterSimple
columns={[ columns={[
{ title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Menu", href: "/menu" }] }, { title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Menu", href: "/menu" }] },
{ title: "Order", items: [{ label: "Order Online", href: "/order" }, { label: "Contact Us", href: "/contact" }] }, { title: "Order", items: [{ label: "Order Online", href: "/order" }, { label: "Contact Us", href: "/contact" }] },
]} ]}
bottomLeftText="© 2024 Lolly's Food Joint" bottomLeftText="© 2024 Lolly's Food Joint"
bottomRightText="All rights reserved." bottomRightText="All rights reserved."
/> />
</div> </div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );
} }

165
src/app/order/page.tsx
View File

@@ -2,12 +2,12 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react"; import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen'; import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo'; import ProductCardThree from '@/components/sections/product/ProductCardThree';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { ShoppingCart } from "lucide-react";
export default function LandingPage() { export default function OrderPage() {
return ( return (
<ThemeProvider <ThemeProvider
defaultButtonVariant="text-stagger" defaultButtonVariant="text-stagger"
@@ -22,118 +22,55 @@ export default function LandingPage() {
headingFontWeight="bold" headingFontWeight="bold"
> >
<ReactLenis root> <ReactLenis root>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleFullscreen <NavbarStyleFullscreen
navItems={[ navItems={[
{ { name: "Home", id: "/" },
name: "Home", { name: "Menu", id: "/menu" },
id: "/", { name: "About", id: "/about" },
}, { name: "Gallery", id: "/gallery" },
{ { name: "Contact", id: "/contact" },
name: "Menu", { name: "Order Online", id: "/order" },
id: "/menu", ]}
}, brandName="Lolly’s Food Joint"
{ />
name: "About", </div>
id: "/about",
},
{
name: "Gallery",
id: "/gallery",
},
{
name: "Contact",
id: "/contact",
},
{
name: "Order Online",
id: "/order",
},
]}
brandName="Lolly’s Food Joint"
/>
</div>
<div id="product" data-section="product"> <div id="order-section" data-section="order-section">
<ProductCardTwo <ProductCardThree
animationType="slide-up" gridVariant="four-items-2x2-equal-grid"
textboxLayout="default" animationType="slide-up"
gridVariant="uniform-all-items-equal" title="Order Online"
useInvertedBackground={false} description="Select your favourites and order directly via WhatsApp."
title="Order Now" products={[
description="Select your favourites." { id: "p1", name: "Lolly's Classic Burger", price: "$12.99", imageSrc: "http://img.b2bpic.net/free-photo/home-made-tasty-burgers_628469-332.jpg?_wi=2", priceButtonProps: { onClick: () => window.open('https://wa.me/1234567890?text=I%20would%20like%20to%20order%20the%20Lolly%27s%20Classic%20Burger') } },
products={[ { id: "p2", name: "Crispy Fries & Sauce", price: "$5.99", imageSrc: "http://img.b2bpic.net/free-photo/delicious-creamy-melted-cheese_23-2149332823.jpg?_wi=2", priceButtonProps: { onClick: () => window.open('https://wa.me/1234567890?text=I%20would%20like%20to%20order%20the%20Crispy%20Fries%20%26%20Sauce') } },
{ { id: "p3", name: "Signature Spicy Wrap", price: "$9.49", imageSrc: "http://img.b2bpic.net/free-photo/fast-fashion-concept-with-materials-textiles-disguised-as-sushi-rolls_23-2150771195.jpg?_wi=2", priceButtonProps: { onClick: () => window.open('https://wa.me/1234567890?text=I%20would%20like%20to%20order%20the%20Signature%20Spicy%20Wrap') } },
id: "o1", { id: "p4", name: "Creamy Milkshake", price: "$6.99", imageSrc: "http://img.b2bpic.net/free-photo/cacao-milkshake-topped-with-colourful-sprinkles-ice-cream-oreo_140725-8264.jpg?_wi=2", priceButtonProps: { onClick: () => window.open('https://wa.me/1234567890?text=I%20would%20like%20to%20order%20the%20Creamy%20Milkshake') } },
brand: "Burger", ]}
name: "Spicy Chicken Burger", textboxLayout="default"
price: "$11.99", useInvertedBackground={false}
rating: 5, />
reviewCount: "60", </div>
imageSrc: "http://img.b2bpic.net/free-photo/side-view-beef-fitburger-black-bun-with-vegetable-salad_141793-4767.jpg",
},
{
id: "o2",
brand: "Drinks",
name: "Chocolate Shake",
price: "$5.99",
rating: 5,
reviewCount: "40",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-milkshake-wooden-table_23-2148296035.jpg",
},
]}
/>
</div>
<div id="contact" data-section="contact"> <div id="footer" data-section="footer">
<ContactSplit <FooterSimple
useInvertedBackground={false} columns={[
background={{ { title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Menu", href: "/menu" }] },
variant: "plain", { title: "Order", items: [{ label: "Order Online", href: "/order" }, { label: "Contact Us", href: "/contact" }] },
}} ]}
tag="Order Support" bottomLeftText="© 2024 Lolly's Food Joint"
title="Need Help Ordering?" bottomRightText="All rights reserved."
description="We are here to assist." />
imageSrc="http://img.b2bpic.net/free-photo/bar-cafeteria-family-restaurant-interior-shooting_114579-1119.jpg" </div>
mediaAnimation="slide-up"
/> <div className="fixed bottom-6 right-6 z-50">
</div> <button onClick={() => window.open('https://wa.me/1234567890')} className="flex items-center gap-2 bg-primary text-white px-6 py-3 rounded-full shadow-lg hover:scale-105 transition-transform">
<ShoppingCart size={20} />
<div id="footer" data-section="footer"> Order Now on WhatsApp
<FooterSimple </button>
columns={[ </div>
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Menu",
href: "/menu",
},
],
},
{
title: "Order",
items: [
{
label: "Order Online",
href: "/order",
},
{
label: "Contact Us",
href: "/contact",
},
],
},
]}
bottomLeftText="© 2024 Lolly's Food Joint"
bottomRightText="All rights reserved."
/>
</div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );
} }

12
src/app/styles/variables.css
View File

@@ -10,15 +10,15 @@
--accent: #ffffff; --accent: #ffffff;
--background-accent: #ffffff; */ --background-accent: #ffffff; */
--background: #FFF6E9; --background: #FFF8E1;
--card: #FFFFFF; --card: #FFFFFF;
--foreground: #1C1C1C; --foreground: #1A1A1A;
--primary-cta: #C62828; --primary-cta: #B71C1C;
--primary-cta-text: #FFFFFF; --primary-cta-text: #FFFFFF;
--secondary-cta: #F5A623; --secondary-cta: #FFD700;
--secondary-cta-text: #1C1C1C; --secondary-cta-text: #1C1C1C;
--accent: #C62828; --accent: #B71C1C;
--background-accent: #FFF6E9; --background-accent: #FFF8E1;
/* text sizing - set by ThemeProvider */ /* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem); /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);