From 5174bd0db8fbc1aa653969611f63778d5d0e6089 Mon Sep 17 00:00:00 2001
From: Jon Staab <shtaab@gmail.com>
Date: Fri, 18 Oct 2024 15:06:21 -0700
Subject: [PATCH] Fix search page

---
 src/app.css                         | 12 ++++++++++++
 src/routes/home/people/+page.svelte | 16 ++++++++--------
 2 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/src/app.css b/src/app.css
index d46f322fd..722437318 100644
--- a/src/app.css
+++ b/src/app.css
@@ -116,6 +116,18 @@
   @apply m-auto w-full max-w-3xl p-4 sm:p-8 md:p-12;
 }
 
+.content-t {
+  @apply pt-4 sm:pt-8 md:pt-12;
+}
+
+.content-b {
+  @apply pb-4 sm:pb-8 md:pb-12;
+}
+
+.content-x {
+  @apply px-4 sm:px-8 md:px-12;
+}
+
 .heading {
   @apply text-center text-2xl;
 }
diff --git a/src/routes/home/people/+page.svelte b/src/routes/home/people/+page.svelte
index 084818137..f8654f550 100644
--- a/src/routes/home/people/+page.svelte
+++ b/src/routes/home/people/+page.svelte
@@ -26,14 +26,14 @@
   })
 </script>
 
-<div class="fixed flex bg-base-200 pt-8 left-8 top-0 right-8 z-feature">
-  <label class="input input-bordered flex w-full items-center gap-2">
-    <Icon icon="magnifer" />
-    <input bind:value={term} class="grow" type="text" placeholder="Search for people..." />
-  </label>
-</div>
-<div class="content column gap-4 !mt-14" bind:this={element}>
-  <div class="flex flex-col gap-2">
+<div class="column max-h-full content-t" bind:this={element}>
+  <div class="flex-grow content-x">
+    <label class="input input-bordered flex w-full items-center gap-2">
+      <Icon icon="magnifer" />
+      <input bind:value={term} class="grow" type="text" placeholder="Search for people..." />
+    </label>
+  </div>
+  <div class="content-b content-x flex flex-col gap-2 overflow-auto pt-2">
     {#each pubkeys.slice(0, limit) as pubkey (pubkey)}
       <PeopleItem {pubkey} />
     {/each}