From 266ca8f36038091857e104d6d5b2e4952f7ca9a5 Mon Sep 17 00:00:00 2001
From: Bernie Reiter <ockham@raz.or.at>
Date: Tue, 30 Jun 2020 23:29:11 +0200
Subject: [PATCH] Edit Site: Allow wide alignment (#23488)

For the Site Editor, we want to allow post content to be inserted at full width (e.g. Cover Blocks). This is currently impossible (see https://github.com/Automattic/wp-calypso/issues/43640) due to two independent problems. This PR fixes them.

1. [Unlike the Post Editor](https://github.com/WordPress/WordPress/blob/f18870ae4e1cb3cd81136424e43c99d705aa2912/wp-admin/edit-form-blocks.php#L286), we're currently not setting `alignWide` in the Site Editor's settings, which becomes a problem here: https://github.com/WordPress/gutenberg/blob/9cd07a92d463377767f56c2b3985badbd363d98f/packages/block-editor/src/hooks/align.js#L173-L196.
2. In order to specifically make the Post Content block full-width, we need to add `align` to its `supports` attribute. (It's still conceivable to use this block at other widths, e.g. in a setting with a sidebar.)

Finally, there remained a 10px padding even after applying these changes. This was fixed by removing block list padding from the Site Editor (a change that had previously been applied to the Post Editor in #22213).
---
 lib/edit-site-page.php                             |  1 +
 packages/block-library/src/post-content/block.json |  1 +
 .../block-library/src/template-part/block.json     |  1 +
 .../src/components/block-editor/style.scss         | 14 --------------
 4 files changed, 3 insertions(+), 14 deletions(-)

diff --git a/lib/edit-site-page.php b/lib/edit-site-page.php
index 837148666319d..7658fe05a5951 100644
--- a/lib/edit-site-page.php
+++ b/lib/edit-site-page.php
@@ -127,6 +127,7 @@ function gutenberg_edit_site_init( $hook ) {
 	}
 
 	$settings = array(
+		'alignWide'              => get_theme_support( 'align-wide' ),
 		'disableCustomColors'    => get_theme_support( 'disable-custom-colors' ),
 		'disableCustomFontSizes' => get_theme_support( 'disable-custom-font-sizes' ),
 		'imageSizes'             => $available_image_sizes,
diff --git a/packages/block-library/src/post-content/block.json b/packages/block-library/src/post-content/block.json
index 215989a2a8feb..dc8ad29ba4d0a 100644
--- a/packages/block-library/src/post-content/block.json
+++ b/packages/block-library/src/post-content/block.json
@@ -6,6 +6,7 @@
 		"postType"
 	],
 	"supports": {
+		"align": true,
 		"html": false
 	}
 }
diff --git a/packages/block-library/src/template-part/block.json b/packages/block-library/src/template-part/block.json
index bd381e4dd073d..bb5146843f7b7 100644
--- a/packages/block-library/src/template-part/block.json
+++ b/packages/block-library/src/template-part/block.json
@@ -13,6 +13,7 @@
 		}
 	},
 	"supports": {
+		"align": true,
 		"html": false
 	}
 }
diff --git a/packages/edit-site/src/components/block-editor/style.scss b/packages/edit-site/src/components/block-editor/style.scss
index 1b273ae401f32..bd84864f61aa1 100644
--- a/packages/edit-site/src/components/block-editor/style.scss
+++ b/packages/edit-site/src/components/block-editor/style.scss
@@ -1,17 +1,3 @@
-.edit-site-block-editor__block-list {
-	padding-bottom: $grid-unit-30;
-	padding-top: $grid-unit-30 + 5;
-
-	padding-left: $block-padding;
-	padding-right: $block-padding;
-
-	// Full-wide. (to account for the padddings added above)
-	.wp-block[data-align="full"] {
-		margin-left: -$block-padding;
-		margin-right: -$block-padding;
-	}
-}
-
 // The button element easily inherits styles that are meant for the editor style.
 // These rules enhance the specificity to reduce that inheritance.
 // This is duplicated in visual-editor.