From 76ea6f5a539282c218508135dccd3fc8b795d1e6 Mon Sep 17 00:00:00 2001 From: amosblomqvist Date: Fri, 18 Sep 2026 08:41:36 +0300 Subject: [PATCH] fix: kill the UA blue focus outline on question rows (owner round 4) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Tab/arrow focus on quiz/question option buttons and the don't-know row showed Chromium's default focus ring — the abandoned look. outline-none on the row buttons keeps the walk ring (bg-accent/40) as the only focus indicator, so the appearance is identical before and after Tab. --- components/question-dock.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/components/question-dock.tsx b/components/question-dock.tsx index 456ec81..a0adbb0 100644 --- a/components/question-dock.tsx +++ b/components/question-dock.tsx @@ -426,7 +426,7 @@ function QuestionDockForm({ data-kbdrow={i} onClick={() => toggle(i)} className={cn( - "flex items-start gap-3 rounded-lg border px-3 py-2 text-left text-sm transition-colors", + "flex items-start gap-3 rounded-lg border px-3 py-2 text-left text-sm outline-none transition-colors", isSel ? "border-primary bg-accent" : "hover:bg-accent/50", i === kbdIdx && !isSel && "ring-1 ring-border bg-accent/40", )} @@ -467,7 +467,7 @@ function QuestionDockForm({ className={cn( // Option-row layout + radio circle (owner); the dashed // outline stays — this is the deliberate non-answer. - "flex items-start gap-3 rounded-lg border border-dashed px-3 py-2 text-left text-sm transition-colors", + "flex items-start gap-3 rounded-lg border border-dashed px-3 py-2 text-left text-sm outline-none transition-colors", sel.dontKnow ? "border-primary text-foreground" : "text-muted-foreground", kbdIdx === optionCount && !sel.dontKnow && "ring-1 ring-border bg-accent/40", )} @@ -494,7 +494,7 @@ function QuestionDockForm({ data-kbdrow={optionCount} onClick={selectOther} className={cn( - "flex items-start gap-3 rounded-lg border px-3 py-2 text-left text-sm transition-colors", + "flex items-start gap-3 rounded-lg border px-3 py-2 text-left text-sm outline-none transition-colors", sel.otherSelected ? "border-primary bg-accent" : "border-dashed hover:bg-accent/50", kbdIdx === optionCount && !sel.otherSelected && "ring-1 ring-border bg-accent/40", )}