diff --git a/CHANGELOG.txt b/CHANGELOG.txt index c2e811a6ef..9cefeb2312 100644 --- a/CHANGELOG.txt +++ b/CHANGELOG.txt @@ -21,6 +21,7 @@ Changelog * Base project template now populates the meta description tag from the search description field (Aman Pandey) * Added support for `azure-mgmt-cdn` version >= 10 and `azure-mgmt-frontdoor` version >= 1 in the frontend cache invalidator (Sylvain Fankhauser) * Add a system check to warn when a `django-storages` backend is configured to allow overwriting (Rishabh jain) + * Update admin focus outline color to have higher contrast against white backgrounds (Thibaud Colas) * Fix: Make sure workflow timeline icons are visible in high-contrast mode (Loveth Omokaro) * Fix: Ensure authentication forms (login, password reset) have a visible border in Windows high-contrast mode (Loveth Omokaro) * Fix: Ensure visual consistency between buttons and links as buttons in Windows high-contrast mode (Albina Starykova) diff --git a/client/scss/components/_button.scss b/client/scss/components/_button.scss index c38a4aeaa4..0deae4e1b4 100644 --- a/client/scss/components/_button.scss +++ b/client/scss/components/_button.scss @@ -16,6 +16,7 @@ display: inline-block; background-color: $color-button; border: 1px solid $color-button; + outline-offset: $focus-outline-width; color: $color-white; text-decoration: none; white-space: nowrap; diff --git a/client/scss/components/_dropdown.legacy.scss b/client/scss/components/_dropdown.legacy.scss index f55865100d..1009ea4d94 100644 --- a/client/scss/components/_dropdown.legacy.scss +++ b/client/scss/components/_dropdown.legacy.scss @@ -257,6 +257,7 @@ li .button { background-color: $color-white; color: $color-button; + outline-offset: $focus-outline-width; border: 0; &:hover { diff --git a/client/scss/settings/_variables.scss b/client/scss/settings/_variables.scss index e603f5466e..f06a252739 100644 --- a/client/scss/settings/_variables.scss +++ b/client/scss/settings/_variables.scss @@ -73,7 +73,7 @@ $color-link-hover: $color-teal-dark; // The focus outline color is defined without reusing a named color variable // because it shouldn’t be reused for anything else in the UI. -$color-focus-outline: #ffbf47; +$color-focus-outline: #009072; // System Colors $media-forced-colours: active; diff --git a/docs/releases/4.2.md b/docs/releases/4.2.md index 7e0cdd8d48..9d0d22f5da 100644 --- a/docs/releases/4.2.md +++ b/docs/releases/4.2.md @@ -43,6 +43,7 @@ This feature was developed by Jake Howard. * Base project template now populates the meta description tag from the search description field (Aman Pandey) * Added support for `azure-mgmt-cdn` version >= 10 and `azure-mgmt-frontdoor` version >= 1 in the frontend cache invalidator (Sylvain Fankhauser) * Add a system check to warn when a `django-storages` backend is configured to allow overwriting (Rishabh jain) + * Update admin focus outline color to have higher contrast against white backgrounds (Thibaud Colas) ### Bug fixes