X-Git-Url: https://git.auder.net/pieces/Checkered/cq.svg?a=blobdiff_plain;f=client%2Fsrc%2Fcomponents%2FMoveList.vue;h=da3c0472516bcc7ceede2119c7ff515b8235359f;hb=665eed903c4f294de82e7cb0ce4026b64fe64765;hp=a9fa9834b042e6e6d37244c6fff6aac6c6a29b18;hpb=e6bcc1d87c65264608d1134a24d758e0f2a687c1;p=vchess.git

diff --git a/client/src/components/MoveList.vue b/client/src/components/MoveList.vue
index a9fa9834..da3c0472 100644
--- a/client/src/components/MoveList.vue
+++ b/client/src/components/MoveList.vue
@@ -22,20 +22,23 @@ div
       @click="$emit('showrules')"
     )
       | {{ st.tr["Rules"] }}
-    button.tooltip(
+    button(
+      :class="btnTooltipClass"
       onClick="window.doClick('modalAdjust')"
       :aria-label="st.tr['Resize board']"
     )
       img.inline(src="/images/icons/resize.svg")
-    button.tooltip(
+    button#analyzeBtn(
       v-if="canAnalyze"
+      :class="btnTooltipClass"
       @click="$emit('analyze')"
       :aria-label="st.tr['Analyse']"
     )
       img.inline(src="/images/icons/analyse.svg")
     #downloadDiv(v-if="canDownload")
       a#download(href="#")
-      button.tooltip(
+      button(
+        :class="btnTooltipClass"
         @click="$emit('download')"
         :aria-label="st.tr['Download'] + ' PGN'"
       )
@@ -45,7 +48,7 @@ div
     span.score-msg {{ st.tr[message] }}
   .moves-list(v-if="!['none','highlight'].includes(show)")
     .tr(v-for="moveIdx in evenNumbers")
-      .td {{ firstNum + moveIdx / 2 + 1 }}
+      .td {{ firstNum + moveIdx / 2 }}
       .td(v-if="moveIdx < moves.length-1 || show == 'all'"
         :class="{'highlight-lm': cursor == moveIdx}"
         @click="() => gotoMove(moveIdx)"
@@ -56,7 +59,7 @@ div
         :class="{'highlight-lm': highlightBlackmove(moveIdx+1)}"
         @click="() => gotoMove(moveIdx+1)"
       )
-        | {{ notation(moves[moveIdx+1]) }}
+        | {{ notation(moves[moveIdx + 1]) }}
 </template>
 
 <script>
@@ -76,12 +79,6 @@ export default {
   mounted: function() {
     document.getElementById("adjuster")
       .addEventListener("click", processModalClick);
-    if ("ontouchstart" in window) {
-      // Disable tooltips on smartphones:
-      document.querySelectorAll("#aboveMoves .tooltip").forEach(elt => {
-        elt.classList.remove("tooltip");
-      });
-    }
     // Take full width on small screens:
     let boardSize = parseInt(localStorage.getItem("boardSize"));
     if (!boardSize) {
@@ -148,6 +145,9 @@ export default {
         )
       );
     },
+    btnTooltipClass: function() {
+      return { tooltip: !("ontouchstart" in window) };
+    },
     gotoMove: function(index) {
       this.$emit("goto-move", index);
     },
@@ -240,6 +240,8 @@ span#rulesBtn
 
 button
   margin: 0
+  &.active
+    background-color: #50E99A
 
 #aboveMoves button
   padding-bottom: 5px