diff --git a/.changeset/gorgeous-singers-invent.md b/.changeset/gorgeous-singers-invent.md new file mode 100644 index 00000000000..29adcebee0e --- /dev/null +++ b/.changeset/gorgeous-singers-invent.md @@ -0,0 +1,5 @@ +--- +'@shopify/polaris': patch +--- + +Restructured `Select` override selectors to patch Sass compilation issue diff --git a/polaris-react/src/components/Select/Select.scss b/polaris-react/src/components/Select/Select.scss index f19582af6d8..0c62b7cba8d 100644 --- a/polaris-react/src/components/Select/Select.scss +++ b/polaris-react/src/components/Select/Select.scss @@ -13,24 +13,17 @@ display: none; } - #{$se23} & { - &:not(.disabled, .error) { - &:hover { - // stylelint-disable-next-line -- se23 - .Backdrop { - border-color: var(--p-color-border-input-hover); - } - } + #{$se23} &:not(.disabled):not(.error) { + // stylelint-disable-next-line -- se23 overrides + &:hover .Backdrop { + border-color: var(--p-color-border-input-hover); + } - // stylelint-disable-next-line -- se23 - .Input:active { - // stylelint-disable-next-line -- se23 - ~ .Backdrop { - border: none; - box-shadow: var(--p-shadow-inset-md); - background-color: var(--p-color-bg-input-active-experimental); - } - } + // stylelint-disable-next-line -- se23 overrides + .Input:active ~ .Backdrop { + border: none; + box-shadow: var(--p-shadow-inset-md); + background-color: var(--p-color-bg-input-active-experimental); } } }