From 6dc5e412ed071bfd52b2cd7594fc29e772a31ee7 Mon Sep 17 00:00:00 2001
From: Riad Benguella <benguella@gmail.com>
Date: Mon, 20 Sep 2021 11:28:35 +0100
Subject: [PATCH] Fix color panel

---
 .../colors-gradients/panel-color-gradient-settings.js        | 5 +++--
 packages/block-editor/src/hooks/color-panel.js               | 5 ++++-
 packages/edit-site/src/components/sidebar/color-panel.js     | 1 +
 3 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/packages/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js b/packages/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js
index 008f590db2b4b..36ef7ac2ac1ca 100644
--- a/packages/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js
+++ b/packages/block-editor/src/components/colors-gradients/panel-color-gradient-settings.js
@@ -89,7 +89,7 @@ export const PanelColorGradientSettingsInner = ( {
 	children,
 	settings,
 	title,
-	showTitle,
+	showTitle = true,
 	...props
 } ) => {
 	if (
@@ -121,13 +121,14 @@ export const PanelColorGradientSettingsInner = ( {
 			/>
 		</span>
 	);
+
 	return (
 		<PanelBody
 			className={ classnames(
 				'block-editor-panel-color-gradient-settings',
 				className
 			) }
-			title={ showTitle && titleElement }
+			title={ showTitle ? titleElement : undefined }
 			{ ...props }
 		>
 			{ settings.map( ( setting, index ) => (
diff --git a/packages/block-editor/src/hooks/color-panel.js b/packages/block-editor/src/hooks/color-panel.js
index 25bb3ec859c3f..34cc486ee08df 100644
--- a/packages/block-editor/src/hooks/color-panel.js
+++ b/packages/block-editor/src/hooks/color-panel.js
@@ -2,6 +2,7 @@
  * WordPress dependencies
  */
 import { useState, useEffect } from '@wordpress/element';
+import { __ } from '@wordpress/i18n';
 
 /**
  * Internal dependencies
@@ -19,6 +20,7 @@ export default function ColorPanel( {
 	settings,
 	clientId,
 	enableContrastChecking = true,
+	showTitle = true,
 } ) {
 	const [ detectedBackgroundColor, setDetectedBackgroundColor ] = useState();
 	const [ detectedColor, setDetectedColor ] = useState();
@@ -54,9 +56,10 @@ export default function ColorPanel( {
 	return (
 		<InspectorControls>
 			<PanelColorGradientSettings
+				title={ __( 'Color' ) }
 				initialOpen={ false }
 				settings={ settings }
-				showTitle={ false }
+				showTitle={ showTitle }
 			>
 				{ enableContrastChecking && (
 					<ContrastChecker
diff --git a/packages/edit-site/src/components/sidebar/color-panel.js b/packages/edit-site/src/components/sidebar/color-panel.js
index ddd01fbc0789f..adf9ea969be1a 100644
--- a/packages/edit-site/src/components/sidebar/color-panel.js
+++ b/packages/edit-site/src/components/sidebar/color-panel.js
@@ -123,6 +123,7 @@ export default function ColorPanel( {
 			gradients={ gradients }
 			disableCustomColors={ ! areCustomSolidsEnabled }
 			disableCustomGradients={ ! areCustomGradientsEnabled }
+			showTitle={ false }
 		>
 			<ColorPalettePanel
 				key={ 'color-palette-panel-' + name }