add comment section stub
This commit is contained in:
parent
da1c2809d9
commit
599075219f
5 changed files with 31 additions and 6 deletions
16
src/lib/CommentSection.svelte
Normal file
16
src/lib/CommentSection.svelte
Normal file
|
|
@ -0,0 +1,16 @@
|
||||||
|
<script lang="ts">
|
||||||
|
import type { CommentEntry } from "./backend";
|
||||||
|
import Centered from "./Centered.svelte";
|
||||||
|
|
||||||
|
|
||||||
|
let comments: null | CommentEntry = $state(null);
|
||||||
|
|
||||||
|
let { post } = $props();
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
{#if comments === null}
|
||||||
|
<Centered>
|
||||||
|
<button class="inline">Show comments</button>
|
||||||
|
</Centered>
|
||||||
|
{/if}
|
||||||
|
|
@ -28,7 +28,7 @@ let { id, title, content = "", votes, my_vote, comment_count } = post;
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.post-frame {
|
.post-frame {
|
||||||
padding-left: 2em;
|
padding-inline-start: 2em;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
.message-stats {
|
.message-stats {
|
||||||
|
|
|
||||||
|
|
@ -13,6 +13,7 @@
|
||||||
import VoteButton from "./VoteButton.svelte";
|
import VoteButton from "./VoteButton.svelte";
|
||||||
import { getMe } from "./globals.svelte";
|
import { getMe } from "./globals.svelte";
|
||||||
import CommentCount from "./CommentCount.svelte";
|
import CommentCount from "./CommentCount.svelte";
|
||||||
|
import CommentSection from "./CommentSection.svelte";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -51,7 +52,7 @@ let { title, id, content = '', to, votes, my_vote, comment_count } = post;
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
|
<CommentSection {post} />
|
||||||
|
|
||||||
{#snippet left()}
|
{#snippet left()}
|
||||||
{#if to.type === 'guild'}
|
{#if to.type === 'guild'}
|
||||||
|
|
@ -78,13 +79,13 @@ let { title, id, content = '', to, votes, my_vote, comment_count } = post;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
}
|
}
|
||||||
.post-body {
|
.post-body {
|
||||||
margin-inline-start: 3em;
|
margin-inline-start: 2em;
|
||||||
}
|
}
|
||||||
.message-stats {
|
.message-stats {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
inset-inline-start: 0;
|
inset-inline-start: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
width: 3em;
|
width: 2em;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,6 @@ let { guild }: { guild: GuildEntry } = $props();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{#if guild}
|
{#if guild}
|
||||||
<AsideCard title={'About ' + (guild.display_name? `${guild.display_name} (+${guild.name})`: `+${guild.name}`)}>
|
<AsideCard title={'About ' + (guild.display_name? `${guild.display_name} (+${guild.name})`: `+${guild.name}`)}>
|
||||||
<ul>
|
<ul>
|
||||||
|
|
|
||||||
|
|
@ -37,6 +37,15 @@ export type PostEntry = {
|
||||||
comment_count?: number | null
|
comment_count?: number | null
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export type CommentEntry = {
|
||||||
|
id: string,
|
||||||
|
parent?: {id: string},
|
||||||
|
locked?: boolean,
|
||||||
|
removed?: number | true,
|
||||||
|
content?: string,
|
||||||
|
created_at: string
|
||||||
|
};
|
||||||
|
|
||||||
export type ServerHealth = {
|
export type ServerHealth = {
|
||||||
version: string,
|
version: string,
|
||||||
name: string,
|
name: string,
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue