frontend/src/lib/shared/dashboard/ThemenWidget.svelte

@@ -10,9 +10,12 @@ interface Props {
 	compact?: boolean;
 }
 
+const MAX_VISIBLE_TAGS = 6;
+
 const { tags, compact = false }: Props = $props();
 
 const visibleTags = $derived.by(() => tags.filter(hasAnyDocuments));
+const shownTags = $derived(visibleTags.slice(0, MAX_VISIBLE_TAGS));
 </script>
 
 <section class="rounded-sm border border-line bg-surface p-5 shadow-sm">
@@ -35,7 +38,7 @@ const visibleTags = $derived.by(() => tags.filter(hasAnyDocuments));
 			class="grid gap-2 {compact ? 'grid-cols-1' : 'grid-cols-1 sm:grid-cols-2'}"
 			data-compact={compact}
 		>
-			{#each visibleTags as tag (tag.id)}
+			{#each shownTags as tag (tag.id)}
 				<a
 					href="/?tag={encodeURIComponent(tag.name)}"
 					aria-label="{tag.name}{tag.documentCount > 0