[Themes 1676] Fixed triple-chain large-manual-promo Desktop view (#2141)

* Added display to child-item-grid --------- Co-authored-by: Malavika Koppula <[email protected]>
WPMedia · May 22, 2024 · ab6ca04 · ab6ca04
1 parent 1a82035
commit ab6ca04
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 0 deletions.
diff --git a/.storybook/themes/news.scss b/.storybook/themes/news.scss
@@ -3417,6 +3417,9 @@
 				"triple-chain-child-item": (
 					"gap": var(--global-spacing-6) 0
 				),
+				"triple-chain-child-item-grid": (
+					"display": "grid"
+				),
 				"triple-chain-child-item-empty": (
 					"display": contents
 				),
@@ -4511,6 +4514,9 @@
 				"triple-chain-child-item-empty": (
 					"display": initial
 				),
+				"triple-chain-child-item-grid": (
+					"display": "flex"
+				),
 				"triple-chain-children-grid": (
 					"grid-template-columns": 1fr 1fr 1fr,
 					"gap": 0 var(--global-spacing-5)

diff --git a/blocks/triple-chain-block/_index.scss b/blocks/triple-chain-block/_index.scss
@@ -16,6 +16,11 @@
 			@include scss.block-components("quad-chain-child-item-empty");
 			@include scss.block-properties("quad-chain-child-item-empty");
 		}
+
+		.c-grid {
+			@include scss.block-components("triple-chain-child-item-grid");
+			@include scss.block-properties("triple-chain-child-item-grid");
+		}
 
 		@include scss.block-components("triple-chain-child-item");
 		@include scss.block-properties("triple-chain-child-item");

diff --git a/blocks/triple-chain-block/themes/news.json b/blocks/triple-chain-block/themes/news.json
@@ -30,6 +30,16 @@
 			"desktop": {}
 		}
 	},
+	"triple-chain-child-item-grid": {
+		"styles": {
+			"default": {
+				"display": "grid"
+			},
+			"desktop": {
+				"display": "flex"
+			}
+		}
+	},
 	"triple-chain-child-item-empty": {
 		"styles": {
 			"default": {