Merge version_4 into main #5

Merged
bender merged 3 commits from version_4 into main 2026-05-18 14:14:34 +00:00
3 changed files with 103 additions and 46 deletions

56
src/app/cart/page.tsx Normal file
View File

@@ -0,0 +1,56 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import ProductCartItem from '@/components/ecommerce/cart/ProductCartItem';
export default function CartPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Cart", id: "/cart" },
];
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumLarge"
sizing="largeSizeMediumTitles"
background="floatingGradient"
cardStyle="glass-elevated"
primaryButtonStyle="flat"
secondaryButtonStyle="layered"
headingFontWeight="extrabold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={navItems}
brandName="Joli Café Bar"
/>
</div>
<div className="pt-32 pb-20 px-8 max-w-4xl mx-auto">
<h1 className="text-4xl font-bold mb-8">Your Cart</h1>
<div className="space-y-4">
<ProductCartItem
item={{ id: "p1", name: "Signature Roast", price: "$24", quantity: 1, imageSrc: "http://img.b2bpic.net/coffee-beans_23-2148782354.jpg" }}
/>
</div>
<div className="mt-8 pt-8 border-t">
<button className="bg-primary text-white px-8 py-3 rounded-full">Proceed to Checkout</button>
</div>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="Joli Café Bar"
columns={[{ items: [{ label: "Home", href: "/" }, { label: "Shop", href: "/shop" }] }]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -7,10 +7,10 @@ import FaqDouble from '@/components/sections/faq/FaqDouble';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import TextAbout from '@/components/sections/about/TextAbout';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
export default function LandingPage() {
return (
@@ -82,30 +82,35 @@ export default function LandingPage() {
</div>
<div id="metrics" data-section="metrics">
<MetricCardTwo
useInvertedBackground={false}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
title="Our Achievements"
description="Key milestones that define our excellence."
textboxLayout="split"
<MetricCardFourteen
title="Our Global Impact"
tag="Success Metrics"
metrics={[
{ id: "m1", value: "10+", description: "Years in Service" },
{ id: "m2", value: "5000+", description: "Satisfied Diners" },
{ id: "m3", value: "4.9", description: "Customer Rating" },
{ id: "m1", value: "15+", description: "Years of Culinary Excellence" },
{ id: "m2", value: "10,000+", description: "Happy Regular Customers" },
{ id: "m3", value: "500k", description: "Meals Served Annually" }
]}
metricsAnimation="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardFive
useInvertedBackground={false}
title="What People Say"
description="Hear from our valued guests."
<TestimonialCardThirteen
title="Voices of Joli Café"
description="Hear from our vibrant community of food lovers."
showRating={true}
textboxLayout="split"
animationType="slide-up"
useInvertedBackground={false}
testimonials={[
{
id: "t1", name: "Emily R.", date: "Oct 2024", title: "Incredible Experience", quote: "The ambiance at Joli Café is simply magical. Everything we ordered was perfection.", tag: "Guest", avatarSrc: "http://img.b2bpic.net/free-photo/woman-smiling-cafe_23-2148972344.jpg"
id: "t1", name: "Sarah Jenkins", handle: "@sarahj_foodie", testimonial: "An absolutely divine experience from start to finish. The service was as impeccable as the coffee.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-smiling-cafe_23-2148972344.jpg"
},
{
id: "t2", name: "Marcus Thorne", handle: "@mthorne_travels", testimonial: "My go-to spot whenever I'm in the city. Truly world-class flavors.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/man-drinking-coffee_23-2148972350.jpg"
}
]}
/>
@@ -114,27 +119,27 @@ export default function LandingPage() {
<div id="faq" data-section="faq">
<FaqDouble
title="Common Questions"
description="Everything you need to know."
description="Everything you need to know about our services."
textboxLayout="split"
faqsAnimation="slide-up"
useInvertedBackground={false}
faqs={[
{ id: "f1", title: "Do you take reservations?", content: "Yes, we highly recommend booking in advance." },
{ id: "f2", title: "Do you offer vegan options?", content: "Yes, our menu includes a variety of plant-based dishes." },
{ id: "f1", title: "Do you take reservations?", content: "Yes, we highly recommend booking in advance through our contact form." },
{ id: "f2", title: "Do you offer catering services?", content: "Indeed, we provide bespoke catering for private events and corporate functions." },
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
title="Get In Touch"
description="Reserve your spot or inquire about private events."
title="Need Assistance?"
description="Our support team is ready to help with reservations, catering inquiries, or general feedback. We aim to respond within 24 hours."
useInvertedBackground={false}
inputs={[
{ name: "name", type: "text", placeholder: "Your Name", required: true },
{ name: "email", type: "email", placeholder: "Your Email", required: true }
{ name: "name", type: "text", placeholder: "Your Full Name", required: true },
{ name: "email", type: "email", placeholder: "Email Address", required: true }
]}
textarea={{ name: "message", placeholder: "Special Requests?" }}
textarea={{ name: "message", placeholder: "How can we help you today?", rows: 4, required: true }}
/>
</div>
@@ -143,7 +148,7 @@ export default function LandingPage() {
logoText="Joli Café Bar"
columns={[
{ items: [{ label: "Home", href: "#hero" }, { label: "Menu", href: "#menu" }] },
{ items: [{ label: "Contact", href: "#contact" }] }
{ items: [{ label: "Contact Support", href: "#contact" }] }
]}
/>
</div>

View File

@@ -3,10 +3,16 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
export default function ShopPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Cart", id: "/cart" },
];
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
@@ -23,37 +29,27 @@ export default function ShopPage() {
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
]}
navItems={navItems}
brandName="Joli Café Bar"
/>
</div>
<div id="products" data-section="products">
<div id="products" data-section="products" className="pt-24">
<ProductCardTwo
title="Our Clothing Collection"
description="Discover our latest apparel, curated for style and comfort."
gridVariant="four-items-2x2-equal-grid"
title="Our Shop"
description="Browse our premium selection of coffee beans and culinary supplies."
gridVariant="uniform-all-items-equal"
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
textboxLayout="default"
products={[
{ id: "p1", brand: "Joli", name: "Essential Cotton Tee", price: "$35", rating: 5, reviewCount: "(120)", imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-casual-clothes_23-2148782354.jpg" },
{ id: "p2", brand: "Joli", name: "Relaxed Fit Hoodie", price: "$65", rating: 4, reviewCount: "(85)", imageSrc: "http://img.b2bpic.net/free-photo/hoodie-mockup_23-2148782354.jpg" },
{ id: "p3", brand: "Joli", name: "Summer Linen Shirt", price: "$55", rating: 5, reviewCount: "(45)", imageSrc: "http://img.b2bpic.net/free-photo/linen-shirt_23-2148782354.jpg" },
{ id: "p4", brand: "Joli", name: "Denim Everyday Jacket", price: "$95", rating: 4, reviewCount: "(60)", imageSrc: "http://img.b2bpic.net/free-photo/denim-jacket_23-2148782354.jpg" }
{ id: "p1", brand: "Joli", name: "Signature Roast", price: "$24", rating: 5, reviewCount: "(120)", imageSrc: "http://img.b2bpic.net/coffee-beans_23-2148782354.jpg" },
{ id: "p2", brand: "Joli", name: "Ceramic Mug", price: "$15", rating: 4, reviewCount: "(85)", imageSrc: "http://img.b2bpic.net/coffee-cup-table_23-2148782354.jpg" }
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="Joli Café Bar"
columns={[
{ items: [{ label: "Home", href: "/" }, { label: "Shop", href: "/shop" }] }
]}
columns={[{ items: [{ label: "Home", href: "/" }, { label: "Shop", href: "/shop" }] }]}
/>
</div>
</ReactLenis>