From 1ed955222497464e4ec7afc5d55b863b94e33b1f Mon Sep 17 00:00:00 2001 From: Pier-Jean Malandrino Date: Thu, 2 Apr 2026 16:16:34 +0200 Subject: [PATCH] Dim non-highlighted bboxes in Verify mode for visual consistency Apply the same dimming strategy used in Prepare mode: when an element is highlighted, reduce stroke and fill opacity of all other bboxes so the focused element stands out clearly. --- frontend/src/features/analysis/ui/BboxOverlay.vue | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/frontend/src/features/analysis/ui/BboxOverlay.vue b/frontend/src/features/analysis/ui/BboxOverlay.vue index 6a17dbd..f9ef0d3 100644 --- a/frontend/src/features/analysis/ui/BboxOverlay.vue +++ b/frontend/src/features/analysis/ui/BboxOverlay.vue @@ -118,6 +118,7 @@ function draw(): void { const scale = computeScale(img.clientWidth, img.clientHeight, props.pageData.width, props.pageData.height) + const hasHighlight = props.highlightedIndex >= 0 const hasChunkHighlight = props.highlightedBboxes.length > 0 for (const el of visibleElements.value) { @@ -125,10 +126,8 @@ function draw(): void { const color = ELEMENT_COLORS[el.type] || ELEMENT_COLORS.text const elContentIdx = contentElements.value.indexOf(el) - const isHighlighted = props.highlightedIndex >= 0 && elContentIdx === props.highlightedIndex - - // Dim non-highlighted elements when a chunk is hovered - const dimmed = hasChunkHighlight && !isHighlighted + const isHighlighted = hasHighlight && elContentIdx === props.highlightedIndex + const dimmed = (hasHighlight || hasChunkHighlight) && !isHighlighted ctx.strokeStyle = dimmed ? color + '40' : color ctx.lineWidth = isHighlighted ? 3 : 2