feat: show post cover on article page

src/globals.d.ts

@@ -5,7 +5,7 @@ interface BlogDocument {
 	primaryTags: string[];
 	secondaryTags: string[];
 	blurb: string;
-	image?: string;
+	image: { src: string; alt: string; caption: string };
 	description: string;
 	slug;
 }
@@ -24,5 +24,6 @@ type PostMeta = {
 	cover: {
 		src: string;
 		alt: string;
+		caption: string;
 	};
 };

src/lib/components/Blog/Article.svelte

@@ -23,6 +23,10 @@
 				reverseDateAndRest
 			/>
 		</div>
+		<figure class="w-[80%]">
+			<img src={doc.image.src} alt={doc.image.alt} class="rounded-xl shadow-md" />
+			<figcaption class="mt-2 text-center text-muted-foreground">{doc.image.caption}</figcaption>
+		</figure>
 	</header>
 
 	<div class="markdown-body mb-8 font-serif">

src/routes/blog/[...slug]/+page.svelte

@@ -19,7 +19,8 @@
 		content: data.content,
 		blurb: data.metadata.manifest.blurb,
 		description: data.metadata.manifest.description,
-		slug: data.slug
+		slug: data.slug,
+		image: data.metadata.cover
 	};
 	// $: doc = data.metadata;
 	// $: componentSource = data.metadata.source?.replace('default', $config.style ?? 'default');