simplified some UI code

src/lib/ui/post/Post.svelte

@@ -88,6 +88,8 @@
     });
 
     let aria_label = post.user.username + '; ' + post.text + '; ' + post.created_at;
+
+    if (post.reply && post.reply.id === undefined) console.log(post);
 </script>
 
 <div class="post-container">

src/routes/+layout.svelte

@@ -0,0 +1,20 @@
+<script>
+    import Navigation from '$lib/ui/Navigation.svelte';
+    import Widgets from '$lib/ui/Widgets.svelte';
+</script>
+
+<div id="spacesocial-app">
+
+    <header>
+        <Navigation />
+    </header>
+
+    <main>
+        <slot></slot>
+    </main>
+
+    <div id="widgets">
+        <Widgets />
+    </div>
+
+</div>

src/routes/+page.svelte

@@ -64,18 +64,11 @@
     }
 </script>
 
-<div id="spacesocial-app">
+{#if logged_in === undefined}
-
-    <header>
-        <Navigation />
-    </header>
-
-    <main>
-        {#if logged_in === undefined}
     <div class="loading throb">
         <span>just a moment...</span>
     </div>
-        {:else if logged_in === false}
+{:else if logged_in === false}
     <form on:submit={log_in} id="login-form">
         <img class="app-icon light-only" src={LogoLight} width="320px" aria-label="Space Social"/>
         <img class="app-icon dark-only" src={LogoDark} width="320px" aria-label="Space Social"/>
@@ -99,7 +92,7 @@
 
         <p class="form-footer">made with ❤️ by <a href="https://arimelody.me">ari melody</a>, 2024</p>
     </form>
-        {:else}
+{:else}
     <header>
         <h1>Home</h1>
         <nav>
@@ -110,14 +103,7 @@
     </header>
 
     <Feed />
-        {/if}
+{/if}
-    </main>
-
-    <div id="widgets">
-        <Widgets />
-    </div>
-
-</div>
 
 <style>
     form#login-form {
@@ -237,18 +223,18 @@
         font-weight: bold;
     }
 
-    main header {
+    header {
         width: 100%;
         margin: 16px 0 8px 0;
         display: flex;
         flex-direction: row;
     }
 
-    main header h1 {
+    header h1 {
         font-size: 1.5em;
     }
 
-    main header nav {
+    header nav {
         margin-left: auto;
         display: flex;
         flex-direction: row;

src/routes/post/+page.js

@@ -0,0 +1,5 @@
+import { error } from '@sveltejs/kit';
+
+export function load(event) {
+    error(404, 'Not Found');
+}

src/routes/post/[id]/+layout.svelte

@@ -1,50 +0,0 @@
-<script>
-    import Navigation from '$lib/ui/Navigation.svelte';
-    import Widgets from '$lib/ui/Widgets.svelte';
-    import Button from '$lib/ui/Button.svelte';
-</script>
-
-<div id="spacesocial-app">
-
-    <header>
-        <Navigation />
-    </header>
-
-    <main>
-        <header>
-            <h1>Home</h1>
-            <nav>
-                <Button centered active>Home</Button>
-                <Button centered disabled>Local</Button>
-                <Button centered disabled>Federated</Button>
-            </nav>
-        </header>
-
-        <slot></slot>
-    </main>
-
-    <div id="widgets">
-        <Widgets />
-    </div>
-
-</div>
-
-<style>
-    main header {
-        width: 100%;
-        margin: 16px 0 8px 0;
-        display: flex;
-        flex-direction: row;
-    }
-
-    main header h1 {
-        font-size: 1.5em;
-    }
-
-    main header nav {
-        margin-left: auto;
-        display: flex;
-        flex-direction: row;
-        gap: 8px;
-    }
-</style>

src/routes/post/[id]/+page.js

@@ -3,9 +3,6 @@ import { Client } from '$lib/client/client.js';
 import { parsePost } from '$lib/client/api.js';
 import { get } from 'svelte/store';
 
-export const prerender = true;
-export const ssr = false;
-
 export async function load({ params }) {
     let client = get(Client.get());
     if (client.app && client.app.token) {

src/routes/post/[id]/+page.svelte

@@ -1,12 +1,22 @@
 <script>
     import '$lib/app.css';
     import Post from '$lib/ui/post/Post.svelte';
+    import Button from '$lib/ui/Button.svelte';
 
     export let data;
     $: main_post = data.posts[0];
     $: replies = data.posts.slice(1);
 </script>
 
+<header>
+    <h1>Home</h1>
+    <nav>
+        <Button centered active>Home</Button>
+        <Button centered disabled>Local</Button>
+        <Button centered disabled>Federated</Button>
+    </nav>
+</header>
+
 <div id="feed" role="feed">
     {#if data.posts.length <= 0}
         <div class="throb">
@@ -24,6 +34,24 @@
 </div>
 
 <style>
+    header {
+        width: 100%;
+        margin: 16px 0 8px 0;
+        display: flex;
+        flex-direction: row;
+    }
+
+    header h1 {
+        font-size: 1.5em;
+    }
+
+    header nav {
+        margin-left: auto;
+        display: flex;
+        flex-direction: row;
+        gap: 8px;
+    }
+
     #feed {
         margin-bottom: 20vh;
     }