Be more consistent around margins and padding for the "main" pane

3 files changed, 7 insertions, 15 deletions

diff --git a/ui/lib/components/ActiveChannel.svelte b/ui/lib/components/ActiveChannel.svelte
index f939dbd..ba62d6c 100644
--- a/ui/lib/components/ActiveChannel.svelte
+++ b/ui/lib/components/ActiveChannel.svelte
@@ -4,16 +4,8 @@
   let { messageRuns } = $props();
 </script>
 
-<div class="container">
-  {#each messageRuns as { sender, messages }}
-    <div>
-      <MessageRun {sender} {messages} />
-    </div>
-  {/each}
-</div>
-
-<style>
-  .container {
-    overflow: auto;
-  }
-</style>
+{#each messageRuns as { sender, messages }}
+  <div>
+    <MessageRun {sender} {messages} />
+  </div>
+{/each}
diff --git a/ui/lib/components/MessageRun.svelte b/ui/lib/components/MessageRun.svelte
index b71e972..2e8c613 100644
--- a/ui/lib/components/MessageRun.svelte
+++ b/ui/lib/components/MessageRun.svelte
@@ -9,7 +9,7 @@
 </script>
 
 <div
-  class="card m-4 px-4 py-1 relative"
+  class="card my-4 px-4 py-1 relative"
   class:own-message={ownMessage}
   class:other-message={!ownMessage}
 >
diff --git a/ui/routes/(app)/+layout.svelte b/ui/routes/(app)/+layout.svelte
index 0a8c58d..db400c4 100644
--- a/ui/routes/(app)/+layout.svelte
+++ b/ui/routes/(app)/+layout.svelte
@@ -71,7 +71,7 @@
         <CreateChannelForm />
       </div>
     </nav>
-    <main>
+    <main class="pl-4">
       {@render children?.()}
     </main>
   </div>