Refactor heatmap UI: remove unused finger selection styles and adjust select element widths

Author: RIGAT-Pierre-andre-2326090par

_includes/heatmap.html

@@ -1,7 +1,7 @@
 {% assign e = site.data[page.lang]['heatmap-ui'] %}
 
 <div id="interface">
-    <div class="select active" role="select" style="width: 14em">
+    <div class="select active" role="select" style="width: 13em">
         <input class="select-checkbox" id="hand-select-checkbox" type="checkbox">
         <label for="hand-select-checkbox" style="display: flex; justify-content:  space-between">
             <span id="hand-selected">{{ e.total }}</span>
@@ -14,7 +14,7 @@
             <span class="select-option">{{ e.hf_format | replace: '%h%', e.right | replace: '%f%', e.hand }}</span>
         </div>
     </div>
-    <div class="select" id="finger-select" role="select" style="width: 8em">
+    <div class="select" id="finger-select" role="select" style="width: 7em">
         <input class="select-checkbox" id="finger-select-checkbox" type="checkbox">
         <label for="finger-select-checkbox" style="display: flex; justify-content: space-between">
             <span id="finger-selected">{{ e.all_button }}</span>

assets/css/heatmap.css

@@ -43,60 +43,6 @@
     cursor: grabbing;
 }
 
-.finger-select {
-    font: inherit;
-    font-size: 75%;
-
-    top: 9px;
-    right: 15px;
-    background-color: #fff;
-    border: 2px solid #e8e8e8;
-    border-radius: 5px;
-
-    opacity: 50%;
-    pointer-events: none;
-}
-
-.finger-select.active {
-    opacity: 100%;
-    pointer-events: auto;
-}
-
-.finger-radio {
-    padding: 5px;
-    font-size: 75%;
-
-    background-color: #fff;
-    border: 2px solid #e8e8e8;
-    border-radius: 5px;
-
-    opacity: 50%;
-    pointer-events: none;
-}
-
-.finger-radio.active {
-    opacity: 100%;
-    pointer-events: auto;
-}
-
-.row {
-    flex-basis: 100%;
-    display: flex;
-    justify-content: space-around;
-    align-items: center;
-}
-
-.row button {
-    font: inherit;
-    font-size: 80%;
-    background: #fff;
-    border: 1px solid #c8c8c8;
-
-    height: 26px;
-    border-radius: 13px;
-    pointer-events: auto;
-}
-
 #interface {
     position: absolute;
     left: 50%;