Move flex layout to group so we can reuse templates from blockbase.

Automattic · Aug 10, 2021 · 9534e37 · 9534e37
1 parent 406d65c
commit 9534e37
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 9 deletions.
diff --git a/skatepark/assets/theme.css b/skatepark/assets/theme.css
diff --git a/skatepark/block-template-parts/header.html b/skatepark/block-template-parts/header.html
@@ -1,3 +1,5 @@
+<!-- wp:group { "layout":{"type":"flex"},"align":"full"} -->
+<div class="wp-block-group">
 <!-- wp:group -->
 <div class="wp-block-group">
 <!-- wp:site-logo /-->
@@ -23,4 +25,6 @@
 
 <!-- wp:social-link {"url":"instagram.com","service":"instagram"} /--></ul>
 <!-- /wp:social-links --></div>
+<!-- /wp:group -->
+</div>
 <!-- /wp:group -->
diff --git a/skatepark/block-templates/index.html b/skatepark/block-templates/index.html
@@ -1,4 +1,4 @@
-<!-- wp:template-part {"slug":"header","tagName":"header","layout":{"type":"flex"},"align":"full"} /-->
+<!-- wp:template-part {"slug":"header","tagName":"header"} /-->
 
 <!-- wp:query {"tagName":"main","queryId":1,"query":{"perPage":10,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","sticky":""}} -->
 <main class="wp-block-query">

diff --git a/skatepark/block-templates/singular.html b/skatepark/block-templates/singular.html
@@ -1,4 +1,4 @@
-<!-- wp:template-part {"slug":"header","tagName":"header","layout":{"type":"flex"},"align":"full"} /-->
+<!-- wp:template-part {"slug":"header","tagName":"header"} /-->
 
 <!-- wp:group {"layout":{"inherit":true}} -->
 <div class="wp-block-group">

diff --git a/skatepark/sass/templates/_header.scss b/skatepark/sass/templates/_header.scss
@@ -1,4 +1,4 @@
-header.wp-block-template-part {
+header.wp-block-template-part > .wp-block-group {
 	align-items: flex-end; // Needed until theme.json layout lets me specify
 	justify-content: space-between; // Apply a cluster (flex?) layout
 	flex-wrap: wrap-reverse;