]>
Commit | Line | Data |
---|---|---|
a7cf03c1 | 1 | <script lang="ts"> |
be1ce532 RBR |
2 | import type { Topic } from '$lib/data/types'; |
3 | ||
4 | export let topic: Topic; | |
74b03c33 | 5 | |
58f7d521 | 6 | import { _ } from 'svelte-i18n'; |
a7cf03c1 RBR |
7 | import Post from '$lib/components/post/post.svelte'; |
8 | import { readableTime } from '$lib/utils/readable_time'; | |
bd8e98d7 | 9 | |
852ee620 | 10 | $: remainingTime = new Date(topic.updated_at).getTime() + topic.ttl - Date.now(); |
58f7d521 | 11 | $: remaining = readableTime(remainingTime); |
74b03c33 | 12 | </script> |
66dc4cae | 13 | |
58f7d521 | 14 | <div class="h-entry" title={$_('topic.title')}> |
852ee620 | 15 | <h1 class="py-4 font-bold text-3xl p-name">{topic.title}</h1> |
58f7d521 RBR |
16 | <aside class="topic-meta" title={$_('topic.metadata_title')}> |
17 | {#if topic.forum} | |
47b0bfe4 | 18 | <span class="topic-location"> |
cac85db0 | 19 | {$_('topic.category_location')} |
6ccc6f60 RBR |
20 | <a |
21 | href="/f/{topic.forum.id}" | |
22 | class="p-category underline text-blue-600 visited:text-purple-500" | |
23 | > | |
cac85db0 RBR |
24 | {topic.forum.glyph} |
25 | {$_(topic.forum.label)} | |
26 | </a>. | |
27 | </span> | |
58f7d521 | 28 | {/if} |
47b0bfe4 | 29 | <span class="topic-ttl"> |
6ccc6f60 RBR |
30 | <a |
31 | class="u-url u-uid underline text-blue-600 visited:text-purple-500" | |
32 | title={$_('topic.permalink_title')} | |
33 | href="/t/{topic.id}" | |
34 | > | |
cac85db0 | 35 | ({$_('topic.remaining_time', { |
58f7d521 | 36 | values: { remaining: $_(remaining.label, { values: { count: remaining.count } }) } |
cac85db0 | 37 | })}) |
852ee620 | 38 | </a> |
cac85db0 | 39 | </span> |
58f7d521 | 40 | </aside> |
852ee620 | 41 | {#if topic.tags} |
58f7d521 RBR |
42 | <aside class="topic-tags" title={$_('topic.tags_title')}> |
43 | {$_('topic.tags_location')} | |
44 | {#each topic.tags as tag} | |
852ee620 RBR |
45 | <a href="/g/{tag.tag}" class="p-category underline text-blue-600 visited:text-purple-500"> |
46 | {tag.tag}<span class="tag-weight">({tag.count})</span></a | |
6ccc6f60 | 47 | >{' '} |
58f7d521 RBR |
48 | {/each} |
49 | </aside> | |
50 | {/if} | |
852ee620 | 51 | {#if topic.posts} |
6ccc6f60 RBR |
52 | {#each topic.posts as post, index} |
53 | <Post {post} {index} count={topic.posts.length} /> | |
54 | {/each} | |
852ee620 | 55 | {/if} |
58f7d521 | 56 | </div> |