From 0ef53546891074aff2d0135bfaead3c27bd24a8f Mon Sep 17 00:00:00 2001 From: Aki Hamano Date: Thu, 25 Jul 2024 22:02:41 +0900 Subject: [PATCH 1/2] Post Editor: Prevent popover from being hidden by metabox --- packages/edit-post/src/components/layout/style.scss | 5 +++++ packages/edit-site/src/components/editor/style.scss | 5 +++++ packages/editor/src/components/visual-editor/style.scss | 2 -- 3 files changed, 10 insertions(+), 2 deletions(-) diff --git a/packages/edit-post/src/components/layout/style.scss b/packages/edit-post/src/components/layout/style.scss index 5fdaceaa002be..47f277bea3671 100644 --- a/packages/edit-post/src/components/layout/style.scss +++ b/packages/edit-post/src/components/layout/style.scss @@ -3,6 +3,11 @@ clear: both; } +.edit-post-layout .interface-interface-skeleton__body { + // Make this a stacking context to contain the z-index of children elements. + isolation: isolate; +} + // Adjust the position of the notices .components-editor-notices__snackbar { position: fixed; diff --git a/packages/edit-site/src/components/editor/style.scss b/packages/edit-site/src/components/editor/style.scss index b157057062c9d..28360b6864052 100644 --- a/packages/edit-site/src/components/editor/style.scss +++ b/packages/edit-site/src/components/editor/style.scss @@ -3,6 +3,11 @@ transition: opacity 0.1s ease-out; @include reduce-motion("transition"); + .interface-interface-skeleton__body { + // Make this a stacking context to contain the z-index of children elements. + isolation: isolate; + } + &.is-loading { opacity: 0; } diff --git a/packages/editor/src/components/visual-editor/style.scss b/packages/editor/src/components/visual-editor/style.scss index 2d7ed665a957f..18a61827d573d 100644 --- a/packages/editor/src/components/visual-editor/style.scss +++ b/packages/editor/src/components/visual-editor/style.scss @@ -2,8 +2,6 @@ position: relative; display: block; background-color: $gray-300; - // Make this a stacking context to contain the z-index of children elements. - isolation: isolate; // Centralize the editor horizontally (flex-direction is column). align-items: center; From 89eb0bb2856fea2aed80f975a3aa84d9b6136b8f Mon Sep 17 00:00:00 2001 From: Aki Hamano Date: Fri, 26 Jul 2024 17:23:42 +0900 Subject: [PATCH 2/2] Use `.interface-interface-skeleton__content` instead of `.interface-interface-skeleton__body` --- packages/edit-post/src/components/layout/style.scss | 5 ----- packages/edit-site/src/components/editor/style.scss | 5 ----- packages/editor/src/components/editor-interface/style.scss | 5 +++++ 3 files changed, 5 insertions(+), 10 deletions(-) diff --git a/packages/edit-post/src/components/layout/style.scss b/packages/edit-post/src/components/layout/style.scss index 47f277bea3671..5fdaceaa002be 100644 --- a/packages/edit-post/src/components/layout/style.scss +++ b/packages/edit-post/src/components/layout/style.scss @@ -3,11 +3,6 @@ clear: both; } -.edit-post-layout .interface-interface-skeleton__body { - // Make this a stacking context to contain the z-index of children elements. - isolation: isolate; -} - // Adjust the position of the notices .components-editor-notices__snackbar { position: fixed; diff --git a/packages/edit-site/src/components/editor/style.scss b/packages/edit-site/src/components/editor/style.scss index 28360b6864052..b157057062c9d 100644 --- a/packages/edit-site/src/components/editor/style.scss +++ b/packages/edit-site/src/components/editor/style.scss @@ -3,11 +3,6 @@ transition: opacity 0.1s ease-out; @include reduce-motion("transition"); - .interface-interface-skeleton__body { - // Make this a stacking context to contain the z-index of children elements. - isolation: isolate; - } - &.is-loading { opacity: 0; } diff --git a/packages/editor/src/components/editor-interface/style.scss b/packages/editor/src/components/editor-interface/style.scss index 77f621acc9351..05b23fe2304dd 100644 --- a/packages/editor/src/components/editor-interface/style.scss +++ b/packages/editor/src/components/editor-interface/style.scss @@ -2,6 +2,11 @@ height: $header-height + $border-width; } +.editor-editor-interface .interface-interface-skeleton__content { + // Make this a stacking context to contain the z-index of children elements. + isolation: isolate; +} + .editor-visual-editor { flex: 1 0 auto; }