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

website/script.js

@@ -270,3 +270,58 @@ window.onclick = function(event) {
 
 // Initial call to updateCart to ensure the button is hidden on page load
 updateCart();
+
+const translations = {
+    en: {
+        "Broodjes": "Sandwiches",
+        "Koude Dranken": "Cold Drinks",
+        "Warme Dranken": "Hot Drinks",
+        "Snacks": "Snacks",
+        "deserts": "Desserts",
+        "Deals": "Deals",
+        "Soepen": "Soups",
+        "Salades": "Salads",
+        "Sausjes": "Sauces",
+        "Winkelmandje": "Shopping Cart",
+        "Bestellen": "Order",
+        "Prijs": "Price",
+        "Totaal": "Total",
+        "Toevoegen aan winkelmandje": "Add to Cart",
+        "Soep van de dag! (Allergieën? Meld het bij ons!)": "Soup of the day! (Allergies? Let us know!)",
+        // Add more translations as needed
+    },
+    nl: {
+        "Sandwiches": "Broodjes",
+        "Cold Drinks": "Koude Dranken",
+        "Hot Drinks": "Warme Dranken",
+        "Snacks": "Snacks",
+        "Desserts": "deserts",
+        "Deals": "Deals",
+        "Soups": "Soepen",
+        "Salads": "Salades",
+        "Sauces": "Sausjes",
+        "Shopping Cart": "Winkelmandje",
+        "Order": "Bestellen",
+        "Price": "Prijs",
+        "Total": "Totaal",
+        "Add to Cart": "Toevoegen aan winkelmandje",
+        "Soup of the day! (Allergies? Let us know!)": "Soep van de dag! (Allergieën? Meld het bij ons!)",
+        // Add more translations as needed
+    }
+};
+
+function switchLanguage(lang) {
+    document.querySelectorAll("[data-translate]").forEach(element => {
+        const key = element.getAttribute("data-translate");
+        element.textContent = translations[lang][key] || key;
+    });
+}
+
+document.addEventListener("DOMContentLoaded", () => {
+    document.getElementById("language-switcher").addEventListener("click", () => {
+        const currentLang = document.documentElement.lang;
+        const newLang = currentLang === "nl" ? "en" : "nl";
+        document.documentElement.lang = newLang;
+        switchLanguage(newLang);
+    });
+});

website/style.css

@@ -238,13 +238,22 @@ body {
     right: 0; /* Align the cart to the right */
     top: 60px; /* Ensure it starts below the categories bar */
     flex-direction: column; /* Ensure the content is arranged in a column */
+    overflow-y: auto; /* Enable vertical scrolling if content exceeds max-height */
+    max-height: 80vh; /* Set a maximum height for the cart */
 }
 
 .cart ul {
     list-style-type: none;
     padding: 0;
+    margin: 0;
 }
 
+.cart li {
+    padding: 10px 0; /* Space out the items */
+    border-bottom: 1px solid #ff8c00; /* Change this to the orange color */
+}
+
+
 .cart li {
     margin-bottom: 10px;
 }
@@ -263,17 +272,9 @@ body {
     display: flex;
     justify-content: space-between;
     padding: 10px 0;
-    border-bottom: 1px solid #ff9d3b;
+    border-bottom: 2px solid #ff8c00; /* Change this to the orange color */
 }
 
-.cart-item button {
-    background-color: #d32f2f;
-    color: white;
-    border: none;
-    padding: 5px 10px;
-    cursor: pointer;
-    border-radius: 5px;
-}
 
 .cart-item button:hover {
     background-color: #b71c1c;