blob: 671bbf23eb30b0996a4f46c3ee5d1949f385aaaf (
plain) (
blame)
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
|
<script lang="ts">
import type { ComicFragment } from '$gql/graphql';
import AssociationPill from '$lib/pills/AssociationPill.svelte';
import TagPill from '$lib/pills/TagPill.svelte';
export let comic: ComicFragment;
</script>
<div class="flex flex-col gap-1">
{#if comic.artists.length || comic.circles.length}
<div class="flex flex-wrap gap-1">
{#each comic.artists as { name } (name)}
<AssociationPill {name} type="artist" />
{/each}
{#each comic.circles as { name } (name)}
<AssociationPill {name} type="circle" />
{/each}
</div>
{/if}
{#if comic.characters.length || comic.worlds.length}
<div class="flex flex-wrap gap-1">
{#each comic.worlds as { name } (name)}
<AssociationPill {name} type="world" />
{/each}
{#each comic.characters as { name } (name)}
<AssociationPill {name} type="character" />
{/each}
</div>
{/if}
{#if comic.tags.length}
<div class="flex flex-wrap gap-1">
{#each comic.tags as { name, description } (name)}
<TagPill {name} {description} />
{/each}
</div>
{/if}
</div>
|
