Scroll to top of modal on open

VedalAI · Jun 10, 2024 · 70f1f54 · 70f1f54
1 parent 00beee9
commit 70f1f54
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 0 deletions.
diff --git a/frontend/www/css/base.css b/frontend/www/css/base.css
@@ -8,6 +8,7 @@
 body {
     background-color: #111;
     color: #fff;
+    overscroll-behavior: contain;
 }
 
 main {

diff --git a/frontend/www/src/modules/modal.ts b/frontend/www/src/modules/modal.ts
@@ -21,6 +21,7 @@ document.addEventListener("auxclick", (e) => {
 /* Containers */
 const $modalWrapper = document.getElementById("modal-wrapper")!;
 const $modal = document.getElementById("modal-wrapper")!.getElementsByClassName("modal")[0]!;
+const $modalInsideWrapper = $modal.getElementsByClassName("modal-inside-wrapper")[0]!;
 
 /* Descriptors */
 const $modalTitle = document.getElementById("modal-title")!;
@@ -109,6 +110,9 @@ export async function openModal(redeem: Redeem | null) {
     $modalPrice.textContent = redeem.price.toString();
     $modalImage.src = redeem.image;
 
+    // scroll to top of modal
+    $modalInsideWrapper.scrollTop = 0;
+
     setTimeout(() => $modal.classList.add("active-modal"), 10);
 
     hideProcessingModal();
-Original file line number
+Diff line change
@@ Expand Up / @@ -8,6 +8,7 @@ @@
     body {
         background-color: #111;
         color: #fff;
+        overscroll-behavior: contain;
     }
     main {
@@ Expand Down @@