adjustements

Netcentric · Nov 27, 2023 · e01036b · e01036b
1 parent 4f370e8
commit e01036b
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 4 deletions.
diff --git a/blocks/v2-icon-cards/v2-icon-cards.css b/blocks/v2-icon-cards/v2-icon-cards.css
@@ -1,3 +1,11 @@
+.redesign-v2 .section .v2-icon-cards-wrapper {
+  padding: 0;
+}
+
+.v2-icon-cards:not(.v2-icon-cards--4-cols) {
+  padding: var(--section-div-padding);
+}
+
 .v2-icon-cards__row {
   flex-direction: column;
   display: flex;
@@ -110,4 +118,42 @@
     padding: 20px 40px;
     background: var(--c-primary-white);
   }
-}
+}
+
+.v2-icon-cards--4-cols .v2-icon-cards__column {
+  max-width: unset;
+  width: 100%;
+  gap: 0;
+  padding: 20px 40px;
+}
+
+.v2-icon-cards--4-cols .v2-icon-cards__row {
+  gap: 0;
+}
+
+.v2-icon-cards--4-cols .icon {
+  margin-bottom: 16px;
+}
+
+.v2-icon-cards--4-cols .v2-icon-cards__heading {
+  font-size: 13px;
+  margin-bottom: 8px;
+}
+
+.v2-icon-cards--4-cols .v2-icon-cards__body {
+  font-size: 13px;
+  margin-bottom: 0;
+}
+
+.v2-icon-cards__column--extra-col .v2-icon-cards__body {
+  margin-bottom: 8px;
+  border-bottom: 1px solid var(--c-accent-copper);
+}
+
+.v2-icon-cards--4-cols .v2-icon-cards__body:last-of-type {
+  margin-bottom: 0;
+}
+
+.v2-icon-cards--4-cols .v2-icon-cards__column--extra-col {
+  background-color: var(--c-primary-gold);
+}
diff --git a/blocks/v2-icon-cards/v2-icon-cards.js b/blocks/v2-icon-cards/v2-icon-cards.js
@@ -10,12 +10,13 @@ export default async function decorate(block) {
     row.classList.add(`${blockName}__row`);
   });
 
-  // const hasExtraColumn = columns.length === 4;
-  if (columns.length === 4) block.classList.add(`${blockName}--4-cols`);
+  const hasExtraColumn = columns.length === 4;
+  if (hasExtraColumn) block.classList.add(`${blockName}--4-cols`);
 
   columns.forEach((col, idx) => {
+    const isExtraColumn = idx === 3;
     col.classList.add(`${blockName}__column`);
-    if (idx === 3) col.classList.add(`${blockName}__column--extra-col`);
+    if (isExtraColumn) col.classList.add(`${blockName}__column--extra-col`);
 
     const allTextElmts = col.querySelectorAll('p');
     const bodyElmts = [];