From d314c02d05cea986fe98f0274c9914397e20d5bd Mon Sep 17 00:00:00 2001 From: Giorgio Gilestro Date: Fri, 1 May 2026 14:31:21 +0100 Subject: [PATCH] Picker: lighter annotation bar + room below it Background was nearly black (#181818) which made the bar barely visible against the page. Switched to mid-grey (#555) so the red mark stands out and the bar reads as an interactive element. Added 2rem bottom margin so the tooltip below the mark doesn't crash into the action buttons. Empty (un-annotated) state collapses to zero height so it doesn't add space when there's no mark to show. Co-Authored-By: Claude Opus 4.7 --- scripts/barrier_picker_app/static/index.html | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/scripts/barrier_picker_app/static/index.html b/scripts/barrier_picker_app/static/index.html index 81ca80a..8742fd4 100644 --- a/scripts/barrier_picker_app/static/index.html +++ b/scripts/barrier_picker_app/static/index.html @@ -110,10 +110,11 @@ /* Annotation bar (existing-mark indicator below the video) */ #annotation-bar { position: relative; width: 100%; max-width: 1400px; - height: 18px; background: #181818; border: 1px solid #333; - border-radius: 3px; margin-top: 0.5rem; cursor: pointer; } + height: 18px; background: #555; border: 1px solid #666; + border-radius: 3px; margin: 0.5rem 0 2rem; + cursor: pointer; } #annotation-bar.empty { background: transparent; border-color: transparent; - cursor: default; height: 0.6rem; } + cursor: default; height: 0; margin: 0; } #annotation-bar .mark-line { position: absolute; top: -2px; bottom: -2px; width: 3px; background: #f44; box-shadow: 0 0 4px rgba(255,80,80,0.7); }