From b03f86789e1552bbf04b284862011fb09dcc5e03 Mon Sep 17 00:00:00 2001
From: Ari Stathopoulos <aristath@gmail.com>
Date: Fri, 19 Mar 2021 11:21:58 +0200
Subject: [PATCH] Implement layout from config

See https://github.com/WordPress/gutenberg/pull/29335
---
 block-templates/404.html    | 10 +++++++-
 block-templates/index.html  |  2 +-
 block-templates/single.html |  4 ++++
 experimental-theme.json     |  4 ++++
 styles/layout-editor.css    |  3 ---
 styles/layout.css           | 46 +------------------------------------
 6 files changed, 19 insertions(+), 50 deletions(-)
 delete mode 100644 styles/layout-editor.css

diff --git a/block-templates/404.html b/block-templates/404.html
index 2941a75..d1b522e 100644
--- a/block-templates/404.html
+++ b/block-templates/404.html
@@ -1,3 +1,8 @@
+<!-- wp:template-part {"slug":"header"} /-->
+
+<!-- wp:group {"tagName":"main","layout":{"inherit":true}} -->
+<div class="wp-block-group"><div class="wp-block-group__inner-container">
+
 <!-- wp:heading {"level":1,"fontSize":"enormous"} -->
 <h1>404</h1>
 <!-- /wp:heading -->
@@ -6,4 +11,7 @@ <h1>404</h1>
 <p>We could not find the content you requested.</p>
 <!-- /wp:paragraph -->
 
-<!-- wp:search {"label":"Search","buttonText":"Search"} /-->
\ No newline at end of file
+<!-- wp:search {"label":"Search","buttonText":"Search"} /-->
+
+</div>
+<!-- /wp:group -->
\ No newline at end of file
diff --git a/block-templates/index.html b/block-templates/index.html
index 633f2e9..594d95c 100644
--- a/block-templates/index.html
+++ b/block-templates/index.html
@@ -1,6 +1,6 @@
 <!-- wp:template-part {"slug":"header","tagName":"header"} /-->
 
-<!-- wp:group {"tagName":"main"} -->
+<!-- wp:group {"tagName":"main","layout":{"inherit":true}} -->
 <div class="wp-block-group"><div class="wp-block-group__inner-container"><!-- wp:query {"queryId":0,"query":{"perPage":10,"pages":0,"offset":0,"postType":"post","categoryIds":[],"tagIds":[],"order":"desc","orderBy":"date","author":"","search":"","exclude":[],"sticky":"","inherit":true}} -->
 <!-- wp:query-loop -->
 <!-- wp:post-title {"isLink":true} /-->
diff --git a/block-templates/single.html b/block-templates/single.html
index e131d89..765ea67 100644
--- a/block-templates/single.html
+++ b/block-templates/single.html
@@ -1,5 +1,7 @@
 <!-- wp:template-part {"slug":"header"} /-->
 
+<!-- wp:group {"tagName":"main","layout":{"inherit":true}} -->
+<div class="wp-block-group"><div class="wp-block-group__inner-container">
 <!-- wp:post-title {"level":1} /-->
 
 <!-- wp:post-featured-image /-->
@@ -11,5 +13,7 @@
 <!-- wp:post-comments /-->
 
 <!-- wp:post-comments-form /-->
+</div>
+<!-- /wp:group -->
 
 <!-- wp:template-part {"slug":"footer"} /-->
\ No newline at end of file
diff --git a/experimental-theme.json b/experimental-theme.json
index 1955918..fc202d2 100644
--- a/experimental-theme.json
+++ b/experimental-theme.json
@@ -1,6 +1,10 @@
 {
 	"settings": {
 		"defaults": {
+			"layout": {
+				"contentSize": "var(--wp--custom--content--default-width))",
+				"wideSize": "var(--wp--custom--content--wide-width))"
+			},
 			"custom": {
 				"typo": {
 					"rootSize": 16,
diff --git a/styles/layout-editor.css b/styles/layout-editor.css
deleted file mode 100644
index 75ed6e1..0000000
--- a/styles/layout-editor.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.wp-block {
-	max-width: var(--wp--custom--content--default-width);
-}
diff --git a/styles/layout.css b/styles/layout.css
index fe76971..e945f49 100644
--- a/styles/layout.css
+++ b/styles/layout.css
@@ -2,20 +2,6 @@
 	padding: 0 var(--wp--custom--content--padding);
 }
 
-.wp-site-blocks > *:not(.wp-block-post-content),
-.wp-site-blocks .wp-block-post-content > * {
-	max-width: var(--wp--custom--content--default-width);
-	margin-left: auto;
-	margin-right: auto;
-}
-
-.wp-site-blocks .alignwide {
-	width: var(--wp--custom--content--wide-width);
-	max-width: 100%;
-	margin-left: auto;
-	margin-right: auto;
-}
-
 .wp-site-blocks .alignfull {
 	transform: translateX(calc(0px - var(--wp--custom--content--padding)));
 	width: calc(100% + 2 * var(--wp--custom--content--padding));
@@ -27,29 +13,6 @@
 	text-align: center;
 }
 
-.alignleft,
-.alignright,
-.wp-site-blocks .wp-block-post-content .alignleft,
-.wp-site-blocks .wp-block-post-content .alignright {
-	max-width: calc(var(--wp--custom--content--default-width) / 2);
-}
-
-.alignleft,
-.wp-site-blocks .wp-block-post-content .alignleft {
-	float: left;
-
-	/* margin-left: calc(50% - var(--wp--custom--content--default-width) / 2); */
-	margin-right: 1em;
-}
-
-.alignright,
-.wp-site-blocks .wp-block-post-content .alignright {
-	float: right;
-
-	/* margin-right: calc(50% - var(--wp--custom--content--default-width) / 2); */
-	margin-left: 1em;
-}
-
 .has-background {
 	padding: var(--wp--custom--content--padding);
 }
@@ -70,13 +33,6 @@ Start fix for bug: https://github.com/WordPress/gutenberg/issues/25610
 	box-sizing: content-box;
 }
 
-.wp-site-blocks .wp-block-template-part > .wp-block-template-part:not(.alignfull) {
-	max-width: var(--wp--custom--content--default-width);
-	transform: translateX(calc(0px + var(--wp--custom--content--padding)));
-	margin-left: auto;
-	margin-right: auto;
-}
-
 .wp-site-blocks .wp-block-template-part > .wp-block-template-part.alignfull {
 	transform: none;
 }
@@ -87,4 +43,4 @@ Start fix for bug: https://github.com/WordPress/gutenberg/issues/25610
 }
 /*
 End fix for bug: https://github.com/WordPress/gutenberg/issues/25610
-*/
\ No newline at end of file
+*/