Rainfall: Fix spacing issues (#6284)

* Make post/page titles full width

* remove spacer on single template

* add spacing around the navigation prev and next links

* make the featured image full width

* Add spacing around the post featured image

* align the post date to the bottom of the column

* don't allow date to wrap

* Make the search button padding smaller

rainfall/templates/page-header-black.html

@@ -2,8 +2,8 @@
 <div class="wp-block-group has-white-color has-black-background-color has-text-color has-background has-link-color"><!-- wp:template-part {"slug":"header","tagName":"header"} /-->
 
 <!-- wp:group {"layout":{"inherit":true}} -->
-<div class="wp-block-group"><!-- wp:group {"align":"wide"} -->
-<div class="wp-block-group alignwide"><!-- wp:columns -->
+<div class="wp-block-group"><!-- wp:group {"align":"full"} -->
+<div class="wp-block-group alignfull"><!-- wp:columns -->
 <div class="wp-block-columns"><!-- wp:column {"width":"55rem"} -->
 <div class="wp-block-column" style="flex-basis:55rem"><!-- wp:post-title {"style":{"typography":{"textTransform":"uppercase"}}} /--></div>
 <!-- /wp:column -->
@@ -40,4 +40,4 @@
 <!-- /wp:columns --></div>
 <!-- /wp:group -->
 
-<!-- wp:template-part {"slug":"footer"} /-->
+<!-- wp:template-part {"slug":"footer"} /-->

rainfall/templates/page-no-sidebar.html

@@ -1,8 +1,8 @@
 <!-- wp:template-part {"slug":"header"} /-->
 
 <!-- wp:group {"layout":{"inherit":true}} -->
-<div class="wp-block-group"><!-- wp:group {"align":"wide"} -->
-<div class="wp-block-group alignwide"><!-- wp:columns -->
+<div class="wp-block-group"><!-- wp:group {"align":"full"} -->
+<div class="wp-block-group alignfull"><!-- wp:columns -->
 <div class="wp-block-columns"><!-- wp:column {"width":"55rem"} -->
 <div class="wp-block-column" style="flex-basis:55rem"><!-- wp:post-title {"style":{"typography":{"textTransform":"uppercase"}}} /--></div>
 <!-- /wp:column -->

rainfall/templates/page.html

@@ -1,8 +1,8 @@
 <!-- wp:template-part {"slug":"header"} /-->
 
 <!-- wp:group {"layout":{"inherit":true}} -->
-<div class="wp-block-group"><!-- wp:group {"align":"wide"} -->
-<div class="wp-block-group alignwide"><!-- wp:columns -->
+<div class="wp-block-group"><!-- wp:group {"align":"full"} -->
+<div class="wp-block-group alignfull"><!-- wp:columns -->
 <div class="wp-block-columns"><!-- wp:column {"width":"55rem"} -->
 <div class="wp-block-column" style="flex-basis:55rem"><!-- wp:post-title {"style":{"typography":{"textTransform":"uppercase"}}} /--></div>
 <!-- /wp:column -->
@@ -38,4 +38,4 @@
 <!-- /wp:columns --></div>
 <!-- /wp:group -->
 
-<!-- wp:template-part {"slug":"footer"} /-->
+<!-- wp:template-part {"slug":"footer"} /-->

rainfall/templates/single.html

@@ -1,36 +1,48 @@
 <!-- wp:template-part {"slug":"header"} /-->
 
 <!-- wp:group {"layout":{"inherit":true}} -->
-<div class="wp-block-group"><!-- wp:group {"align":"wide"} -->
-<div class="wp-block-group alignwide"><!-- wp:columns -->
-<div class="wp-block-columns"><!-- wp:column {"width":"55rem"} -->
-<div class="wp-block-column" style="flex-basis:55rem"><!-- wp:post-title {"style":{"typography":{"textTransform":"uppercase"}}} /--></div>
+<div class="wp-block-group"><!-- wp:group {"align":"full"} -->
+<div class="wp-block-group alignfull"><!-- wp:columns -->
+<div class="wp-block-columns"><!-- wp:column {"width":"80%"} -->
+<div class="wp-block-column" style="flex-basis:80%"><!-- wp:post-title {"style":{"typography":{"textTransform":"uppercase"}}} /--></div>
 <!-- /wp:column -->
 
-<!-- wp:column -->
-<div class="wp-block-column"><!-- wp:post-date {"textAlign":"right","format":"M j, Y","style":{"typography":{"textTransform":"uppercase"}}} /--></div>
+<!-- wp:column {"width":"20%","verticalAlignment":"bottom"} -->
+<div class="wp-block-column is-vertically-aligned-bottom" style="flex-basis:20%">
+	<!-- wp:post-date {"textAlign":"right","format":"M j, Y","style":{"typography":{"textTransform":"uppercase"}}} /--></div>
 <!-- /wp:column --></div>
 <!-- /wp:columns --></div>
+<!-- /wp:group --></div>
 <!-- /wp:group -->
 
-<!-- wp:spacer {"height":"12px"} -->
-<div style="height:12px" aria-hidden="true" class="wp-block-spacer"></div>
-<!-- /wp:spacer --></div>
-<!-- /wp:group -->
-
-<!-- wp:post-featured-image /-->
+<!-- wp:spacer {"height":"10px"} -->
+<div style="height:10px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+<!-- wp:post-featured-image {"align":"full"} /-->
+<!-- wp:spacer {"height":"10px"} -->
+<div style="height:10px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
 
 <!-- wp:group {"layout":{"inherit":true}} -->
 <div class="wp-block-group"><!-- wp:columns {"style":{"spacing":{"blockGap":"9.36rem"}}} -->
 <div class="wp-block-columns"><!-- wp:column {"layout":{"inherit":false}} -->
 <div class="wp-block-column"><!-- wp:post-content /-->
 
+<!-- wp:spacer {"height":"10px"} -->
+<div style="height:10px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+
 <!-- wp:group {"layout":{"type":"flex","flexWrap":"nowrap"}} -->
 <div class="wp-block-group"><!-- wp:post-navigation-link {"type":"previous","showTitle":true,"linkLabel":true} /-->
 
 <!-- wp:post-navigation-link {"showTitle":true,"linkLabel":true} /--></div>
-<!-- /wp:group --></div>
-<!-- /wp:column -->
+<!-- /wp:group -->
+
+<!-- wp:spacer {"height":"10px"} -->
+<div style="height:10px" aria-hidden="true" class="wp-block-spacer"></div>
+<!-- /wp:spacer -->
+
+</div><!-- /wp:column -->
 
 <!-- wp:column {"width":"18rem"} -->
 <div class="wp-block-column" style="flex-basis:18rem"><!-- wp:template-part {"slug":"sidebar"} /--></div>
@@ -43,7 +55,8 @@
 <!-- /wp:paragraph -->
 
 <!-- wp:group {"style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}}},"backgroundColor":"black","textColor":"white","layout":{"inherit":true}} -->
-<div class="wp-block-group has-white-color has-black-background-color has-text-color has-background has-link-color"><!-- wp:spacer {"height":"10px"} -->
+<div class="wp-block-group has-white-color has-black-background-color has-text-color has-background has-link-color">
+<!-- wp:spacer {"height":"10px"} -->
 <div style="height:10px" aria-hidden="true" class="wp-block-spacer"></div>
 <!-- /wp:spacer -->
 

rainfall/theme.json

@@ -208,6 +208,10 @@
 						"spacing": {
 							"margin": {
 								"left": "0px"
+							},
+							"padding": {
+								"bottom": "10px",
+								"top": "10px"
 							}
 						}
 					}