Update theme colors

Merge version_1 into main

src/app/page.tsx

@@ -2,6 +2,8 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
+import { useState } from "react";
+import { ShoppingCart, X, Plus, Minus, Trash2 } from "lucide-react";
 import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
@@ -14,6 +16,20 @@ import TestimonialCardSixteen from '@/components/sections/testimonial/Testimonia
 import TextAbout from '@/components/sections/about/TextAbout';
 
 export default function LandingPage() {
+  const [isCartOpen, setIsCartOpen] = useState(false);
+  const [cart, setCart] = useState<any[]>([]);
+
+  const addToCart = (product: any) => {
+    setCart((prev) => {
+      const existing = prev.find((item) => item.id === product.id);
+      if (existing) {
+        return prev.map((item) => item.id === product.id ? { ...item, quantity: item.quantity + 1 } : item);
+      }
+      return [...prev, { ...product, quantity: 1 }];
+    });
+    setIsCartOpen(true);
+  };
+
   return (
     <ThemeProvider
         defaultButtonVariant="shift-hover"
@@ -28,6 +44,31 @@ export default function LandingPage() {
         headingFontWeight="normal"
     >
       <ReactLenis root>
+        {isCartOpen && (
+          <div className="fixed inset-0 z-[100] bg-black/50 backdrop-blur-sm" onClick={() => setIsCartOpen(false)}>
+            <div className="absolute right-0 top-0 h-full w-full max-w-sm bg-white p-6 shadow-xl overflow-y-auto" onClick={(e) => e.stopPropagation()}>
+              <div className="flex justify-between items-center mb-6">
+                <h2 className="text-xl font-semibold">Dein Warenkorb</h2>
+                <button onClick={() => setIsCartOpen(false)}><X /></button>
+              </div>
+              {cart.length === 0 ? <p>Warenkorb ist leer.</p> : (
+                <div className="space-y-4">
+                  {cart.map((item) => (
+                    <div key={item.id} className="flex items-center gap-4 border-b pb-4">
+                      <img src={item.imageSrc} alt={item.name} className="w-16 h-16 object-cover rounded" />
+                      <div className="flex-1">
+                        <h4 className="font-medium">{item.name}</h4>
+                        <p className="text-sm text-gray-500">{item.price} x {item.quantity}</p>
+                      </div>
+                      <button onClick={() => setCart(cart.filter(i => i.id !== item.id))}><Trash2 className="text-red-500 w-4 h-4" /></button>
+                    </div>
+                  ))}
+                  <button className="w-full bg-black text-white py-3 rounded-full mt-4">Zur Kasse</button>
+                </div>
+              )}
+            </div>
+          </div>
+        )}
         <div id="nav" data-section="nav">
           <NavbarLayoutFloatingInline
             navItems={[
@@ -37,7 +78,7 @@ export default function LandingPage() {
               { name: "Kontakt", id: "contact" },
             ]}
             brandName="BABA Kebab"
-            button={{ text: "Route planen" }}
+            button={{ text: "Warenkorb", onClick: () => setIsCartOpen(true) }}
           />
         </div>
 
@@ -88,9 +129,9 @@ export default function LandingPage() {
             gridVariant="uniform-all-items-equal"
             useInvertedBackground={false}
             products={[
-              { id: "p1", name: "BABA Spezial Döner", price: "ab 8,50€", imageSrc: "http://img.b2bpic.net/free-photo/delicious-arabic-fast-food-meat-skewers-top-view_23-2148651131.jpg" },
-              { id: "p2", name: "Steak Döner", price: "ab 9,50€", imageSrc: "http://img.b2bpic.net/free-photo/lahmajun-with-meat-mixed-vegetables_140725-1157.jpg" },
-              { id: "p3", name: "Hausgemachter Lahmacun", price: "ab 6,00€", imageSrc: "http://img.b2bpic.net/free-photo/top-view-seed-bread-concept_23-2148648796.jpg" },
+              { id: "p1", name: "BABA Spezial Döner", price: "ab 8,50€", imageSrc: "http://img.b2bpic.net/free-photo/delicious-arabic-fast-food-meat-skewers-top-view_23-2148651131.jpg?_wi=1", onProductClick: () => addToCart({ id: "p1", name: "BABA Spezial Döner", price: "8,50€", imageSrc: "http://img.b2bpic.net/free-photo/delicious-arabic-fast-food-meat-skewers-top-view_23-2148651131.jpg?_wi=2" }) },
+              { id: "p2", name: "Steak Döner", price: "ab 9,50€", imageSrc: "http://img.b2bpic.net/free-photo/lahmajun-with-meat-mixed-vegetables_140725-1157.jpg?_wi=1", onProductClick: () => addToCart({ id: "p2", name: "Steak Döner", price: "9,50€", imageSrc: "http://img.b2bpic.net/free-photo/lahmajun-with-meat-mixed-vegetables_140725-1157.jpg?_wi=2" }) },
+              { id: "p3", name: "Hausgemachter Lahmacun", price: "ab 6,00€", imageSrc: "http://img.b2bpic.net/free-photo/top-view-seed-bread-concept_23-2148648796.jpg?_wi=1", onProductClick: () => addToCart({ id: "p3", name: "Hausgemachter Lahmacun", price: "6,00€", imageSrc: "http://img.b2bpic.net/free-photo/top-view-seed-bread-concept_23-2148648796.jpg?_wi=2" }) },
               { id: "p4", name: "Sesam-Sauerteigbrot", price: "ab 2,50€", imageSrc: "http://img.b2bpic.net/free-photo/close-up-caesar-salad-with-fresh-lettuce-parmesan-fried-croutons-roast-beef_176474-901.jpg" },
               { id: "p5", name: "Veggie Mix", price: "ab 7,50€", imageSrc: "http://img.b2bpic.net/free-photo/meat-steaks-with-fried-potatoes-rice-garnish-inside-white-plate_114579-4421.jpg" },
               { id: "p6", name: "Döner-Box Spezial", price: "ab 8,00€", imageSrc: "http://img.b2bpic.net/free-photo/meat-kabab-served-with-mangal-salad-onions-greens-pickles_140725-7975.jpg" },
@@ -165,10 +206,10 @@ export default function LandingPage() {
             logoText="BABA Kebab"
             columns={[
               {
-                title: "Menü",                items: [{ label: "Steak-Döner", href: "#products" }, { label: "Spezial-Döner", href: "#products" }],
+                title: "Menü", items: [{ label: "Steak-Döner", href: "#products" }, { label: "Spezial-Döner", href: "#products" }],
               },
               {
-                title: "Über",                items: [{ label: "Unsere Story", href: "#about" }, { label: "Kontakt", href: "#contact" }],
+                title: "Über", items: [{ label: "Unsere Story", href: "#about" }, { label: "Kontakt", href: "#contact" }],
               },
             ]}
           />
@@ -176,4 +217,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -12,7 +12,7 @@
 
   --background: #000000;
   --card: #0c0c0c;
-  --foreground: #ffffff;
+  --foreground: #ff0000;
   --primary-cta: #cee7ff;
   --primary-cta-text: #000000;
   --secondary-cta: #000000;