From 646674b06a2e7c8dbeed6a147e225cea822aa0a2 Mon Sep 17 00:00:00 2001
From: Marcel <marcel@familienarchiv>
Date: Tue, 24 Mar 2026 11:11:36 +0100
Subject: [PATCH] fix(comments): open panel on annotation creation and enlarge
 comment count pill

- Auto-open AnnotationCommentPanel immediately after drawing a new annotation
- Move comment count pill to bottom-right corner (was centered at bottom)
- Increase pill size: font 11px bold, padding 2px 6px, min-width 20px, drop shadow

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../src/lib/components/AnnotationLayer.svelte     | 15 ++++++++-------
 frontend/src/lib/components/PdfViewer.svelte      |  1 +
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/frontend/src/lib/components/AnnotationLayer.svelte b/frontend/src/lib/components/AnnotationLayer.svelte
index 0321514d..5f8e57f8 100644
--- a/frontend/src/lib/components/AnnotationLayer.svelte
+++ b/frontend/src/lib/components/AnnotationLayer.svelte
@@ -163,20 +163,21 @@ const containerStyle = $derived(
 				<div
 					style="
 					position: absolute;
-					bottom: -14px;
-					left: 50%;
-					transform: translateX(-50%);
+					bottom: -10px;
+					right: -10px;
 					background-color: #002850;
 					color: white;
-					font-size: 10px;
+					font-size: 11px;
 					font-family: sans-serif;
-					padding: 1px 5px;
+					font-weight: 600;
+					padding: 2px 6px;
 					border-radius: 999px;
-					min-width: 16px;
+					min-width: 20px;
 					text-align: center;
 					white-space: nowrap;
 					pointer-events: none;
-					line-height: 16px;
+					line-height: 18px;
+					box-shadow: 0 1px 3px rgba(0,0,0,0.4);
 				"
 				>
 					{commentCounts?.[annotation.id]}
diff --git a/frontend/src/lib/components/PdfViewer.svelte b/frontend/src/lib/components/PdfViewer.svelte
index fc27684d..cd51b52a 100644
--- a/frontend/src/lib/components/PdfViewer.svelte
+++ b/frontend/src/lib/components/PdfViewer.svelte
@@ -217,6 +217,7 @@ async function handleAnnotationDraw(rect: { x: number; y: number; width: number;
 		if (res.ok) {
 			const created: Annotation = await res.json();
 			annotations = [...annotations, created];
+			activeAnnotationId = created.id;
 		}
 	} catch {
 		// ignore