Refactor heatmap UI by adjusting styles and improving layout structure

Author: RIGAT-Pierre-andre-2326090par

_includes/heatmap-ui2.html

@@ -5,7 +5,7 @@
 
 <!-- ── Bottom bar: badge + finger context + legend + reset ── -->
 <div class="bottom-bar">
-    <div style="flex-basis: 100%; display: flex; justify-content: center; align-items: center; pointer-events: auto; gap: 30px;">
+    <div style="flex-basis: 100%; display: flex; justify-content: center; align-items: center; pointer-events: auto; gap: 30px; height: 137px">
         <p class="finger-radio">
             <label for="all-fingers">
                 {{ e.total }}

assets/css/heatmap.css

@@ -58,8 +58,6 @@
     padding: 5px;
     font-size: 75%;
 
-    top: 9px;
-    right: 15px;
     background-color: #fff;
     border: 2px solid #e8e8e8;
     border-radius: 5px;
@@ -92,7 +90,7 @@
     width: 100px; height: 10px;
     border-radius: 5px;
     background: linear-gradient(to right, #ff0000, #ffff00, #00ff00);
-    border: 1px solid rgba(0, 0, 0, 0.1);
+    border: 1px solid rgb(192, 192, 192);
 }
 
 .reset-view-btn {