Merge pull request #4465 from Automattic/fix/skatepark-cover-block-spacing

Skatepark: Add custom padding to cover block

skatepark/assets/theme.css

@@ -139,6 +139,11 @@ p {
 	letter-spacing: 0.1em;
 }
 
+.wp-block-cover.alignfull {
+	padding-right: calc( max( 0.5 * ( 100% - var(--wp--custom--layout--wide-size) ) + var(--wp--custom--post-content--padding--left), var(--wp--custom--post-content--padding--left) ));
+	padding-left: calc( max( 0.5 * ( 100% - var(--wp--custom--layout--wide-size) ) + var(--wp--custom--post-content--padding--left), var(--wp--custom--post-content--padding--left) ));
+}
+
 .wp-block-post-comments .reply a {
 	--wp--custom--button--typography--font-size: var(--wp--preset--font-size--normal);
 	border-style: var(--wp--custom--button--border--style);

skatepark/child-theme.json

@@ -270,6 +270,11 @@
 					"textTransform": "uppercase"
 				}
 			},
+			"core/cover": {
+				"spacing": {
+					"padding": "15vh"
+				}
+			},
 			"core/post-date": {
 				"typography": {
 					"fontWeight": "500"

skatepark/sass/blocks/_cover.scss

@@ -0,0 +1,6 @@
+.wp-block-cover {
+	&.alignfull {
+		padding-right: calc( max( 0.5 * ( 100% - var(--wp--custom--layout--wide-size) ) + var(--wp--custom--post-content--padding--left), var(--wp--custom--post-content--padding--left) ));
+		padding-left: calc( max( 0.5 * ( 100% - var(--wp--custom--layout--wide-size) ) + var(--wp--custom--post-content--padding--left), var(--wp--custom--post-content--padding--left) ));
+	}
+}

skatepark/sass/theme.scss

@@ -5,6 +5,7 @@
 @import "blocks/author";
 @import "../../blockbase/sass/blocks/_buttons-outline-style";
 @import "blocks/buttons";
+@import "blocks/cover";
 @import "blocks/post-comments";
 @import "blocks/post-title";
 @import "blocks/query";

skatepark/theme.json

@@ -537,6 +537,11 @@
 					"fontStyle": "normal"
 				}
 			},
+			"core/cover": {
+				"spacing": {
+					"padding": "15vh"
+				}
+			},
 			"core/post-terms": {
 				"typography": {
 					"fontWeight": "500"