Merge version_4 into main #5
56
src/app/cart/page.tsx
Normal file
56
src/app/cart/page.tsx
Normal 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>
|
||||
);
|
||||
}
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user