[FA-misc] Should be good

fictionarchive-web-astro/src/lib/components/NovelCard.svelte

@@ -34,6 +34,7 @@
 		TooltipProvider
 	} from '$lib/components/ui/tooltip';
 	import { formatRelativeTime, formatAbsoluteTime } from '$lib/utils/time';
+	import { sanitizeHtml } from '$lib/utils/sanitize';
 
 	let { novel }: NovelCardProps = $props();
 
@@ -44,7 +45,8 @@
 	}
 
 	const title = $derived(pickText(novel.name));
-	const description = $derived(pickText(novel.description));
+	const descriptionRaw = $derived(pickText(novel.description));
+	const descriptionHtml = $derived(sanitizeHtml(descriptionRaw));
 	const coverSrc = $derived(novel.coverImage?.newPath ?? novel.coverImage?.originalPath);
 
 	const latestChapter = $derived(
@@ -87,9 +89,9 @@
 			</CardTitle>
 		</CardHeader>
 		<CardContent class="pt-0 pb-4 space-y-3">
-			<p class="line-clamp-3 text-sm text-muted-foreground" title={description}>
-				{description}
-			</p>
+			<div class="line-clamp-3 text-sm text-muted-foreground" title={descriptionRaw}>
+				{@html descriptionHtml}
+			</div>
 			{#if chapterDisplay || relativeTime}
 				<div class="flex items-center gap-1 text-xs text-muted-foreground/80">
 					{#if chapterDisplay}

fictionarchive-web-astro/src/lib/utils/sanitize.ts

@@ -0,0 +1,12 @@
+import DOMPurify from 'dompurify';
+
+/**
+ * Sanitizes HTML content, allowing only safe inline formatting elements.
+ * Removes scripts, event handlers, iframes, and other risky elements.
+ */
+export function sanitizeHtml(html: string): string {
+	return DOMPurify.sanitize(html, {
+		ALLOWED_TAGS: ['b', 'i', 'em', 'strong', 'br', 'p', 'span'],
+		ALLOWED_ATTR: []
+	});
+}