Merge branch 'main' of https://github.com/Alvin-Zilverstand/Schoolkantine

website/Cart/cart.css

@@ -35,7 +35,7 @@
     display: flex;
     justify-content: space-between;
     padding: 10px 0;
-    border-bottom: 1px solid #ddd;
+    border-bottom: 1px solid #ff9d3b;
 }
 
 .cart-item button {

website/Cart/cart.js

@@ -63,4 +63,15 @@ updateCartCountDisplay(); // Initialize the cart count on page load
 // Function to close the modal window
 function closeModal() {
     document.getElementById('modal').style.display = 'none';
-}
+<<<<<<< HEAD:website/cart.js
+}
+
+let cartCount = 0;
+
+function addToCart() {
+    cartCount++;
+    document.querySelector('.cart-count').textContent = cartCount;
+}
+=======
+}
+>>>>>>> 1f418f9c8547c52f6394b681eb5ce02ee196b69a:website/Cart/cart.js

website/style.css

@@ -3,33 +3,26 @@ body {
     font-family: Arial, sans-serif;
     margin: 0;
     display: flex;
-    flex-direction: column; /* Change to column to accommodate the top bar */
-    background-color: #f2c14e;
+    justify-content: space-between;
+    background-color: #ffffff;
 }
 
-/* Top bar menu */
-.menu-bar {
-    width: 100%;
-    background-color: #f2c14e;
-    padding: 10px 0;
-    display: flex;
-    justify-content: space-around;
-    align-items: center;
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-    position: fixed; /* Fix the top bar to the top */
-    top: 0;
-    z-index: 1000; /* Ensure it is above other elements */
-    transition: background-color 0.3s ease; /* Add transition for background color */
-}
-
-.menu-bar.dark {
-    background-color: #d1a73e; /* Darker background color when modal is open */
+/* Linkerkant menu */
+.menu-list {
+    width: 25%;
+    background-color: #d7d7d7;
+    padding: 20px;
+    height: 100vh;
+    overflow-y: auto;
 }
 
 .menu-item {
     background-color: #fff;
     padding: 10px 20px;
     margin: 5px;
+    background-color: #ff9d3b;
+    padding: 20px;
+    margin: 10px 0;
     border-radius: 8px;
     cursor: pointer;
     font-size: 1.2em;
@@ -37,7 +30,7 @@ body {
 }
 
 .menu-item:hover {
-    background-color: #f59e42;
+    background-color: #ff9d3b;
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
 }
 
@@ -60,6 +53,9 @@ body {
     text-align: center;
     cursor: pointer;
     transition: all 0.3s ease;
+    background-color: #e3e3e3 ;
+    
+    
 }
 
 .product-box:hover {