diff --git a/UNRELEASED.md b/UNRELEASED.md index 8ab16cc2402..5288e93cda0 100644 --- a/UNRELEASED.md +++ b/UNRELEASED.md @@ -19,6 +19,7 @@ Use [the changelog guidelines](https://git.io/polaris-changelog-guidelines) to f - Fix bug in Safari where `Button` text is gray instead of white after changing state from disabled to enabled ([#4270](https://github.com/Shopify/polaris-react/pull/4270)) - Bring back borders on the `IndexTable` sticky cells ([#4150](https://github.com/Shopify/polaris-react/pull/4150)) - Adjust `IndexTable` sticky z-index to avoid collisions with focused `TextField` ([#4150](https://github.com/Shopify/polaris-react/pull/4150)) +- Adjust `IndexTable` rows to have a grey hover state when unselected ([#4359](https://github.com/Shopify/polaris-react/pull/4359)) ### Documentation diff --git a/src/components/IndexTable/IndexTable.scss b/src/components/IndexTable/IndexTable.scss index cf1800a0264..5f5ccd43232 100644 --- a/src/components/IndexTable/IndexTable.scss +++ b/src/components/IndexTable/IndexTable.scss @@ -133,7 +133,7 @@ $loading-panel-height: rem(53px); &, .TableCell-first, .TableCell-first + .TableCell { - background-color: var(--p-surface-selected-hovered); + background-color: var(--p-surface-hovered); } } @@ -147,6 +147,15 @@ $loading-panel-height: rem(53px); background-color: var(--p-surface-selected); } } + + &.TableRow-hovered.TableRow-selected { + // stylelint-disable-next-line selector-max-class, selector-max-combinators, selector-max-specificity + &, + .TableCell-first, + .TableCell-first + .TableCell { + background-color: var(--p-surface-selected-hovered); + } + } } .TableRow-subdued {