From 7a0be8aa619901be045d505dd2d8ff28e297b217 Mon Sep 17 00:00:00 2001
From: elpatron68 <elpatron@cepheus.uberspace.de>
Date: Mon, 27 May 2024 13:16:18 +0200
Subject: [PATCH] Add tooltips

---
 templates/index.html | 25 +++++++++++++++----------
 1 file changed, 15 insertions(+), 10 deletions(-)
diff --git a/templates/index.html b/templates/index.html
index 6c4d246..786fe20 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -73,33 +73,38 @@
         }
     </style>
 </head>
+<script>
+    $(document).ready(function(){
+        $('[data-toggle="tooltip"]').tooltip();
+    });
+    </script>
 <body>
     <div class="container-fluid table-container">
         <table class="table table-bordered">
             <form method="post">
                 <tbody>
                     <tr class="bold-row">
-                        <td colspan="3">Erdbeerkasse 🍓💶</td>
+                        <td colspan="3">erdbeerkasse 🍓💶</td>
                     </tr>
                     <tr>
-                        <td><button type="submit" name="wert" value="5.8" class="btn btn-xl btn-primary custom-btn-size">🍓 5,80€ ({{ item1 }})</button></td>
-                        <td><button type="submit" name="wert" value="4.8" class="btn btn-xl btn-danger custom-btn-size">🫙🫙 4,80€ ({{ item2 }})</button></td>
-                        <td><button type="submit" name="wert" value="3.3" class="btn btn-xl btn-danger custom-btn-size">🫙 3,30€ ({{ item3 }})</button></td>
+                        <td><button type="submit" name="wert" value="5.8" data-toggle="tooltip" data-placement="top" title="500g Erdbeeren" class="btn btn-xl btn-primary custom-btn-size">🍓 5,80€ ({{ item1 }})</button></td>
+                        <td><button type="submit" name="wert" value="4.8" data-toggle="tooltip" data-placement="top" title="Marmelade groß" class="btn btn-xl btn-danger custom-btn-size">🫙🫙 4,80€ ({{ item2 }})</button></td>
+                        <td><button type="submit" name="wert" value="3.3" data-toggle="tooltip" data-placement="top" title="Marmelade klein" class="btn btn-xl btn-danger custom-btn-size">🫙 3,30€ ({{ item3 }})</button></td>
                     </tr>
                     <tr>
-                        <td><button type="submit" name="wert" value="8.8" class="btn btn-xl btn-warning custom-btn-size">🧃🧃 8,80€ ({{ item4 }})</button></td>
-                        <td><button type="submit" name="wert" value="5.5" class="btn btn-xl btn-warning custom-btn-size">🧃 5,50€ ({{ item5 }})</button></td>
-                        <td><button type="submit" name="wert" value="0.2" class="btn btn-xl btn-success custom-btn-size">🛍️ 0,20€ ({{ item6 }})</button></td>
+                        <td><button type="submit" name="wert" value="8.8" data-toggle="tooltip" data-placement="top" title="Saft 5l" class="btn btn-xl btn-warning custom-btn-size">🧃🧃 8,80€ ({{ item4 }})</button></td>
+                        <td><button type="submit" name="wert" value="5.5" data-toggle="tooltip" data-placement="top" title="Saft 3l" class="btn btn-xl btn-warning custom-btn-size">🧃 5,50€ ({{ item5 }})</button></td>
+                        <td><button type="submit" name="wert" value="0.2" data-toggle="tooltip" data-placement="top" title="Tragetasche" class="btn btn-xl btn-success custom-btn-size">🛍️ 0,20€ ({{ item6 }})</button></td>
                     </tr>
                     <tr>
-                        <td class="bold-row">🫰 {{ gesamtwert }}€</td>
+                        <td data-toggle="tooltip" data-placement="top" title="Summe" class="bold-row">🫰 {{ gesamtwert }}€</td>
                         <td>
                             <div class="input-container">
                                 <input type="text" class="form-control" name="given" placeholder="{{ given }}">
-                                <button type="submit" name="wert" value="-2" class="btn btn-xl btn-primary custom-btn-size-med">🧾</button>
+                                <button type="submit" name="wert" value="-2" data-toggle="tooltip" data-placement="top" title="Wechselgeld berechnen" class="btn btn-xl btn-primary custom-btn-size-med">🧾</button>
                             </div>
                         </td>
-                        <td class="bold-row {{ background }}">🪙 {{ change }}€</td>
+                        <td data-toggle="tooltip" data-placement="top" title="Wechselgeld" class="bold-row {{ background }}">🪙 {{ change }}€</td>
                     </tr>
                     <tr>
                         <td colspan="3"><button type="submit" name="wert" value="0" id="reset" class="btn btn-xl btn-dark custom-btn-size">Reset 🦭</button></td>

Erdbeerkasse 🍓💶			erdbeerkasse 🍓💶


🫰 {{ gesamtwert }}€	🫰 {{ gesamtwert }}€	- +	🪙 {{ change }}€	🪙 {{ change }}€