From 0638de4c60de0d9cf800ca887177b67ba8ad68f0 Mon Sep 17 00:00:00 2001
From: ryelle <ryelle@git.wordpress.org>
Date: Tue, 22 Jun 2021 22:15:57 +0000
Subject: [PATCH] Twenty Nineteen: Update margins on full- and wide-aligned
 blocks in the editor.

Previously, full width blocks would cause a horizontal scrollbar, and nesting full width blocks would cause the content to be pulled off the screen. Now wide and full width blocks can be nested without any visual issues.

Props aleperez92, Boniu91, onemaggie, hellofromTonya.
Fixes #53428.


Built from https://develop.svn.wordpress.org/trunk@51209


git-svn-id: http://core.svn.wordpress.org/trunk@50818 1a063a9b-81f0-0310-95a4-ce76da25c4cd
---
 .../themes/twentynineteen/style-editor.css    | 25 +++++++++++++---
 .../themes/twentynineteen/style-editor.scss   | 29 ++++++++++++++++---
 wp-includes/version.php                       |  2 +-
 3 files changed, 47 insertions(+), 9 deletions(-)

diff --git a/wp-content/themes/twentynineteen/style-editor.css b/wp-content/themes/twentynineteen/style-editor.css
index 274e2851c2..ea254956dd 100644
--- a/wp-content/themes/twentynineteen/style-editor.css
+++ b/wp-content/themes/twentynineteen/style-editor.css
@@ -583,8 +583,8 @@ h6:lang(vi), figcaption:lang(vi),
 /** === Editor Frame === */
 body .wp-block[data-align="full"],
 body .wp-block.alignfull {
-  width: calc(100% + 20px);
-  max-width: calc(100% + 20px);
+  max-width: calc(100% + 16px);
+  width: calc(100% + 16px);
 }
 
 body .wp-block[data-align="left"],
@@ -620,11 +620,19 @@ body .wp-block.aligncenter {
   }
   body .wp-block[data-align="full"],
   body .wp-block.alignfull {
-    width: calc( 125% + 20px);
-    max-width: calc( 125% + 20px);
+    width: calc(125% + 16px);
+    max-width: calc(125% + 16px);
     position: relative;
     left: -12.5%;
   }
+  body .wp-block[data-align="wide"] .wp-block[data-align="full"],
+  body .wp-block[data-align="full"] .wp-block[data-align="full"],
+  body .wp-block.alignwide .wp-block.alignfull,
+  body .wp-block.alignfull .wp-block.alignfull {
+    left: 0;
+    margin-left: 0;
+    margin-right: 0;
+  }
 }
 
 /** === Content Width === */
@@ -1560,3 +1568,12 @@ ul.wp-block-archives li ul,
     width: calc(125% + 120px);
   }
 }
+
+.wp-block-post-template .wp-block[data-align="full"],
+.wp-block-post-template .wp-block.alignfull {
+  left: 0;
+  max-width: 100%;
+  padding-left: 0;
+  padding-right: 0;
+  width: 100%;
+}
diff --git a/wp-content/themes/twentynineteen/style-editor.scss b/wp-content/themes/twentynineteen/style-editor.scss
index 07c352035d..ed06791612 100644
--- a/wp-content/themes/twentynineteen/style-editor.scss
+++ b/wp-content/themes/twentynineteen/style-editor.scss
@@ -13,8 +13,8 @@ body {
 
 	.wp-block[data-align="full"],
 	.wp-block.alignfull {
-		width: calc(100% + 20px);
-		max-width: calc(100% + 20px);
+		max-width: calc(100% + 16px);
+		width: calc(100% + 16px);
 	}
 
 	.wp-block[data-align="left"],
@@ -54,11 +54,20 @@ body {
 
 		.wp-block[data-align="full"],
 		.wp-block.alignfull {
-			width: calc( 125% + 20px );
-			max-width: calc( 125% + 20px );
+			width: calc(125% + 16px);
+			max-width: calc(125% + 16px);
 			position: relative;
 			left: -12.5%;
 		}
+
+		.wp-block[data-align="wide"] .wp-block[data-align="full"],
+		.wp-block[data-align="full"] .wp-block[data-align="full"],
+		.wp-block.alignwide .wp-block.alignfull,
+		.wp-block.alignfull .wp-block.alignfull {
+			left: 0;
+			margin-left: 0;
+			margin-right: 0;
+		}
 	}
 }
 
@@ -971,3 +980,15 @@ $group-block-background__padding: $font__size_base;
 			}
 		}
 	}
+
+.wp-block-post-template {
+
+	.wp-block[data-align="full"],
+	.wp-block.alignfull {
+		left: 0;
+		max-width: 100%;
+		padding-left: 0;
+		padding-right: 0;
+		width: 100%;
+	}
+}
diff --git a/wp-includes/version.php b/wp-includes/version.php
index cb519aa436..17f2e28314 100644
--- a/wp-includes/version.php
+++ b/wp-includes/version.php
@@ -13,7 +13,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '5.8-beta2-51208';
+$wp_version = '5.8-beta2-51209';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.