From 374d607ce15a3cc5077c65df29e1965c11bea85e Mon Sep 17 00:00:00 2001 From: Aneurin Barker Snook Date: Fri, 4 Sep 2026 20:10:12 +0100 Subject: [PATCH] Drop the browser focus ring on form controls, keep the border highlight A global input:focus/textarea:focus/select:focus rule removes the default outline and sets border-color to the accent colour instead -- matching the pattern a few components (.card-row__text, .project-head__title input, .project-head__desc) already used with their own higher-specificity :focus rules, which still take precedence for their extra focus styling (background swap, etc.). This now also covers plain form inputs, the dashboard's project-name textarea, the sidebar's project select, and the inbox/kanban 'new card' inputs, which previously fell back to the browser's default outline. Co-Authored-By: Claude Sonnet 5 --- web/src/style.css | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/web/src/style.css b/web/src/style.css index 5c100c5..0a8285b 100644 --- a/web/src/style.css +++ b/web/src/style.css @@ -34,6 +34,16 @@ box-sizing: border-box; } +/* No browser focus ring on form controls -- the border colour change is + highlight enough (components with more elaborate focus styles, e.g. + .card-row__text, override this with their own higher-specificity rule). */ +input:focus, +textarea:focus, +select:focus { + outline: none; + border-color: var(--accent); +} + body { margin: 0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;