From b7f8c946df2f601fb901e11c81d9a88ed172afa3 Mon Sep 17 00:00:00 2001
From: Miodec <jack@monkeytype.com>
Date: Tue, 21 Nov 2023 14:22:56 +0000
Subject: [PATCH] refactor: use button instead of div

---
 frontend/src/ts/account/pb-tables.ts    | 12 ++--
 frontend/static/html/pages/account.html | 82 ++++++++++++-------------
 2 files changed, 47 insertions(+), 47 deletions(-)

diff --git a/frontend/src/ts/account/pb-tables.ts b/frontend/src/ts/account/pb-tables.ts
index 18138011d..0d408de16 100644
--- a/frontend/src/ts/account/pb-tables.ts
+++ b/frontend/src/ts/account/pb-tables.ts
@@ -6,13 +6,13 @@ import { get as getTypingSpeedUnit } from "../utils/typing-speed-units";
 function clearTables(isProfile: boolean): void {
   const source = isProfile ? "Profile" : "Account";
 
-  const showAllButton = `<div class="buttonGroup"><div
-  class="showAllButton button"
+  const showAllButton = `<div class="buttonGroup"><button
+  class="showAllButton"
   data-balloon-pos="left"
   aria-label="Show all personal bests"
 >
   <i class="fas fa-ellipsis-v"></i>
-</div></div>`;
+</button></div>`;
 
   const htmlToShow = isProfile ? "" : showAllButton;
 
@@ -103,13 +103,13 @@ export function update(
 
   const showAllButton = isProfile
     ? ""
-    : `<div class="buttonGroup"><div
-      class="showAllButton button"
+    : `<div class="buttonGroup"><button
+      class="showAllButton"
       data-balloon-pos="left"
       aria-label="Show all personal bests"
     >
       <i class="fas fa-ellipsis-v"></i>
-    </div></div>`;
+    </button></div>`;
 
   $(`.page${source} .profile .pbsTime`).append(text + showAllButton);
 
diff --git a/frontend/static/html/pages/account.html b/frontend/static/html/pages/account.html
index 537f9fb6c..ef9289182 100644
--- a/frontend/static/html/pages/account.html
+++ b/frontend/static/html/pages/account.html
@@ -112,46 +112,6 @@
           <div class="pos">-</div>
         </div>
       </div>
-      <div class="pbsWords">
-        <div class="group">
-          <div class="quick">
-            <div class="test">10 words</div>
-            <div class="wpm">-</div>
-            <div class="acc">-</div>
-          </div>
-        </div>
-        <div class="group">
-          <div class="quick">
-            <div class="test">25 words</div>
-            <div class="wpm">-</div>
-            <div class="acc">-</div>
-          </div>
-        </div>
-        <div class="group">
-          <div class="quick">
-            <div class="test">50 words</div>
-            <div class="wpm">-</div>
-            <div class="acc">-</div>
-          </div>
-        </div>
-        <div class="group">
-          <div class="quick">
-            <div class="test">100 words</div>
-            <div class="wpm">-</div>
-            <div class="acc">-</div>
-          </div>
-        </div>
-        <div class="buttonGroup">
-          <div
-            class="showAllButton button"
-            data-balloon-pos="left"
-            aria-label="Show all personal bests"
-            role="button"
-          >
-            <i class="fas fa-ellipsis-v"></i>
-          </div>
-        </div>
-      </div>
       <div class="pbsTime">
         <div class="group">
           <div class="quick">
@@ -183,7 +143,47 @@
         </div>
         <div class="buttonGroup">
           <div
-            class="showAllButton button"
+            class="showAllButton"
+            data-balloon-pos="left"
+            aria-label="Show all personal bests"
+            role="button"
+          >
+            <i class="fas fa-ellipsis-v"></i>
+          </div>
+        </div>
+      </div>
+      <div class="pbsWords">
+        <div class="group">
+          <div class="quick">
+            <div class="test">10 words</div>
+            <div class="wpm">-</div>
+            <div class="acc">-</div>
+          </div>
+        </div>
+        <div class="group">
+          <div class="quick">
+            <div class="test">25 words</div>
+            <div class="wpm">-</div>
+            <div class="acc">-</div>
+          </div>
+        </div>
+        <div class="group">
+          <div class="quick">
+            <div class="test">50 words</div>
+            <div class="wpm">-</div>
+            <div class="acc">-</div>
+          </div>
+        </div>
+        <div class="group">
+          <div class="quick">
+            <div class="test">100 words</div>
+            <div class="wpm">-</div>
+            <div class="acc">-</div>
+          </div>
+        </div>
+        <div class="buttonGroup">
+          <div
+            class="showAllButton"
             data-balloon-pos="left"
             aria-label="Show all personal bests"
             role="button"