blob: b0f99e44163da2a38a55af209ecaf935f76a7a64 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
|
<script lang="ts">
import type { Post } from '$lib/data/types';
export let post: Post;
export let index = 0;
export let count = 1;
import { _ } from 'svelte-i18n';
import Glyph from '$lib/components/glyph/glyph.svelte';
const timestampToISO = (timestamp: number) => new Date(timestamp).toISOString();
</script>
<aside
class="post-meta"
title={$_('post.metadata_title', { values: { count: index + 1, total: count } })}
>
<Glyph uuid={post.author_id} />
{#if post.author}
<span class="h-card">
{$_('post.author_credit')}
<a href="/a/{post.author.handle}" class="p-nickname u-url underline text-blue-600 visited:text-purple-500">{post.author.handle}</a>.
</span>
{:else}
<span>????</span>
{/if}
<time role="presentation" class="dt-published" datetime={timestampToISO(post.created_at)}>
<a title={$_('post.permalink_title')} class="underline text-blue-600 visited:text-purple-500" href="/p/{post.id}">
{timestampToISO(post.created_at)}
</a>
</time>
{#if post.topic}
<span>
({$_('post.topic_location')} <a class="text-blue-600 underline visited:text-purple-500" href="/t/{post.topic.id}">{post.topic.title}</a>.)
</span>
{/if}
</aside>
<article
class="e-content whitespace-pre"
title={$_('post.title', {
values: { count: index + 1, total: count, author: post.author?.handle || '????' }
})}
>
{post.text}
</article>
<hr />
<style>
.post-meta * {
vertical-align: top;
}
article {
white-space: pre;
}
</style>
|
