diff --git a/build/configure/src/aqt.rs b/build/configure/src/aqt.rs
index 83be77e91..183b7f0b3 100644
--- a/build/configure/src/aqt.rs
+++ b/build/configure/src/aqt.rs
@@ -170,7 +170,7 @@ fn build_imgs(build: &mut Build) -> Result<()> {
 }
 
 fn build_js(build: &mut Build) -> Result<()> {
-    for ts_file in &["deckbrowser", "webview", "toolbar", "reviewer-bottom"] {
+    for ts_file in &["deckbrowser", "webview", "toolbar"] {
         build.add_action(
             "qt:aqt:data:web:js",
             EsbuildScript {
diff --git a/build/configure/src/web.rs b/build/configure/src/web.rs
index ef2d268bb..9ee5d74b5 100644
--- a/build/configure/src/web.rs
+++ b/build/configure/src/web.rs
@@ -1,6 +1,7 @@
 // Copyright: Ankitects Pty Ltd and contributors
 // License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 
+use anyhow::Ok;
 use anyhow::Result;
 use ninja_gen::action::BuildAction;
 use ninja_gen::copy::CopyFiles;
@@ -228,6 +229,17 @@ fn build_and_check_pages(build: &mut Build) -> Result<()> {
             ":sveltekit"
         ],
     )?;
+    build_page(
+        "reviewer-bottom",
+        true,
+        inputs![
+            //
+            ":ts:lib",
+            ":ts:components",
+            ":sass",
+            ":sveltekit"
+        ],
+    )?;
 
     Ok(())
 }
diff --git a/qt/aqt/reviewer.py b/qt/aqt/reviewer.py
index a8839c598..4d7f175ab 100644
--- a/qt/aqt/reviewer.py
+++ b/qt/aqt/reviewer.py
@@ -355,12 +355,7 @@ class Reviewer:
         self.web.allow_drops = True
         self.web.eval("_blockDefaultDragDropBehavior();")
         # show answer / ease buttons
-        self.bottom.web.stdHtml(
-            self._bottomHTML(),
-            css=["css/toolbar-bottom.css", "css/reviewer-bottom.css"],
-            js=["js/vendor/jquery.min.js", "js/reviewer-bottom.js"],
-            context=ReviewerBottomBar(self),
-        )
+        self.bottom.web.load_ts_page("reviewer-bottom")
 
     # Showing the question
     ##########################################################################
diff --git a/ts/routes/reviewer-bottom/AnswerButton.svelte b/ts/routes/reviewer-bottom/AnswerButton.svelte
new file mode 100644
index 000000000..e69de29bb
diff --git a/qt/aqt/data/web/css/reviewer-bottom.scss b/ts/routes/reviewer-bottom/index.scss
similarity index 89%
rename from qt/aqt/data/web/css/reviewer-bottom.scss
rename to ts/routes/reviewer-bottom/index.scss
index 59098a5fb..fbe069779 100644
--- a/qt/aqt/data/web/css/reviewer-bottom.scss
+++ b/ts/routes/reviewer-bottom/index.scss
@@ -1,9 +1,9 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
-@use "../../../../../ts/lib/sass/root-vars";
-@use "../../../../../ts/lib/sass/vars" as *;
-@use "../../../../../ts/lib/sass/card-counts";
+@use "../../lib/sass/root-vars";
+@use "../../lib/sass/vars" as *;
+@use "../../lib/sass/card-counts";
 
 :root {
     --focus-color: #{palette-of(border-focus)};
diff --git a/ts/routes/reviewer-bottom/index.svelte b/ts/routes/reviewer-bottom/index.svelte
new file mode 100644
index 000000000..e69de29bb
diff --git a/qt/aqt/data/web/js/reviewer-bottom.ts b/ts/routes/reviewer-bottom/index.ts
similarity index 96%
rename from qt/aqt/data/web/js/reviewer-bottom.ts
rename to ts/routes/reviewer-bottom/index.ts
index 4ebf34510..ecb93d309 100644
--- a/qt/aqt/data/web/js/reviewer-bottom.ts
+++ b/ts/routes/reviewer-bottom/index.ts
@@ -5,6 +5,10 @@
 @typescript-eslint/no-unused-vars: "off",
 */
 
+import "./index.scss"
+
+console.log("Hello world")
+
 let time: number; // set in python code
 let timerStopped = false;
 
@@ -61,3 +65,4 @@ function selectedAnswerButton(): string {
     }
     return node.dataset.ease;
 }
+