From 8acaef28e2795e569fdf4687bd563c97f70d2eee Mon Sep 17 00:00:00 2001 From: Alex Date: Wed, 21 Oct 2026 11:06:52 +0200 Subject: [PATCH] fix(idp): show keyboard focus on every control (#3732) * fix(idp): show keyboard focus on primary buttons * fix(idp): show keyboard focus on every control --- services/idp/src/app.css | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/services/idp/src/app.css b/services/idp/src/app.css index f6fd9319f8..df183ad125 100644 --- a/services/idp/src/app.css +++ b/services/idp/src/app.css @@ -113,6 +113,7 @@ strong { .oc-input:focus { outline: 2px solid #e2baff; + outline-offset: 0; border: 1px solid #fff; } @@ -153,6 +154,21 @@ strong { font-weight: 700 !important; } +/* + * Keyboard focus for every control. Material UI shows it with its ripple and + * box-shadow, which are both switched off in this file. + */ +body :focus-visible { + outline: 2px solid #20434f; + outline-offset: 2px; +} + +/* the logo link sits on the background, which can be dark or a light image */ +.oc-logo-container:focus-visible { + outline-color: #fff; + box-shadow: 0 0 0 6px #20434f; +} + .oc-button-secondary { /* Needs to be important to overwrite material-ui */ width: 100%;