feat(slides): Update style of slide controller buttons

2 files changed, 35 insertions, 3 deletions

diff --git a/services/nuldoc/static/_all/style.css b/services/nuldoc/static/_all/style.css
index 8c848bc..32dd4f5 100644
--- a/services/nuldoc/static/_all/style.css
+++ b/services/nuldoc/static/_all/style.css
@@ -418,3 +418,33 @@ img {
   color: #000;
   border-bottom-color: #000;
 }
+
+.controllers {
+  display: flex;
+  flex-direction: column;
+  align-items: end;
+  margin: 1rem 0;
+}
+
+.controllers-buttons {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+}
+
+.controllers button {
+  width: 3.5rem;
+  height: 3rem;
+  border-radius: 0.5rem;
+  background: #000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #fff;
+  border: none;
+  cursor: pointer;
+}
+
+.controllers button:hover {
+  background: #555;
+}
diff --git a/services/nuldoc/static/slides/slide.js b/services/nuldoc/static/slides/slide.js
index 4c7a0de..75a8d35 100644
--- a/services/nuldoc/static/slides/slide.js
+++ b/services/nuldoc/static/slides/slide.js
@@ -1,6 +1,6 @@
-import { GlobalWorkerOptions, getDocument } from "/pdf.min.mjs";
+import { getDocument, GlobalWorkerOptions } from "./pdf.min.mjs";
 
-document.addEventListener("DOMContentLoaded", async () => {
+async function init() {
   GlobalWorkerOptions.workerSrc = "/pdf.worker.min.mjs";
 
   const canvas = document.getElementById("slide");
@@ -57,4 +57,6 @@ document.addEventListener("DOMContentLoaded", async () => {
   // TODO: error handling
   doc = await getDocument(url).promise;
   queueRenderPage(pageNum);
-});
+}
+
+document.addEventListener("DOMContentLoaded", init);