updated for breadcrumb

hlxsites · Feb 8, 2024 · 9adbbe2 · 9adbbe2
1 parent aab1aed
commit 9adbbe2
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 1 deletion.
diff --git a/scripts/scripts.js b/scripts/scripts.js
@@ -363,7 +363,8 @@ function lazyLoadHiddenPageNavTabs(sections, nameOfFirstSection) {
     : nameOfFirstSection;
 
   sections.forEach((section) => {
-    if (section.getAttribute('aria-labelledby') !== active) {
+    if (!section.className.includes('breadcrumb-container')
+          && section.getAttribute('aria-labelledby') !== active) {
       /*
        It marks all the blocks inside the hidden sections as loaded,
        so Franklin lib will skip them.

diff --git a/styles/styles.css b/styles/styles.css
@@ -2151,6 +2151,21 @@ body.appear {
   padding-right: 0.75rem;
 }
 
+main .\!section:not(.stretch, .product-hero-container) {
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+  padding-top: 4rem;
+  padding-bottom: 4rem;
+}
+
+@media (min-width: 640px) {
+
+  main .\!section:not(.stretch, .product-hero-container) {
+    padding-top: 4rem;
+    padding-bottom: 4rem;
+  }
+}
+
 main .section:not(.stretch, .product-hero-container) {
   padding-left: 1.5rem;
   padding-right: 1.5rem;
@@ -2166,12 +2181,22 @@ main .section:not(.stretch, .product-hero-container) {
   }
 }
 
+main .\!section.carousel-container {
+  padding: 0px;
+}
+
 main .section.carousel-container {
   padding: 0px;
 }
 
 @media (min-width: 768px) {
 
+  main .\!section > div:not(.carousel-wrapper) {
+    margin-left: auto;
+    margin-right: auto;
+    max-width: 80rem;
+  }
+
   main .section > div:not(.carousel-wrapper) {
     margin-left: auto;
     margin-right: auto;
@@ -2640,6 +2665,10 @@ main .section.carousel-container {
   .topic main > .side-nav-container + .section, .topichub main > .side-nav-container + .section {
     padding-top: 1rem;
   }
+
+  .topic main > .side-nav-container + .\!section, .topichub main > .side-nav-container + .\!section {
+    padding-top: 1rem;
+  }
 }
 
 .\!category main .section {
@@ -2652,6 +2681,11 @@ main .section.carousel-container {
   padding-bottom: 2rem;
 }
 
+.category main .\!section {
+  padding-top: 2rem;
+  padding-bottom: 2rem;
+}
+
 @media (min-width: 1280px) {
 
   .\!category .default-content-wrapper p {
@@ -4852,6 +4886,16 @@ main .default-content-wrapper ul {
   }
 }
 
+main .\!section.top-border {
+  margin: auto;
+  margin-top: 2.5rem;
+  max-width: 80rem;
+  border-top-width: 1px;
+  border-style: solid;
+  --tw-border-opacity: 1;
+  border-color: rgb(0 0 0 / var(--tw-border-opacity));
+}
+
 main .section.top-border {
   margin: auto;
   margin-top: 2.5rem;