From cd614c3c2ddf184b2644c3e05aba0e71d310812f Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sun, 5 Apr 2026 15:11:09 +0000
Subject: [PATCH] Add src/app/cart/page.tsx

---
 src/app/cart/page.tsx | 77 +++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 77 insertions(+)
 create mode 100644 src/app/cart/page.tsx

diff --git a/src/app/cart/page.tsx b/src/app/cart/page.tsx
new file mode 100644
index 0000000..b39225b
--- /dev/null
+++ b/src/app/cart/page.tsx
@@ -0,0 +1,77 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import { useState } from "react";
+
+export default function CartPage() {
+  const [cartItems, setCartItems] = useState([
+    { id: "1", name: "Pro Wireless Headphones", price: 199, quantity: 1 },
+    { id: "2", name: "Modern Smartwatch", price: 299, quantity: 1 },
+  ]);
+
+  const total = cartItems.reduce((acc, item) => acc + item.price * item.quantity, 0);
+
+  const updateQuantity = (id: string, delta: number) => {
+    setCartItems(prev => prev.map(item => 
+      item.id === id ? { ...item, quantity: Math.max(1, item.quantity + delta) } : item
+    ));
+  };
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="shift-hover"
+        defaultTextAnimation="background-highlight"
+        borderRadius="pill"
+        contentWidth="smallMedium"
+        sizing="large"
+        background="blurBottom"
+        cardStyle="solid"
+        primaryButtonStyle="double-inset"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <NavbarStyleCentered
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Cart", id: "/cart" },
+          ]}
+          brandName="SwiftMarket"
+        />
+        
+        <div className="container mx-auto py-20 px-6">
+          <h1 className="text-4xl font-bold mb-10">Your Shopping Cart</h1>
+          <div className="grid gap-6">
+            {cartItems.map(item => (
+              <div key={item.id} className="flex justify-between items-center p-6 border rounded-lg">
+                <div>
+                  <h2 className="text-xl font-semibold">{item.name}</h2>
+                  <p className="text-gray-500">${item.price}</p>
+                </div>
+                <div className="flex items-center gap-4">
+                  <button onClick={() => updateQuantity(item.id, -1)} className="px-3 py-1 border rounded">-</button>
+                  <span className="font-bold">{item.quantity}</span>
+                  <button onClick={() => updateQuantity(item.id, 1)} className="px-3 py-1 border rounded">+</button>
+                </div>
+              </div>
+            ))}
+            <div className="mt-10 border-t pt-6 text-right">
+              <p className="text-2xl font-bold mb-4">Total: ${total}</p>
+              <button className="bg-black text-white px-8 py-3 rounded-full hover:opacity-80">
+                Proceed to Checkout
+              </button>
+            </div>
+          </div>
+        </div>
+
+        <FooterBaseCard
+          logoText="SwiftMarket"
+          columns={[]}
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}
\ No newline at end of file