Merge pull request #42 from pvdthings/dev

Release - Catalog App Shell (v0)
pvdthings · Jul 28, 2024 · 14e8541 · 14e8541
2 parents 0346de3 + f70a4e3
commit 14e8541
Show file tree

Hide file tree

Showing 11 changed files with 17 additions and 64 deletions.
diff --git a/apps/web/src/app.css b/apps/web/src/app.css
@@ -11,6 +11,7 @@
 body {
     @apply bg-neutral-200;
     @apply font-body;
+    @apply overflow-hidden touch-none;
 }
 
 input[type=text],

diff --git a/apps/web/src/lib/components/BorrowModal/BorrowModal.svelte b/apps/web/src/lib/components/BorrowModal/BorrowModal.svelte
diff --git a/apps/web/src/lib/components/BorrowModal/index.ts b/apps/web/src/lib/components/BorrowModal/index.ts
diff --git a/apps/web/src/lib/components/BorrowModal/stores.ts b/apps/web/src/lib/components/BorrowModal/stores.ts
diff --git a/apps/web/src/lib/components/Chooser/Chooser.css b/apps/web/src/lib/components/Chooser/Chooser.css
@@ -1,3 +1,3 @@
 button.chooser-button {
-  @apply px-3 py-1 font-semibold font-display text-left outline-none;
+  @apply px-2 py-1 font-semibold font-display text-left outline-none;
 }
diff --git a/apps/web/src/lib/components/Shell/AppBar.svelte b/apps/web/src/lib/components/Shell/AppBar.svelte
@@ -1,4 +1,4 @@
-<div class="navbar fixed top-0 left-0 right-0 z-50 shadow-lg bg-neutral-100 border-b border-neutral-400">
+<div class="navbar flex-shrink-0 z-50 shadow-lg bg-neutral-100 border-b border-neutral-400">
   <div class="navbar-start lg:pl-4 text-neutral-800 stroke-neutral-800">
     <slot name="start" />
   </div>

diff --git a/apps/web/src/lib/components/Shell/Body.svelte b/apps/web/src/lib/components/Shell/Body.svelte
@@ -0,0 +1,3 @@
+<main class="flex-grow -my-3 pt-6 pb-24 lg:pt-8 px-3 lg:px-0 lg:mx-auto lg:w-3/4 overflow-x-hidden overflow-y-scroll relative">
+  <slot />
+</main>
diff --git a/apps/web/src/lib/components/Shell/Shell.svelte b/apps/web/src/lib/components/Shell/Shell.svelte
@@ -0,0 +1,3 @@
+<div class="flex flex-col w-screen h-screen overflow-hidden">
+	<slot />
+</div>
diff --git a/apps/web/src/lib/components/Shell/index.ts b/apps/web/src/lib/components/Shell/index.ts
@@ -1,3 +1,5 @@
 export { default as AppBar } from "./AppBar.svelte";
+export { default as Body } from "./Body.svelte";
 export { default as BottomNavigation } from "./BottomNavigation.svelte";
-export { default as BottomNavigationItem } from "./BottomNavigationItem.svelte";
+export { default as BottomNavigationItem } from "./BottomNavigationItem.svelte";
+export { default as Shell } from "./Shell.svelte";
diff --git a/apps/web/src/lib/views/CatalogView.svelte b/apps/web/src/lib/views/CatalogView.svelte
@@ -1,5 +1,4 @@
 <script>
-	import BorrowModal from '$lib/components/BorrowModal/BorrowModal.svelte';
 	import { t } from '$lib/language/translate';
 	import { filteredThings } from '$lib/stores/catalog';
 	import CategoryChooserView from './CategoryChooserView.svelte';
@@ -16,7 +15,6 @@
 	<SearchInputView />
 </div>
 <hr class="border-black border-opacity-20 my-6" />
-<BorrowModal />
 {#if $filteredThings.length > 0}
 	<div class="pb-20 lg:pb-0">
 		<ThingsView />

diff --git a/apps/web/src/routes/+layout.svelte b/apps/web/src/routes/+layout.svelte
@@ -1,10 +1,10 @@
 <script>
 	import '../app.css';
 	import { Head } from '$lib/components';
+	import { AppBar, Body, Shell } from '$lib/components/Shell';
 	import BottomNavigationView from '$lib/views/BottomNavigationView.svelte';
 	import HomeButton from '$lib/components/HomeButton.svelte';
 	import { Actions } from '$lib/views/Actions';
-	import { AppBar } from '$lib/components/Shell';
 </script>
 
 <Head
@@ -15,13 +15,13 @@
 	url="https://web.pvdthings.coop"
 	twitterHandle="@pvdthings"
 />
-<main class="flex flex-col w-full min-h-screen">
+<Shell>
 	<AppBar>
 		<HomeButton slot="start" />
 		<Actions slot="end" />
 	</AppBar>
-	<div class="flex-grow pt-24 lg:pt-32 mx-3 lg:mx-auto lg:w-3/4 relative">
+	<Body>
 		<slot />
-	</div>
+	</Body>
 	<BottomNavigationView />
-</main>
+</Shell>