Merge pull request #443 from stellarwp/bugfix/row-layout-full-and-wid…

…e-width-when-pattern Style row layout container when pattern applied
stellarwp · Feb 21, 2024 · f3fc910 · f3fc910
2 parents ff6d656 + b525dda
commit f3fc910
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 0 deletions.
diff --git a/src/blocks/rowlayout/editor.scss b/src/blocks/rowlayout/editor.scss
@@ -367,6 +367,24 @@ div.kb-blocks-bg-video {
 // Therefore, let's at least not add any additional margins here.
 // The goal is for the editor to look more like the front-end.
 //.block-editor-block-list__layout .block-editor-block-list__block[data-type="kadence/rowlayout"] > .block-editor-block-list__block-edit,
+.is-root-container > .block-library-block__reusable-block-container.is-reusable {
+	max-width: calc(100vw - 16px);
+	width: 100vw;
+
+	.block-editor-block-list__block {
+		max-width: var(--global-content-width);
+
+		&.alignwide {
+			max-width: var(--global-content-wide-width) !important;
+		}
+
+		&.alignfull {
+			margin: 0 -8px;
+			max-width: calc(100% + 16px)!important;
+		}
+	}
+}
+
 .wp-block-kadence-rowlayout {
 	display: flex;
 	flex-direction: column;

diff --git a/src/blocks/rowlayout/style.scss b/src/blocks/rowlayout/style.scss
@@ -31,6 +31,7 @@
 	padding-left: var(--global-content-edge-padding, 15px);
 	padding-right: var(--global-content-edge-padding, 15px);
 }
+
 .alignfull > .kt-row-layout-inner > .kt-row-column-wrap, .alignfull > .kt-row-column-wrap {
 	padding-left: var(--global-content-edge-padding, 15px);
 	padding-right: var(--global-content-edge-padding, 15px);