Curator: revise search template (#6160)

* Fix block validation error.

* Remove spacing from button and form.

* Add search heading.

* Fix search button border color issue.

curator/patterns/hidden-search-form.php

@@ -7,4 +7,7 @@
 
 ?>
 
-<!-- wp:search {"label":"","showLabel":false,"placeholder":"<?php echo esc_html__( 'Search', 'curator' ); ?>","buttonUseIcon":true,"borderColor":"foreground"} /-->
+<!-- wp:heading {"textAlign":"center","level":1,"style":{"spacing":{"margin":{"bottom":"4rem"}}}} -->
+<h1 class="has-text-align-center" style="margin-bottom:4rem"><?php echo esc_html__( 'Search', 'curator' ); ?></h1>
+<!-- /wp:heading -->
+<!-- wp:search {"label":"","showLabel":false,"placeholder":"<?php echo esc_html__( 'Search', 'curator' ); ?>","buttonUseIcon":true} /-->

curator/style.css

@@ -102,12 +102,20 @@ body {
 .wp-block-file .wp-block-file__button {
 	background-color: var(--wp--preset--color--foreground);
 	border-radius: 0;
-	border: 1px solid var(--wp--preset--color--foreground);
 	color: var(--wp--preset--color--background);
 	font-size: var(--wp--preset--typography--font-size--normal);
 	padding: calc(0.667em + 2px) calc(1.333em + 2px);
 }
 
+/*
+ * Search input styles
+ * Needed until this is resolved in Gutenberg:
+ * https://github.com/WordPress/gutenberg/issues/34198
+ */
+.wp-block-search__input {
+	border-color: var(--wp--preset--color--foreground);
+}
+
 /*
  * Link Styles
  */

curator/templates/search.html

@@ -6,8 +6,8 @@
 	<!-- wp:group {"layout":{"inherit":true}} -->
 	<div class="wp-block-group">
 	<!-- wp:pattern {"slug":"curator/search-form"} /-->
-	<!-- wp:spacer -->
-	<div style="height:4rem" aria-hidden="true" class="wp-block-spacer"></div>
+	<!-- wp:spacer {"height":"4rem"} -->
+	<div style="height:4rem;" aria-hidden="true" class="wp-block-spacer"></div>
 	<!-- /wp:spacer -->
 	</div>
 	<!-- /wp:group -->

curator/theme.json

@@ -409,6 +409,19 @@
 				"typography": {
 					"fontSize": "var(--wp--preset--font-size--medium)",
 					"lineHeight": "1.6"
+				},
+				"elements": {
+					"button": {
+						"spacing": {
+							"margin": {
+								"left": "0"
+							}
+						},
+						"border": {
+							"color": "var(--wp--preset--color--primary)",
+							"width": "1px"
+						}
+					}
 				}
 			},
 			"core/separator": {