2 files changed, 15 insertions, 37 deletions
diff --git a/frontend/src/lib/pills/ComicPills.svelte b/frontend/src/lib/pills/ComicPills.svelte
deleted file mode 100644
index 45c42fd..0000000
--- a/frontend/src/lib/pills/ComicPills.svelte
+++ /dev/null
@@ -1,37 +0,0 @@
-<script lang="ts">
-	import type { ComicFragment } from '$gql/graphql';
-	import AssociationPill from '$lib/pills/AssociationPill.svelte';
-	import TagPill from '$lib/pills/TagPill.svelte';
-
-	let { comic }: { comic: ComicFragment } = $props();
-</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>
diff --git a/frontend/src/lib/pills/FooterPill.svelte b/frontend/src/lib/pills/FooterPill.svelte
new file mode 100644
index 0000000..3da1811
--- /dev/null
+++ b/frontend/src/lib/pills/FooterPill.svelte
@@ -0,0 +1,15 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	interface Props {
+		text: string;
+		icon?: Snippet;
+	}
+
+	let { text, icon }: Props = $props();
+</script>
+
+<div class="flex items-center rounded-sm p-0.5 text-zinc-300">
+	{@render icon?.()}
+	<span>{text}</span>
+</div>