From 2f390cb881ed8fe780214eb3ad9cdfaf88779e01 Mon Sep 17 00:00:00 2001
From: Thibault Duplessis <t@lichess.org>
Date: Thu, 19 Dec 2024 13:55:27 +0100
Subject: [PATCH] change the round buttons element

---
 ui/round/css/_constants.scss  | 1 +
 ui/round/css/_moves-col1.scss | 2 +-
 ui/round/css/_moves.scss      | 2 +-
 ui/round/src/view/replay.ts   | 5 +++--
 4 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/ui/round/css/_constants.scss b/ui/round/css/_constants.scss
index 60118927999f7..e8067218a3f0b 100644
--- a/ui/round/css/_constants.scss
+++ b/ui/round/css/_constants.scss
@@ -5,6 +5,7 @@ $col1-mat-height: $col1-player-clock-height * 2 / 5;
 $col1-moves-height: 4em;
 $move-tag: 'kwdb';
 $rmoves-tag: 'rm6';
+$rbuttons-tag: 'rb1';
 $moves-tag: 'l4x';
 $index-tag: 'i5z';
 $active-class: 'a1t';
diff --git a/ui/round/css/_moves-col1.scss b/ui/round/css/_moves-col1.scss
index 6f3c5cd9f616b..ef157dfaa0192 100644
--- a/ui/round/css/_moves-col1.scss
+++ b/ui/round/css/_moves-col1.scss
@@ -68,7 +68,7 @@
     }
   }
 
-  .buttons {
+  #{$rbuttons-tag} {
     display: none;
   }
 
diff --git a/ui/round/css/_moves.scss b/ui/round/css/_moves.scss
index cd7a60dce0f0f..655a982028b72 100644
--- a/ui/round/css/_moves.scss
+++ b/ui/round/css/_moves.scss
@@ -16,7 +16,7 @@ $buttons-height: 2.5rem;
   @extend %flex-column, %double-tap;
   position: relative;
 
-  .buttons {
+  #{$rbuttons-tag} {
     @extend %box-shadow;
 
     flex: 0 0 $buttons-height;
diff --git a/ui/round/src/view/replay.ts b/ui/round/src/view/replay.ts
index 957c3c5acfdca..94d8e1a39104e 100644
--- a/ui/round/src/view/replay.ts
+++ b/ui/round/src/view/replay.ts
@@ -18,7 +18,8 @@ const scrollMax = 99999,
   indexTag = 'i5z',
   indexTagUC = indexTag.toUpperCase(),
   movesTag = 'l4x',
-  rmovesTag = 'rm6';
+  rmovesTag = 'rm6',
+  rbuttonsTag = 'rb1';
 
 const autoScroll = throttle(100, (movesEl: HTMLElement, ctrl: RoundController) =>
   window.requestAnimationFrame(() => {
@@ -146,7 +147,7 @@ const goThroughMoves = (ctrl: RoundController, e: Event) => {
 function renderButtons(ctrl: RoundController) {
   const firstPly = util.firstPly(ctrl.data),
     lastPly = util.lastPly(ctrl.data);
-  return h('div.buttons', [
+  return h(rbuttonsTag, [
     analysisButton(ctrl) || h('div.noop'),
     ...[
       [licon.JumpFirst, firstPly],