Merge branch 'main' into bug/aldevron-299

blocks/herobanner/herobanner.css

@@ -1,10 +1,12 @@
-.module.split-bg::before {
-    background-image: url('../../icons/about-pattern.png');
-}
-
-.herobanner .content .title, .hero-banner .content .description, .hero-banner p {
+/* General styles for .herobanner */
+.herobanner {
+    display: flex;
+    flex-direction: column;
+    position: relative;
+    height: 450px;
+    background-color: var(--primary-color);
     color: #fff;
-    font: normal 16px/1.45 'Proxima Nova A',Helvetica,sans-serif;
+    font: normal 16px/1.45 'Proxima Nova A', Helvetica, sans-serif;
     padding: 15px 0;
 }
 
@@ -13,31 +15,120 @@
     padding: 0 0 15px;
 }
 
-.herobanner .content .button {
+.herobanner button {
+    font: normal 16px/1.45 'Proxima Nova A', Helvetica, sans-serif;
+}
+
+/* Button styles */
+.herobanner .button-container .button {
     background: transparent;
     border: 1px solid #fff;
     color: #fff;
 }
 
-.herobanner .content .button:hover {
+.herobanner .button-container .button:hover {
     background: #fff;
 }
 
-.herobanner button{
-    font: normal 16px/1.45 'Proxima Nova A',Helvetica,sans-serif;
-}
-
+/* Media queries */
 @media (max-width: 1024px) {
     .herobanner h1, .herobanner h2, .herobanner h3, .herobanner h4, .herobanner h5, .herobanner h6 {
         padding: 0;
     }
+
+    .herobanner > div:nth-child(2) {
+        padding-left: 20px;
+        padding-right: 20px;
+        width: auto;
+    }
 }
 
 @media (max-width: 767px) {
-    .module.wide-section .outer {
-        background-image: url('../../icons/about-pattern.png');
+    .herobanner > div:nth-child(1)::after {
+        background: none!important;
+        content: none!important;
+    }
+
+    .herobanner > div:nth-child(2) {
+        padding-top: 30px;
+        padding-bottom: 30px;
+        bottom: auto !important;
+    }
+
+    .herobanner > div:nth-child(2)::after {
+        content: '';
+        background: url('../../icons/about-pattern.png');
         background-position: 100% 50%;
         background-repeat: no-repeat;
-        background-size: auto 130%;
+        height: 100%;
+        position: absolute;
+        right: 0;
+        top: 0;
+        width: 100%;
     }
-}
+
+    .herobanner > div:nth-child(2) > * {
+        padding-left: 0!important;
+        z-index: 1;
+    }
+}
+
+/* Specific styles for .herobanner > div:nth-child(1) */
+.herobanner > div:nth-child(1) picture > img {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    overflow: hidden;
+    height: 100%;
+    width: 100%;
+    object-fit: cover;
+}
+
+.herobanner > div:nth-child(1)::after {
+    background: url('../../icons/about-pattern.png');
+    background-size: auto 100%;
+    content: "";
+    height: 100%;
+    position: absolute;
+    right: 0;
+    top: 0;
+    width: 50%;
+}
+
+/* Specific styles for .herobanner > div:nth-child(2) */
+.herobanner > div:nth-child(2) {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    max-width: 980px;
+    align-items: center;
+    text-align: left;
+    margin: 0 auto;
+    display: flex;
+    color: #fff;
+}
+
+.herobanner > div:nth-child(2) > * {
+    padding-left: calc(50% + 140px);
+}
+
+.herobanner > div:nth-child(2) h1,
+.herobanner > div:nth-child(2) h2,
+.herobanner > div:nth-child(2) h3 {
+    line-height: 1.2;
+    padding: 0;
+    color: white;
+    text-shadow: 0 0 6px rgba(0, 0, 0, 50%);
+}
+
+.herobanner > div:nth-child(2) h1 {
+    font-size: 44px;
+}
+
+.herobanner > div:nth-child(2) h2 {
+    font-size: 32px;
+}

blocks/herobanner/herobanner.js

@@ -1,16 +1 @@
-export default function decorate(block) {
-  const imageContaner = block.children[0];
-  const moduleDiv = document.createElement('div');
-  moduleDiv.classList.add('module', 'mmg-rich-columns', 'padding-all', 'custom-bg', 'bg', 'wide-section', 'split-bg', 'style-standard');
-  moduleDiv.style.backgroundImage = `url(${imageContaner.querySelector('img').src})`;
-  const contentContainer = block.children[1];
-  const outDiv = document.createElement('div');
-  outDiv.classList.add('outer');
-  const contentDiv = document.createElement('div');
-  contentDiv.classList.add('content');
-  outDiv.append(contentDiv);
-  contentDiv.appendChild(contentContainer);
-  moduleDiv.appendChild(outDiv);
-  block.textContent = '';
-  block.appendChild(moduleDiv);
-}
+// hero banner

blocks/table/table.css

@@ -9,10 +9,6 @@
     text-align: left;
 }
 
-.table-plain tr:nth-child(2n) {
-    background-color: #fff;
-}
-
 .table table table {
     margin : 0;
 }

blocks/tabs/tabs.js

@@ -16,6 +16,24 @@ function activeFirstElements(content) {
   listElement.classList.add('active');
 }
 
+function removeEmptyTableRows(tables) {
+  tables.forEach((table) => {
+    const trs = table.querySelectorAll('tr');
+    if (trs.length === 0) return; // No rows in this table, continue to the next one
+
+    trs.forEach((tr) => {
+      const tds = tr.querySelectorAll('td');
+      if (tds.length === 0) return; // No cells in this row, continue to the next row
+
+      const isEmptyRow = Array.from(tds).every((td) => td.innerHTML.trim() === '');
+
+      if (isEmptyRow) {
+        tr.style.display = 'none';
+      }
+    });
+  });
+}
+
 export default function decorate(block) {
   const tabComponent = document.createElement('div');
   tabComponent.className = 'mmg-tabs';
@@ -47,4 +65,6 @@ export default function decorate(block) {
   tabComponent.appendChild(tabContent);
   block.appendChild(tabComponent);
   activeFirstElements(tabComponent);
+  const tables = block.querySelectorAll('table');
+  removeEmptyTableRows(tables);
 }

styles/Typo.css

@@ -404,8 +404,7 @@ h3 a:hover,
 h4 a:hover,
 h5 a:hover,
 h6 a:hover {
-    color: inherit;
-    text-decoration: none;
+    color: var(--primary-color);
 }
 
 hr {
@@ -1938,3 +1937,15 @@ form.hs-form .hs-input[type="checkbox"] {
 .sidebar-navigation a:hover {
     text-decoration: underline!important;
 }
+
+.table-plain tr:nth-child(2n) {
+    background-color: #fff;
+}
+
+.table-clear tr {
+    background-color: transparent!important;
+}
+
+.table-clear td {
+    border: none!important;
+}

styles/responsive.css

@@ -16,8 +16,8 @@
 
 @media (max-width: 1024px) {
     .outer {
-        padding-left: 20px;
-        padding-right: 20px;
+        padding-left: 20px!important;
+        padding-right: 20px!important;
         width: auto
     }
 
@@ -845,8 +845,8 @@
 
 @media (max-width: 479px) {
     .outer {
-        padding-left: 10px;
-        padding-right: 10px
+        padding-left: 10px!important;
+        padding-right: 10px!important;
     }
 
     #logo {

styles/template.css

@@ -160,6 +160,15 @@ body {
     z-index: 2
 }
 
+#menu li.hs-menu-depth-1.active>a::after {
+    border-bottom: 2px solid #ec8f2d;
+    content: "";
+    display: block;
+    margin-top: -6px;
+    transition: all .2s ease;
+    width: 100%
+}
+
 #menu li.hs-menu-depth-1>a::after {
     border-bottom: 2px solid #fff;
     content: "";
@@ -170,7 +179,7 @@ body {
 }
 
 #menu li.hs-menu-depth-1.active-branch>a::after,#menu li.hs-menu-depth-1:hover>a::after {
-    border-color: var(--primary-color);
+    border-color: #ec8f2d;
     width: 100%
 }
 
@@ -1385,7 +1394,7 @@ table.table_orderNested .info_label {
     background: #dbdbdb!important;
     border: 1px solid #dbdbdb!important;
     border-bottom: 0!important;
-    border-radius: 0 10px 0 0;
+    border-radius: 0 10px 0 0!important;
     box-shadow: none;
     box-sizing: border-box;
     color: inherit!important;