DateFormatPicker: fix styles & spacing (WordPress#68079)

Co-authored-by: t-hamano <[email protected]> Co-authored-by: fabiankaegy <[email protected]>
MaxMood96 · Dec 18, 2024 · 62de8af · 62de8af
1 parent 287d653
commit 62de8af
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/packages/block-editor/src/components/date-format-picker/index.js b/packages/block-editor/src/components/date-format-picker/index.js
@@ -40,7 +40,11 @@ export default function DateFormatPicker( {
 	onChange,
 } ) {
 	return (
-		<fieldset className="block-editor-date-format-picker">
+		<VStack
+			as="fieldset"
+			spacing={ 4 }
+			className="block-editor-date-format-picker"
+		>
 			<VisuallyHidden as="legend">{ __( 'Date format' ) }</VisuallyHidden>
 			<ToggleControl
 				__nextHasNoMarginBottom
@@ -57,7 +61,7 @@ export default function DateFormatPicker( {
 			{ format && (
 				<NonDefaultControls format={ format } onChange={ onChange } />
 			) }
-		</fieldset>
+		</VStack>
 	);
 }
 

diff --git a/packages/block-editor/src/components/date-format-picker/style.scss b/packages/block-editor/src/components/date-format-picker/style.scss
@@ -1,5 +1,7 @@
 .block-editor-date-format-picker {
-	margin-bottom: $grid-unit-20;
+	margin: 0 0 $grid-unit-20;
+	padding: 0;
+	border: none;
 }
 
 .block-editor-date-format-picker__custom-format-select-control__custom-option {