Change approach to maintaining spacing of control and help text

WordPress · Nov 12, 2021 · 9f9c022 · 9f9c022
1 parent 49b5f03
commit 9f9c022
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/packages/components/src/tools-panel/styles.ts b/packages/components/src/tools-panel/styles.ts
@@ -8,6 +8,7 @@ import { css } from '@emotion/react';
  */
 import {
 	StyledField as BaseControlField,
+	StyledHelp as BaseControlHelp,
 	Wrapper as BaseControlWrapper,
 } from '../base-control/styles/base-control-styles';
 import { COLORS, CONFIG } from '../utils';
@@ -102,16 +103,15 @@ export const ToolsPanelItem = css`
 	/* Remove BaseControl components margins and leave spacing to grid layout */
 	&& ${ BaseControlWrapper } {
 		margin-bottom: 0;
-		/* The following allows controls with help text to maintain spacing. */
-		/* e.g. ToggleControls. */
-		display: flex;
-		flex-direction: column;
-		row-gap: ${ space( 3 ) };
 
-		${ BaseControlField } {
+		${ BaseControlField }:last-child {
 			margin-bottom: 0;
 		}
 	}
+
+	${ BaseControlHelp } {
+		margin-bottom: 0;
+	}
 `;
 
 export const ToolsPanelItemPlaceholder = css`