diff --git a/packages/block-editor/src/components/block-alignment-matrix-toolbar/style.scss b/packages/block-editor/src/components/block-alignment-matrix-toolbar/style.scss index 46c24c89fbd5b6..1309de2961bfa2 100644 --- a/packages/block-editor/src/components/block-alignment-matrix-toolbar/style.scss +++ b/packages/block-editor/src/components/block-alignment-matrix-toolbar/style.scss @@ -1,7 +1,11 @@ .block-editor-block-alignment-matrix-toolbar__popover { .components-popover__content { min-width: 0; - padding: $grid-unit; width: auto; + + > div { + padding: $grid-unit; + } } + } diff --git a/packages/block-editor/src/components/media-replace-flow/style.scss b/packages/block-editor/src/components/media-replace-flow/style.scss index 212b4bc10fd060..c586d7173a7ada 100644 --- a/packages/block-editor/src/components/media-replace-flow/style.scss +++ b/packages/block-editor/src/components/media-replace-flow/style.scss @@ -7,7 +7,7 @@ // Forcing some space above the list of options in // the dropdown to visually balance them. -.block-editor-media-replace-flow__options .components-popover__content { +.block-editor-media-replace-flow__options .components-popover__content > div { padding-top: $grid-unit-20; } diff --git a/packages/block-library/src/heading/editor.scss b/packages/block-library/src/heading/editor.scss index 522266d9a9a9e3..051a2827139f5d 100644 --- a/packages/block-library/src/heading/editor.scss +++ b/packages/block-library/src/heading/editor.scss @@ -1,10 +1,13 @@ // Remove padding in heading level control popover since the toolbar buttons already have padding. .block-library-heading-level-dropdown .components-popover__content { - padding: 0; // TODO: Find a less hardcoded way of doing this. `max-content` works on // Chromium, but it results in a scrollbar on Safari, and isn't supported // at all in IE11. min-width: 230px; + + > div { + padding: 0; + } } // The dropdown already has a border, so we can remove the one on the heading diff --git a/packages/block-library/src/navigation-link/editor.scss b/packages/block-library/src/navigation-link/editor.scss index 14f2cd2380264c..d6a6c99668c811 100644 --- a/packages/block-library/src/navigation-link/editor.scss +++ b/packages/block-library/src/navigation-link/editor.scss @@ -47,7 +47,7 @@ margin-left: -4px; } -.wp-block-navigation-link__dropdown-content .components-popover__content { +.wp-block-navigation-link__dropdown-content .components-popover__content > div { padding: $grid-unit-10 0; } diff --git a/packages/components/src/autocomplete/style.scss b/packages/components/src/autocomplete/style.scss index bdf0e6fed00807..2b4a585dc50951 100644 --- a/packages/components/src/autocomplete/style.scss +++ b/packages/components/src/autocomplete/style.scss @@ -1,4 +1,4 @@ -.components-autocomplete__popover .components-popover__content { +.components-autocomplete__popover .components-popover__content > div { padding: $grid-unit-20; } diff --git a/packages/components/src/dropdown/style.scss b/packages/components/src/dropdown/style.scss index 5f4b0d355cc12a..3b62c93d2e1a33 100644 --- a/packages/components/src/dropdown/style.scss +++ b/packages/components/src/dropdown/style.scss @@ -2,6 +2,6 @@ display: inline-block; } -.components-dropdown__content .components-popover__content { +.components-dropdown__content .components-popover__content > div { padding: $grid-unit-15; } diff --git a/packages/components/src/tooltip/style.scss b/packages/components/src/tooltip/style.scss index 7fe97ae80e89d2..8ad212c9229709 100644 --- a/packages/components/src/tooltip/style.scss +++ b/packages/components/src/tooltip/style.scss @@ -7,7 +7,6 @@ } .components-tooltip .components-popover__content { - padding: $grid-unit-05 $grid-unit-10; background: $dark-gray-primary; border-radius: $radius-block-ui; border-width: 0; @@ -17,6 +16,10 @@ // This prevents quickly hovering the tooltip from blocking hovering something else. pointer-events: none; + + > div { + padding: $grid-unit-05 $grid-unit-10; + } } .components-tooltip__shortcut { diff --git a/packages/edit-post/src/components/header/style.scss b/packages/edit-post/src/components/header/style.scss index f92b714b0df285..278b5ae3980564 100644 --- a/packages/edit-post/src/components/header/style.scss +++ b/packages/edit-post/src/components/header/style.scss @@ -103,7 +103,7 @@ } .edit-post-post-preview-dropdown { - .components-popover__content { + .components-popover__content > div { padding-bottom: 0; } } diff --git a/packages/editor/src/components/table-of-contents/style.scss b/packages/editor/src/components/table-of-contents/style.scss index c15d6c1c68eb87..baf56fdd9113fc 100644 --- a/packages/editor/src/components/table-of-contents/style.scss +++ b/packages/editor/src/components/table-of-contents/style.scss @@ -8,7 +8,9 @@ .table-of-contents__popover { .components-popover__content { - padding: $grid-unit-20; + > div { + padding: $grid-unit-20; + } @include break-small { max-height: calc(100vh - 120px); diff --git a/packages/format-library/src/text-color/style.scss b/packages/format-library/src/text-color/style.scss index 60ace643487729..f17790f713882a 100644 --- a/packages/format-library/src/text-color/style.scss +++ b/packages/format-library/src/text-color/style.scss @@ -12,7 +12,9 @@ .components-inline-color-popover { .components-popover__content { - padding: 20px 18px; + > div { + padding: 20px 18px; + } .components-color-palette { margin-top: 0.6rem; diff --git a/packages/list-reusable-blocks/src/components/import-dropdown/style.scss b/packages/list-reusable-blocks/src/components/import-dropdown/style.scss index 8c2dc9c94bd71f..c12c7fd4d3f155 100644 --- a/packages/list-reusable-blocks/src/components/import-dropdown/style.scss +++ b/packages/list-reusable-blocks/src/components/import-dropdown/style.scss @@ -1,3 +1,3 @@ -.list-reusable-blocks-import-dropdown__content .components-popover__content { +.list-reusable-blocks-import-dropdown__content .components-popover__content > div { padding: 10px; } diff --git a/packages/nux/src/components/dot-tip/style.scss b/packages/nux/src/components/dot-tip/style.scss index cd75537de3a98b..d1f268be54748b 100644 --- a/packages/nux/src/components/dot-tip/style.scss +++ b/packages/nux/src/components/dot-tip/style.scss @@ -36,9 +36,12 @@ $dot-scale: 3; // How much the pulse animation should scale up by in size } .components-popover__content { - padding: 5px (36px + 5px) 5px 20px; width: 350px; + > div { + padding: 20px 18px; + } + @include break-small { width: 450px; }