diff --git a/frontend/src/styles/core.scss b/frontend/src/styles/core.scss
index 55075a107..555a9739b 100644
--- a/frontend/src/styles/core.scss
+++ b/frontend/src/styles/core.scss
@@ -84,7 +84,7 @@ a {
   }
 }
 
-a[data-link] * {
+a[router-link] * {
   pointer-events: none;
 }
 
diff --git a/frontend/src/ts/controllers/route-controller.ts b/frontend/src/ts/controllers/route-controller.ts
index 16fba205c..1b3c9f8da 100644
--- a/frontend/src/ts/controllers/route-controller.ts
+++ b/frontend/src/ts/controllers/route-controller.ts
@@ -156,7 +156,7 @@ window.addEventListener("popstate", () => {
 document.addEventListener("DOMContentLoaded", () => {
   document.body.addEventListener("click", (e) => {
     const target = e?.target as HTMLLinkElement;
-    if (target.matches("[data-link]") && target?.href) {
+    if (target.matches("[router-link]") && target?.href) {
       e.preventDefault();
       navigate(target.href);
     }
diff --git a/frontend/src/ts/elements/leaderboards.ts b/frontend/src/ts/elements/leaderboards.ts
index b504d0441..be82a638f 100644
--- a/frontend/src/ts/elements/leaderboards.ts
+++ b/frontend/src/ts/elements/leaderboards.ts
@@ -324,7 +324,7 @@ async function fillTable(lb: LbKey, prepend?: number): Promise<void> {
     <div class="avatarNameBadge">${avatar}
       <a href="${location.origin}/profile/${entry.uid}" class="entryName" uid=${
       entry.uid
-    } data-link>${entry.name}</a>
+    } router-link>${entry.name}</a>
       ${entry.badgeId ? getBadgeHTMLbyId(entry.badgeId) : ""}
     </div>
     </td>
diff --git a/frontend/static/html/pages/404.html b/frontend/static/html/pages/404.html
index f010c8851..3b1f3a38f 100644
--- a/frontend/static/html/pages/404.html
+++ b/frontend/static/html/pages/404.html
@@ -2,7 +2,7 @@
   <div class="content">
     <div class="image"></div>
     <div>Ooops! Looks like you found a page that doesn't exist.</div>
-    <a href="/" class="button" data-link>
+    <a href="/" class="button" router-link>
       <i class="fas fa-home"></i>
       Go Home
     </a>
diff --git a/frontend/static/html/pages/test.html b/frontend/static/html/pages/test.html
index 03a332515..c140aeabd 100644
--- a/frontend/static/html/pages/test.html
+++ b/frontend/static/html/pages/test.html
@@ -179,7 +179,7 @@
       <canvas id="wpmChart"></canvas>
     </div>
     <div class="loginTip">
-      <a href="/login" tabindex="2" data-link>Sign in</a>
+      <a href="/login" tabindex="2" router-link>Sign in</a>
       to save your result
     </div>
     <div class="bottom" style="grid-column: 1/3">
diff --git a/frontend/static/html/top.html b/frontend/static/html/top.html
index 84c963d03..5edc30218 100644
--- a/frontend/static/html/top.html
+++ b/frontend/static/html/top.html
@@ -50,7 +50,7 @@
       tabindex="2"
       href="/"
       onclick="this.blur();"
-      data-link
+      router-link
     >
       <div class="icon">
         <i class="fas fa-fw fa-keyboard"></i>
@@ -70,7 +70,7 @@
       tabindex="2"
       href="/about"
       onclick="this.blur();"
-      data-link
+      router-link
     >
       <div class="icon">
         <i class="fas fa-fw fa-info"></i>
@@ -93,7 +93,7 @@
       tabindex="2"
       href="/settings"
       onclick="this.blur();"
-      data-link
+      router-link
     >
       <div class="icon">
         <i class="fas fa-fw fa-cog"></i>
@@ -104,7 +104,7 @@
       tabindex="2"
       href="/account"
       onclick="this.blur();"
-      data-link
+      router-link
     >
       <div class="icon">
         <i class="fas fa-fw fa-user"></i>
@@ -125,7 +125,7 @@
       tabindex="2"
       href="/login"
       onclick="this.blur();"
-      data-link
+      router-link
     >
       <div class="icon">
         <i class="far fa-fw fa-user"></i>