From 1cf922ae3a8b7c235cd41a8310143d39ef9ac0bf Mon Sep 17 00:00:00 2001 From: lightbulbman Date: Sat, 5 Sep 2026 01:09:42 +0100 Subject: [PATCH] fix: give the blueprint form items a visible keyboard focus indicator --- src/css/manage/blueprints/_form-layout.scss | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/css/manage/blueprints/_form-layout.scss b/src/css/manage/blueprints/_form-layout.scss index 022b25d32..6218aceec 100644 --- a/src/css/manage/blueprints/_form-layout.scss +++ b/src/css/manage/blueprints/_form-layout.scss @@ -55,7 +55,14 @@ $border-color: #c3c4c7; // The lighter accent reaches only 3.8:1 on this background; the // hover shade clears AA for normal text. color: var(--cs-color-accent-hover); - outline: none; + } + + // The fill alone separates the focused item from its neighbours by + // 1.26:1, so keyboard focus needs a border of its own. Drawn inside the + // item, which sits flush against the ones above and below it. + &:focus-visible { + outline: 2px solid var(--cs-color-accent-hover); + outline-offset: -2px; } &.is-active {