Switch from box icon back to text labels

WordPress · Jul 21, 2022 · 23a403f · 23a403f
1 parent b2f00bc
commit 23a403f
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 12 deletions.
diff --git a/packages/block-editor/src/components/spacing-sizes-control/spacing-input-control.js b/packages/block-editor/src/components/spacing-sizes-control/spacing-input-control.js
@@ -7,13 +7,17 @@ import {
 	RangeControl,
 	CustomSelectControl,
 	__experimentalUnitControl as UnitControl,
-	__experimentalBoxControlIcon as BoxControlIcon,
 	__experimentalHStack as HStack,
 	__experimentalText as Text,
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { settings } from '@wordpress/icons';
 
+/**
+ * Internal dependencies
+ */
+import { LABELS } from './utils';
+
 export default function SpacingInputControl( {
 	spacingSizes,
 	value,
@@ -51,17 +55,7 @@ export default function SpacingInputControl( {
 	return (
 		<>
 			<HStack>
-				<BoxControlIcon
-					side={ side }
-					sides={ [
-						'top',
-						'right',
-						'bottom',
-						'left',
-						'vertical',
-						'horizontal',
-					] }
-				/>
+				<Text>{ LABELS[ side ] }</Text>
 
 				{ spacingSizes.length <= 8 && ! showCustomValueControl && (
 					<Text className="components-spacing-sizes-control__hint">

diff --git a/packages/block-editor/src/components/spacing-sizes-control/style.scss b/packages/block-editor/src/components/spacing-sizes-control/style.scss
@@ -36,6 +36,8 @@
 		.components-unit-control-wrapper {
 			width: 110px;
 			flex-shrink: 0;
+			margin-bottom: 12px;
+			margin-top: 12px;
 		}
 		.components-range-control {
 			flex: 1;