Add: Transparency support on global styles colors (#36840)

WordPress · Nov 29, 2021 · fdc0724 · fdc0724
1 parent 308eff8
commit fdc0724
Show file tree

Hide file tree

Showing 5 changed files with 7 additions and 0 deletions.
diff --git a/packages/block-editor/src/components/colors-gradients/control.js b/packages/block-editor/src/components/colors-gradients/control.js
@@ -44,6 +44,7 @@ function ColorGradientControlInner( {
 	gradientValue,
 	clearable,
 	showTitle = true,
+	enableAlpha,
 } ) {
 	const canChooseAColor =
 		onColorChange && ( ! isEmpty( colors ) || ! disableCustomColors );
@@ -109,6 +110,7 @@ function ColorGradientControlInner( {
 								__experimentalHasMultipleOrigins
 							}
 							clearable={ clearable }
+							enableAlpha={ enableAlpha }
 						/>
 					) }
 					{ ( currentTab === 'gradient' || ! canChooseAColor ) && (

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
@@ -92,6 +92,7 @@ export const PanelColorGradientSettingsInner = ( {
 	title,
 	showTitle = true,
 	__experimentalHasMultipleOrigins,
+	enableAlpha,
 	...props
 } ) => {
 	if (
@@ -143,6 +144,7 @@ export const PanelColorGradientSettingsInner = ( {
 						disableCustomColors,
 						disableCustomGradients,
 						__experimentalHasMultipleOrigins,
+						enableAlpha,
 						...setting,
 					} }
 				/>

diff --git a/packages/edit-site/src/components/global-styles/screen-background-color.js b/packages/edit-site/src/components/global-styles/screen-background-color.js
@@ -104,6 +104,7 @@ function ScreenBackgroundColor( { name } ) {
 				disableCustomGradients={ ! areCustomGradientsEnabled }
 				__experimentalHasMultipleOrigins
 				showTitle={ false }
+				enableAlpha
 			/>
 		</>
 	);

diff --git a/packages/edit-site/src/components/global-styles/screen-link-color.js b/packages/edit-site/src/components/global-styles/screen-link-color.js
@@ -70,6 +70,7 @@ function ScreenLinkColor( { name } ) {
 				disableCustomColors={ ! areCustomSolidsEnabled }
 				__experimentalHasMultipleOrigins
 				showTitle={ false }
+				enableAlpha
 			/>
 		</>
 	);

diff --git a/packages/edit-site/src/components/global-styles/screen-text-color.js b/packages/edit-site/src/components/global-styles/screen-text-color.js
@@ -62,6 +62,7 @@ function ScreenTextColor( { name } ) {
 				disableCustomColors={ ! areCustomSolidsEnabled }
 				__experimentalHasMultipleOrigins
 				showTitle={ false }
+				enableAlpha
 			/>
 		</>
 	);