Restore the block hover and focus styles in Unified Toolbar mode.

WordPress · Nov 11, 2018 · e0151da · e0151da
1 parent f1e1fd7
commit e0151da
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 19 deletions.
diff --git a/packages/editor/src/components/block-list/block.js b/packages/editor/src/components/block-list/block.js
@@ -427,8 +427,8 @@ export class BlockListBlock extends Component {
 					// Empty paragraph blocks should always show up as unselected.
 					const showEmptyBlockSideInserter = ( isSelected || isHovered ) && isEmptyDefaultBlock && isValid;
 					const showSideInserter = ( isSelected || isHovered ) && isEmptyDefaultBlock;
-					const shouldAppearSelected = ! isFocusMode && ! hasFixedToolbar && ! showSideInserter && isSelected && ! isTypingWithinBlock;
-					const shouldAppearHovered = ! isFocusMode && ! hasFixedToolbar && isHovered && ! isEmptyDefaultBlock;
+					const shouldAppearSelected = ! isFocusMode && ! showSideInserter && isSelected && ! isTypingWithinBlock;
+					const shouldAppearHovered = ! isFocusMode && isHovered && ! isEmptyDefaultBlock;
 					// We render block movers and block settings to keep them tabbale even if hidden
 					const shouldRenderMovers = ! isFocusMode && ( isSelected || hoverArea === 'left' ) && ! showEmptyBlockSideInserter && ! isMultiSelecting && ! isPartOfMultiSelection && ! isTypingWithinBlock;
 					const shouldShowBreadcrumb = ! isFocusMode && isHovered && ! isEmptyDefaultBlock;

diff --git a/packages/editor/src/components/block-list/breadcrumb.js b/packages/editor/src/components/block-list/breadcrumb.js
@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import classnames from 'classnames';
-
 /**
  * WordPress dependencies
  */
@@ -53,12 +48,10 @@ export class BlockBreadcrumb extends Component {
 	}
 
 	render() {
-		const { clientId, rootClientId, isLight } = this.props;
+		const { clientId, rootClientId } = this.props;
 
 		return (
-			<div className={ classnames( 'editor-block-list__breadcrumb', {
-				'is-light': isLight,
-			} ) }>
+			<div className={ 'editor-block-list__breadcrumb' }>
 				<Toolbar>
 					{ rootClientId && (
 						<Fragment>
@@ -75,12 +68,11 @@ export class BlockBreadcrumb extends Component {
 
 export default compose( [
 	withSelect( ( select, ownProps ) => {
-		const { getBlockRootClientId, getEditorSettings } = select( 'core/editor' );
+		const { getBlockRootClientId } = select( 'core/editor' );
 		const { clientId } = ownProps;
 
 		return {
 			rootClientId: getBlockRootClientId( clientId ),
-			isLight: getEditorSettings().hasFixedToolbar,
 		};
 	} ),
 ] )( BlockBreadcrumb );
diff --git a/packages/editor/src/components/block-list/style.scss b/packages/editor/src/components/block-list/style.scss
@@ -899,11 +899,6 @@
 		}
 	}
 
-	&.is-light .components-toolbar {
-		background: rgba($white, 0.5);
-		color: $dark-gray-700;
-	}
-
 	// Position the breadcrumb closer on mobile.
 	[data-align="left"] &,
 	[data-align="right"] & {

diff --git a/packages/editor/src/components/post-title/style.scss b/packages/editor/src/components/post-title/style.scss
@@ -46,7 +46,7 @@
 		}
 	}
 
-	&:not(.is-focus-mode):not(.has-fixed-toolbar) {
+	&:not(.is-focus-mode) {
 		&.is-selected .editor-post-title__input {
 			// use opacity to work in various editor styles
 			border-color: $dark-opacity-light-500;