[Block Library - Navigation]: Fix vertical layout

WordPress · Nov 30, 2021 · 20fbbd3 · 20fbbd3
1 parent 2655693
commit 20fbbd3
Showing 1 changed file with 6 additions and 2 deletions.
diff --git a/lib/block-supports/layout.php b/lib/block-supports/layout.php
@@ -96,6 +96,9 @@ function gutenberg_get_layout_style( $selector, $layout, $has_block_gap_support
 		$style .= "flex-wrap: $flex_wrap;";
 		if ( 'horizontal' === $layout_orientation ) {
 			$style .= 'align-items: center;';
+			if ( ! empty( $layout['setCascadingProperties'] ) && $layout['setCascadingProperties'] ) {
+				$style .= '--layout-direction: row;';
+			}
 			/**
 			 * Add this style only if is not empty for backwards compatibility,
 			 * since we intend to convert blocks that had flex layout implemented
@@ -106,20 +109,21 @@ function gutenberg_get_layout_style( $selector, $layout, $has_block_gap_support
 				if ( ! empty( $layout['setCascadingProperties'] ) && $layout['setCascadingProperties'] ) {
 					// --layout-justification-setting allows children to inherit the value regardless or row or column direction.
 					$style .= "--layout-justification-setting: {$justify_content_options[ $layout['justifyContent'] ]};";
-					$style .= '--layout-direction: row;';
 					$style .= "--layout-wrap: $flex_wrap;";
 					$style .= "--layout-justify: {$justify_content_options[ $layout['justifyContent'] ]};";
 					$style .= '--layout-align: center;';
 				}
 			}
 		} else {
 			$style .= 'flex-direction: column;';
+			if ( ! empty( $layout['setCascadingProperties'] ) && $layout['setCascadingProperties'] ) {
+				$style .= '--layout-direction: column;';
+			}
 			if ( ! empty( $layout['justifyContent'] ) && array_key_exists( $layout['justifyContent'], $justify_content_options ) ) {
 				$style .= "align-items: {$justify_content_options[ $layout['justifyContent'] ]};";
 				if ( ! empty( $layout['setCascadingProperties'] ) && $layout['setCascadingProperties'] ) {
 					// --layout-justification-setting allows children to inherit the value regardless or row or column direction.
 					$style .= "--layout-justification-setting: {$justify_content_options[ $layout['justifyContent'] ]};";
-					$style .= '--layout-direction: column;';
 					$style .= '--layout-justify: initial;';
 					$style .= "--layout-align: {$justify_content_options[ $layout['justifyContent'] ]};";
 				}