diff --git a/.changeset/ninety-carrots-hammer.md b/.changeset/ninety-carrots-hammer.md new file mode 100644 index 00000000000..97be0e2b82e --- /dev/null +++ b/.changeset/ninety-carrots-hammer.md @@ -0,0 +1,5 @@ +--- +'@shopify/polaris': patch +--- + +Fixed ActionList item overflow and tooltip zIndex diff --git a/polaris-react/src/components/ActionList/ActionList.scss b/polaris-react/src/components/ActionList/ActionList.scss index 592093a2105..b4023720a2a 100644 --- a/polaris-react/src/components/ActionList/ActionList.scss +++ b/polaris-react/src/components/ActionList/ActionList.scss @@ -1,5 +1,8 @@ @import '../../styles/common'; +$indented-item-margin: calc(var(--p-space-5) + var(--p-space-05)); +$indented-item-width: calc(100% - #{$indented-item-margin}); + .Item { // stylelint-disable -- Polaris component custom properties --pc-action-list-item-min-height: var(--p-space-10); @@ -174,8 +177,8 @@ --pc-action-list-image-size: 24px; // stylelint-enable position: relative; - margin-left: calc(var(--p-space-5) + var(--p-space-05)); - max-width: 94%; + margin-left: $indented-item-margin; + max-width: $indented-item-width; &::before { content: '';