explorer: fix double scrollbar issue

dusk-network · May 15, 2024 · 68324d9 · 68324d9
1 parent 9a44505
commit 68324d9
Show file tree

Hide file tree

Showing 6 changed files with 25 additions and 2 deletions.
diff --git a/explorer/src/app.html b/explorer/src/app.html
@@ -16,6 +16,6 @@
     data-sveltekit-preload-code="viewport"
     data-sveltekit-preload-data="hover"
   >
-    <div>%sveltekit.body%</div>
+    <div class="app-container">%sveltekit.body%</div>
   </body>
 </html>
diff --git a/explorer/src/lib/components/blocks-card/BlocksCard.css b/explorer/src/lib/components/blocks-card/BlocksCard.css
@@ -1,5 +1,4 @@
 .blocks-card__table,
 .blocks-card__list {
-  max-height: 70dvh;
   overflow-y: auto;
 }
diff --git a/explorer/src/lib/components/data-card/DataCard.css b/explorer/src/lib/components/data-card/DataCard.css
@@ -1,5 +1,8 @@
 .data-card {
   padding: 1rem 0;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
 }
 
 .data-card__loading-notice {

diff --git a/explorer/src/routes/+layout.svelte b/explorer/src/routes/+layout.svelte
@@ -30,3 +30,10 @@
 </footer>
 
 <Tooltip id="main-tooltip" />
+
+<style>
+  .explorer {
+    display: flex;
+    flex-direction: column;
+  }
+</style>
diff --git a/explorer/src/routes/blocks/+page.svelte b/explorer/src/routes/blocks/+page.svelte
@@ -29,3 +29,11 @@
     loading={isLoading}
   />
 </section>
+
+<style>
+  .blocks {
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+  }
+</style>
diff --git a/explorer/src/style/main.css b/explorer/src/style/main.css
@@ -67,3 +67,9 @@ svg {
     padding: 0 1.25rem;
   }
 }
+
+.app-container {
+  display: flex;
+  flex-direction: column;
+  height: 100dvh;
+}