diff --git a/packages/block-editor/src/components/block-list/style.scss b/packages/block-editor/src/components/block-list/style.scss index b236abdb36a7d3..4b21c753e0a166 100644 --- a/packages/block-editor/src/components/block-list/style.scss +++ b/packages/block-editor/src/components/block-list/style.scss @@ -206,21 +206,6 @@ } } - // Active entity spotlight. - &.has-active-entity:not(.is-focus-mode) { - opacity: 0.5; - transition: opacity 0.1s linear; - @include reduce-motion("transition"); - - &.is-active-entity, - &.has-child-selected, - &:not(.has-child-selected) .block-editor-block-list__block, - &.is-active-entity .block-editor-block-list__block, - .is-active-entity .block-editor-block-list__block { - opacity: 1; - } - } - /** * Block styles and alignments */ diff --git a/packages/block-library/src/template-part/editor.scss b/packages/block-library/src/template-part/editor.scss index 9c1b5275bf4db1..aed32baffd118f 100644 --- a/packages/block-library/src/template-part/editor.scss +++ b/packages/block-library/src/template-part/editor.scss @@ -89,37 +89,3 @@ box-shadow: 0 0 0 $border-width var(--wp-admin-theme-color); } } - -.block-editor-block-list__block[data-type="core/template-part"] { - &.is-selected, - &.has-child-selected { - &::after { - top: $border-width; - bottom: $border-width; - left: $border-width; - right: $border-width; - border-radius: $radius-block-ui - $border-width; // Border is outset, so so subtract the width to achieve correct radius. - } - } - - &.is-selected { - &::after { - // 2px outside. - box-shadow: 0 0 0 $border-width-focus var(--wp-admin-theme-color); - // Show a light color for dark themes. - .is-dark-theme & { - box-shadow: 0 0 0 $border-width-focus $dark-theme-focus; - } - } - } - - &.has-child-selected { - &::after { - box-shadow: 0 0 0 $border-width $gray-300; - - .is-dark-theme & { - box-shadow: 0 0 0 $border-width-focus $gray-700; - } - } - } -} diff --git a/packages/edit-site/src/components/block-editor/style.scss b/packages/edit-site/src/components/block-editor/style.scss index bd84864f61aa1f..909ea6a88f016a 100644 --- a/packages/edit-site/src/components/block-editor/style.scss +++ b/packages/edit-site/src/components/block-editor/style.scss @@ -11,3 +11,50 @@ padding: 6px; } } + +.block-editor-block-list__layout { + &.edit-site-block-editor__block-list { + .block-editor-block-list__block { + &::after { + outline: 2px solid transparent; + } + + &.is-selected { + &::after { + box-shadow: 0 0 0 $border-width $gray-900; // Selected not focussed + top: $border-width; + left: $border-width; + right: $border-width; + bottom: $border-width; + } + + &:focus { + &::after { + box-shadow: 0 0 0 $border-width-focus var(--wp-admin-theme-color); + } + } + } + + &.is-hovered:not(.is-selected) { + cursor: default; + + &::after { + top: $border-width; + left: $border-width; + right: $border-width; + bottom: $border-width; + box-shadow: 0 0 0 $border-width var(--wp-admin-theme-color); + } + } + } + + // Do not display a border on rich text blocks when hovered and selected + .block-editor-rich-text__editable { + &.is-selected.is-hovered.is-typing { + &::after { + box-shadow: none; + } + } + } + } +}