diff --git a/UNRELEASED.md b/UNRELEASED.md index d4c8cbf9183..6f69d2feb8b 100644 --- a/UNRELEASED.md +++ b/UNRELEASED.md @@ -10,6 +10,8 @@ ### Bug fixes +- Added an outline on `Banner` for Windows high contrast mode ([#2878](https://github.com/Shopify/polaris-react/pull/2878)) + ### Documentation ### Development workflow diff --git a/src/components/Banner/Banner.scss b/src/components/Banner/Banner.scss index f2af8ab9c02..600b3af5151 100644 --- a/src/components/Banner/Banner.scss +++ b/src/components/Banner/Banner.scss @@ -14,9 +14,7 @@ $secondary-action-horizontal-padding: 1.5 * spacing(tight); box-shadow: var(--p-banner-border, none); @media (-ms-high-contrast: active) { - box-shadow: inset 0 $accent-height 0 0 ms-high-contrast-color('text'), - inset 0 0 border-width(base) border-width(base) - ms-high-contrast-color('text'); + outline: 1px solid; } @if $in-page {