Merge pull request #367 from siteorigin/boxed-layout-fixed-block-edit…

…or-full-wide Apply wide and full styles to full-width layout
siteorigin · Sep 6, 2020 · 7ef2fa2 · 7ef2fa2
2 parents 4725eae + 0aff557
commit 7ef2fa2
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 15 deletions.
diff --git a/style.css b/style.css
@@ -513,21 +513,25 @@ body {
     margin-bottom: 0;
   }
 }
-.alignfull {
+.layout-full .alignfull {
   margin-left: calc(50% - 50vw);
   width: 100vw;
 }
 @media (min-width: calc(1080px + 200px)) {
-  .alignwide {
+  .layout-full .alignwide {
     left: -100px;
     position: relative;
     width: calc(100% + 20vw);
   }
 }
-.alignfull .wp-block-group__inner-container {
+.layout-full .alignfull .wp-block-group__inner-container {
   margin: auto;
   max-width: 1080px;
 }
+.layout-boxed .alignfull {
+  margin-right: -35px;
+  margin-left: -35px;
+}
 .entry-content > div[class^='wp-block-'] {
   margin-bottom: 25px;
 }

diff --git a/style.less b/style.less
@@ -349,23 +349,34 @@ body {
 }
 
 // Block Editor Wide and Full widths.
-.alignfull {
-	margin-left: calc(50% - 50vw);
-	width: 100vw;
-}
+.layout-full {
+
+	.alignfull {
+		margin-left: calc(50% - 50vw);
+		width: 100vw;
+	}
 
-@media (min-width: calc(1080px + 200px)) {
+	@media (min-width: calc(1080px + 200px)) {
 
-	.alignwide {
-		left: -100px;
-		position: relative;
-		width: calc(100% + 20vw);
+		.alignwide {
+			left: -100px;
+			position: relative;
+			width: calc(100% + 20vw);
+		}
+	}
+
+	.alignfull .wp-block-group__inner-container {
+		margin: auto;
+		max-width: 1080px;
 	}
 }
 
-.alignfull .wp-block-group__inner-container {
-	margin: auto;
-	max-width: 1080px;
+.layout-boxed {
+
+	.alignfull {
+		margin-right: -35px;
+		margin-left: -35px;
+	}
 }
 
 // Apply 25px bottom margin to top level blocks.