Skip to content

Commit e0151da

Browse files
committed
Restore the block hover and focus styles in Unified Toolbar mode.
1 parent f1e1fd7 commit e0151da

File tree

4 files changed

+6
-19
lines changed

4 files changed

+6
-19
lines changed

packages/editor/src/components/block-list/block.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -427,8 +427,8 @@ export class BlockListBlock extends Component {
427427
// Empty paragraph blocks should always show up as unselected.
428428
const showEmptyBlockSideInserter = ( isSelected || isHovered ) && isEmptyDefaultBlock && isValid;
429429
const showSideInserter = ( isSelected || isHovered ) && isEmptyDefaultBlock;
430-
const shouldAppearSelected = ! isFocusMode && ! hasFixedToolbar && ! showSideInserter && isSelected && ! isTypingWithinBlock;
431-
const shouldAppearHovered = ! isFocusMode && ! hasFixedToolbar && isHovered && ! isEmptyDefaultBlock;
430+
const shouldAppearSelected = ! isFocusMode && ! showSideInserter && isSelected && ! isTypingWithinBlock;
431+
const shouldAppearHovered = ! isFocusMode && isHovered && ! isEmptyDefaultBlock;
432432
// We render block movers and block settings to keep them tabbale even if hidden
433433
const shouldRenderMovers = ! isFocusMode && ( isSelected || hoverArea === 'left' ) && ! showEmptyBlockSideInserter && ! isMultiSelecting && ! isPartOfMultiSelection && ! isTypingWithinBlock;
434434
const shouldShowBreadcrumb = ! isFocusMode && isHovered && ! isEmptyDefaultBlock;

packages/editor/src/components/block-list/breadcrumb.js

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,3 @@
1-
/**
2-
* External dependencies
3-
*/
4-
import classnames from 'classnames';
5-
61
/**
72
* WordPress dependencies
83
*/
@@ -53,12 +48,10 @@ export class BlockBreadcrumb extends Component {
5348
}
5449

5550
render() {
56-
const { clientId, rootClientId, isLight } = this.props;
51+
const { clientId, rootClientId } = this.props;
5752

5853
return (
59-
<div className={ classnames( 'editor-block-list__breadcrumb', {
60-
'is-light': isLight,
61-
} ) }>
54+
<div className={ 'editor-block-list__breadcrumb' }>
6255
<Toolbar>
6356
{ rootClientId && (
6457
<Fragment>
@@ -75,12 +68,11 @@ export class BlockBreadcrumb extends Component {
7568

7669
export default compose( [
7770
withSelect( ( select, ownProps ) => {
78-
const { getBlockRootClientId, getEditorSettings } = select( 'core/editor' );
71+
const { getBlockRootClientId } = select( 'core/editor' );
7972
const { clientId } = ownProps;
8073

8174
return {
8275
rootClientId: getBlockRootClientId( clientId ),
83-
isLight: getEditorSettings().hasFixedToolbar,
8476
};
8577
} ),
8678
] )( BlockBreadcrumb );

packages/editor/src/components/block-list/style.scss

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -899,11 +899,6 @@
899899
}
900900
}
901901

902-
&.is-light .components-toolbar {
903-
background: rgba($white, 0.5);
904-
color: $dark-gray-700;
905-
}
906-
907902
// Position the breadcrumb closer on mobile.
908903
[data-align="left"] &,
909904
[data-align="right"] & {

packages/editor/src/components/post-title/style.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@
4646
}
4747
}
4848

49-
&:not(.is-focus-mode):not(.has-fixed-toolbar) {
49+
&:not(.is-focus-mode) {
5050
&.is-selected .editor-post-title__input {
5151
// use opacity to work in various editor styles
5252
border-color: $dark-opacity-light-500;

0 commit comments

Comments
 (0)