summaryrefslogtreecommitdiffstatshomepage
path: root/frontend/src/lib/pills/FooterPill.svelte
diff options
context:
space:
mode:
authorWolfgang Müller2025-02-20 19:33:55 +0100
committerWolfgang Müller2025-02-21 12:12:48 +0100
commite2ea60e3d3b13e0660d9f76daf2e549563bc38d6 (patch)
treee71f78ce198ed7f986f72da3a6caa2cfe5a9e956 /frontend/src/lib/pills/FooterPill.svelte
parent89f71d6d0029b66548acde9c3fc27201482ed2b3 (diff)
downloadhircine-e2ea60e3d3b13e0660d9f76daf2e549563bc38d6.tar.gz
frontend: Introduce ComicCard and ArchiveCard
Instead of repeatedly supplying Card content in all the places it is required, it makes more sense to create dedicated ComicCard and ArchiveCard components. These wrap around Card itself and can be used in a more straightforward and consistent fashion. Whilst we are here, simplify and streamline the display of Comic and Archive metadata by introducing a Card footer. The footer is used for information on page count, release date, and archive size.
Diffstat (limited to 'frontend/src/lib/pills/FooterPill.svelte')
-rw-r--r--frontend/src/lib/pills/FooterPill.svelte15
1 files changed, 15 insertions, 0 deletions
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>