initial commit

src/lib/FullPost.svelte

@@ -0,0 +1,62 @@
+<script lang="ts">
+    import { DateTime } from "luxon";
+
+    import { RiHistoryLine, RiHome2Line, RiUserLine } from "svelte-remixicon";
+    import type { PostEntry } from "./backend";
+    import SLayout from "./SLayout.svelte";
+    import GuildAbout from "./GuildAbout.svelte";
+    import UserAbout from "./UserAbout.svelte";
+    import UserMenu from "./UserMenu.svelte";
+    import PostMeta from "./PostMeta.svelte";
+    import GuildMenu from "./GuildMenu.svelte";
+    import { SvelteShowdown } from "svelte-showdown";
+
+
+
+let { post }: { post: PostEntry }  = $props();
+let { title, created_at, id, content = '', to } = post;
+</script>
+
+<SLayout title={to.display_name + (to.type === 'guild' ? ` (+${to.name})` : to.type === 'user' ? ` (@${to.username})` : '')}>
+    <article class="card">
+      <div class="post-frame" id={id}>
+        <div class="post-body">
+          <h1>{title}</h1>
+          <PostMeta {post} />
+          <!-- here go reports -->
+          <!-- here goes removal message -->
+          <div class="post-content">
+            <SvelteShowdown content={ content || "" } />
+            <!-- content, formatted as markdown -->
+          </div>
+        </div><!-- .post-body -->
+        <div class="message-stats">
+          <!-- upvotes / downvotes -->
+        </div>
+        <ul class="message-options row">
+        </ul>
+      </div>
+    </article>
+
+    {#snippet left()}
+      {#if to.type === 'guild'}
+        <GuildMenu guild={to} />
+      {:else if to.type == 'user'}
+        <UserMenu user={to} />
+      {/if}
+    {/snippet}
+
+    {#snippet right()}
+        {#if to.type === 'guild'}
+        <GuildAbout guild={to} />
+        {:else if to.type === 'user'}
+        <UserAbout user={to} />
+        {/if}
+    {/snippet}
+</SLayout>
+
+<style>
+  .post-content {
+    overflow-x: auto;
+  }
+</style>