some improvements

static/script.js

@@ -95,4 +95,40 @@ function toggleMachine() {
         .then(data => {
             console.log(data);
         });
-}
+}
+
+function waterRefill(){
+    if (gebId("water-fill").parentElement.classList.contains("deniePress")){
+        return;
+    }
+    console.log(water)
+    if (water.fill == 100){
+        alert("Wassertank ist bereits voll!");
+        return;
+    }
+    console.log("waterRefill");
+    fetch('/unsecure/refill-water', { method: 'POST' })
+        .then(res => res.json())
+        .then(data => {
+            console.log(data);
+        });
+}
+
+function beansRefill(){
+    if (gebId("beans-fill").parentElement.classList.contains("deniePress")){
+        return;
+    }
+    if (beans.fill == 100){
+        alert("Bohnentank ist bereits voll!");
+        return;
+    }
+    console.log("beansRefill");
+    fetch('/unsecure/refill-beans', { method: 'POST' })
+        .then(res => res.json())
+        .then(data => {
+            console.log(data);
+        });
+}
+function showCoffeeHistory(){
+    window.location.href = "/unsecure/coffees-made";
+}

static/style.css

@@ -264,4 +264,52 @@ background-color: red;
 }
 .deniePress:hover{
     cursor: not-allowed;
+}
+
+
+
+/* STYLING FOR COFFEES MADE*/
+table {
+    width: 100%;
+    border-collapse: collapse;
+}
+th, td {
+    border: 1px solid #ddd;
+    padding: 8px;
+    text-align: left;
+}
+th {
+    background-color: #f4f4f4;
+}
+.homeBut {
+    background-color: #3498db;
+    color: white;
+    padding: 10px 20px;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 16px;
+    margin: 4px 2px;
+    cursor: pointer;
+    border-radius: 5px;
+}
+
+
+/* STYLING FOR BEANS AND WATER*/
+.container {
+    font-family: Arial, sans-serif;
+    max-width: 600px;
+    margin: 50px auto;
+    padding: 20px;
+    border: 1px solid #ccc;
+    border-radius: 10px;
+    background-color: #f9f9f9;
+    text-align: center;
+}
+.status p {
+    font-size: 1.2em;
+    margin: 10px 0;
+}
+.actions {
+    margin-top: 20px;
 }