fix(app): layout fixes

unionlabs · May 30, 2024 · 137fba7 · 137fba7
1 parent 30e8f6f
commit 137fba7
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 5 deletions.
diff --git a/app/src/app.html b/app/src/app.html
@@ -10,9 +10,8 @@
   %sveltekit.head%
 </head>
 
-<body data-sveltekit-prefetch data-sveltekit-preload-data="hover" data-sveltekit-preload-code="hover"
-  class="size-full m-auto flex justify-center max-w-full overflow-x-hidden">
-  <div class="size-full min-w-full min-h-full">%sveltekit.body%</div>
+<body data-sveltekit-prefetch data-sveltekit-preload-data="hover" data-sveltekit-preload-code="hover">
+  <div class="size-screen flex flex-col">%sveltekit.body%</div>
 </body>
 
 </html>
diff --git a/app/src/routes/+layout.svelte b/app/src/routes/+layout.svelte
@@ -108,9 +108,8 @@ $: if ($navigating) console.log("Navigating to", $page.url.pathname)
   <Toaster position="bottom-right" />
 
   <Header />
-  <slot />
+  <div class="flex-1"><slot /></div>
   <Footer />
-
   <SvelteQueryDevtools
     position="bottom"
     client={queryClient}

diff --git a/app/src/routes/explorer/+layout.svelte b/app/src/routes/explorer/+layout.svelte
@@ -0,0 +1,13 @@
+<script>
+    import { cn } from "$lib/utilities/shadcn";
+</script>
+<div class="flex flex-row h-full flex-1">
+  <nav class={cn("flex flex-col border-solid border-r border-red-500 w-40")}>
+    <a href="/explorer/blocks">blocks</a>
+    <a href="/explorer/connections">connections</a>
+  </nav>
+
+  <div class="flex-1">
+    <slot/>
+  </div>
+</div>
diff --git a/app/src/routes/explorer/+page.svelte b/app/src/routes/explorer/+page.svelte
@@ -0,0 +1 @@
+
diff --git a/app/src/styles/tailwind.css b/app/src/styles/tailwind.css
@@ -16,6 +16,10 @@
     min-width: min-content;
     min-height: min-content;
   }
+  .size-screen {
+    width: 100vw;
+    height: 100vh;
+  }
 }