Css angepasst.

public/Warenkorb/warenkorb.html

@@ -30,7 +30,7 @@
     document.addEventListener('DOMContentLoaded', function () {
         ladeWarenkorb();
 
-        document.getElementById('zurKasseGehen').addEventListener('click', function () {
+        document.getElementById('zurKasseGehen').addEventListener('click', function() {
             window.location.href = '/bestellformular'; // Deine Bestellformular-Seite
         });
     });
@@ -54,17 +54,17 @@
         const table = document.createElement('table');
         table.className = 'warenkorb-tabelle';
         table.innerHTML = `
-          <thead>
-              <tr>
-                  <th>Produkt</th>
-                  <th>Preis (Stück)</th>
-                  <th>Anzahl</th>
-                  <th>Zwischensumme</th>
-                  <th>Aktion</th>
-              </tr>
-          </thead>
-          <tbody></tbody>
-      `;
+            <thead>
+                <tr>
+                    <th>Produkt</th>
+                    <th>Preis (Stück)</th>
+                    <th>Anzahl</th>
+                    <th>Zwischensumme</th>
+                    <th>Aktion</th>
+                </tr>
+            </thead>
+            <tbody></tbody>
+        `;
 
         const tbody = table.querySelector('tbody');
 
@@ -74,16 +74,16 @@
 
             const row = document.createElement('tr');
             row.innerHTML = `
-              <td>${produkt.product_name}</td>
-              <td>${produkt.price.toFixed(2)} €</td>
-              <td>
-                  <button class="menge-button" onclick="aendereMenge(${index}, -1)">-</button>
-                  <span class="produkt-anzahl">${produkt.quantity}</span>
-                  <button class="menge-button" onclick="aendereMenge(${index}, 1)">+</button>
-              </td>
-              <td>${zwischensumme.toFixed(2)} €</td>
-              <td><button onclick="entferneAusWarenkorb(${index})" class="loeschen-button">Entfernen</button></td>
-          `;
+                <td>${produkt.product_name}</td>
+                <td>${produkt.price.toFixed(2)} €</td>
+                <td>
+                    <button class="menge-button" onclick="aendereMenge(${index}, -1)">-</button>
+                    <span class="produkt-anzahl">${produkt.quantity}</span>
+                    <button class="menge-button" onclick="aendereMenge(${index}, 1)">+</button>
+                </td>
+                <td>${zwischensumme.toFixed(2)} €</td>
+                <td><button onclick="entferneAusWarenkorb(${index})" class="loeschen-button">Entfernen</button></td>
+            `;
             tbody.appendChild(row);
         });
 
@@ -117,6 +117,6 @@
         localStorage.setItem('warenkorb', JSON.stringify(warenkorb));
         ladeWarenkorb();
     }
-</script>
+    </script>
 </body>
 </html>

public/bestellformular/bestellformular.html

@@ -170,6 +170,7 @@
 
                     if (response.ok) {
                         // Bestellung erfolgreich -> Weiterleitung
+                        warenkorbLeeren();
                         window.location.href = "/bestellung";
                     } else {
                         alert('Fehler: ' + result.message);
@@ -261,7 +262,6 @@
                 const neueArtikelDiv = document.createElement('div');
                 neueArtikelDiv.className = 'Artikel';
                 neueArtikelDiv.innerHTML = `
-                    <button type="button" class="loeschen-button" onclick="loescheArtikel(this)">x</button>
                     <input type="text" class="ArtikelNrText" name="ArtikelNr" required placeholder="Artikel Nr.">
                     <input type="text" class="StueckzahlText" name="Stueckzahl" required placeholder="Anzahl">
                     <div class="verfuegbarkeit"></div>
@@ -294,7 +294,6 @@
                 const artikelDiv = document.createElement('div');
                 artikelDiv.className = 'Artikel';
                 artikelDiv.innerHTML = `
-                    <button type="button" class="loeschen-button" onclick="loescheArtikel(this)">x</button>
                     <input type="text" class="ArtikelNrText" name="ArtikelNr" value="${produkt.product_id}" required placeholder="Artikel Nr.">
                     <input type="text" class="StueckzahlText" name="Stueckzahl" value="${produkt.quantity}" required placeholder="Anzahl">
                     <div class="verfuegbarkeit"></div>
@@ -303,6 +302,12 @@
             });
         }
 
+        window.warenkorbLeeren = function (){
+            localStorage.removeItem('warenkorb'); // Oder: localStorage.setItem('warenkorb', '[]');
+            ladeWarenkorb(); // Aktualisiert die Ansicht
+            if (window.zeigeWarenkorbAnzahl) zeigeWarenkorbAnzahl(); // Optional: Warenkorb-Zähler im Header aktualisieren
+        }
+
     </script>
     <!-- Footer wird dynamisch geladen -->
     <div id="footer"></div>

scripts/einfügenHeaderFooter.js

@@ -87,8 +87,10 @@ document.addEventListener("DOMContentLoaded", () => {
             loginBtn.addEventListener('click', (e) => {
                 e.preventDefault()
                 sessionStorage.clear()
+                localStorage.clear()
                 alert('Sie wurden ausgeloggt.')
                 location.reload()
+                
             })
         } else {
             loginBtn.textContent = 'Login'