62 lines
1.8 KiB
Svelte
62 lines
1.8 KiB
Svelte
|
<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>
|