Merge pull request #52 from adobecom/gnav

Adds initial Gnav (gnav will change again soon when it's definitely authored)
adobecom · Sep 11, 2024 · 1d6d4d6 · 1d6d4d6
2 parents 1df3531 + 6f0e4e9
commit 1d6d4d6
Show file tree

Hide file tree

Showing 11 changed files with 855 additions and 973 deletions.
diff --git a/express/blocks/blog-posts/blog-posts.css b/express/blocks/blog-posts/blog-posts.css
@@ -13,6 +13,10 @@ main .section:has(.blog-posts-wrapper) > .content:first-child, main .section > .
     padding-top: 60px
 }
 
+main .section:has(.blog-posts-wrapper) div > h3:first-child  {
+    margin-top: 0px
+}
+
 .blog main .section:has(.blog-posts-wrapper) > div > h2, main .section:has(.blog-posts) div.blog-posts-decoration {
     max-width: 280px;
 }

diff --git a/express/blocks/faq/faq.css b/express/blocks/faq/faq.css
@@ -8,7 +8,9 @@
 
 .section:has(.faq) > div {
   margin: auto;
-  padding: 0 24px;
+  padding-top: 0;
+  padding-right: 24px;
+  padding-left: 24px;
   max-width: 375px;
 }
 
@@ -23,6 +25,7 @@
 
 .faq {
   text-align: left;
+  padding-bottom: 80px;
 }
 
 .faq .faq-accordion {
@@ -71,7 +74,9 @@
 
 @media (min-width: 900px) {
   .section:has(.faq) > div {
-    padding: 0 56px;
+    padding-top: 0;
+    padding-right: 56px;
+    padding-left: 56px;
     max-width: 830px;
   }
 

diff --git a/express/blocks/fullscreen-marquee/fullscreen-marquee.css b/express/blocks/fullscreen-marquee/fullscreen-marquee.css
@@ -248,6 +248,13 @@
   padding-right: 10px;
 }
 
+/* disable budoux on small screens  */
+@media (max-width: 600px) {
+  h1.budoux {
+    word-break: normal;
+  }
+}
+
 @media (min-width: 900px) {
   .section > .fullscreen-marquee {
     padding-bottom: 40px;

diff --git a/express/blocks/how-to-steps-carousel/how-to-steps-carousel.css b/express/blocks/how-to-steps-carousel/how-to-steps-carousel.css
@@ -145,7 +145,7 @@
   margin-bottom: 0;
 }
 
-.how-to-steps-carousel .tip-text h3 {
+main .how-to-steps-carousel .tip-text h3 {
   margin-bottom: 16px;
   font-size: var(--heading-font-size-m);
   text-align: left;

diff --git a/express/blocks/promotion/promotion.css b/express/blocks/promotion/promotion.css
@@ -3,8 +3,8 @@
   margin: var(--spacing-xxxl) auto;
 }
 
-.promotion[data-block-status="loaded"] {
-  display: block;
+.promotion h2, .promotion h3{
+  text-align: center;
 }
 
 .promotion .promotion-wrapper {

diff --git a/express/blocks/template-x/template-x.css b/express/blocks/template-x/template-x.css
@@ -14,6 +14,10 @@ main.with-holiday-templates-banner > div[class='section section-wrapper template
   width: 100%;
 }
 
+.template-title {
+  text-align: center;
+}
+
 [data-block-name="template-x"] {
   margin: 0 auto;
 }

diff --git a/express/scripts/scripts.js b/express/scripts/scripts.js
@@ -177,6 +177,17 @@ function decorateHeroLCP(loadStyle, config, createTag, getMetadata) {
     createTag,
   } = await import(`${miloLibs}/utils/utils.js`);
 
+  // TODO remove metadata after we go live
+  const gnav = createTag('meta', { name: 'gnav-source', content: '/express/localnav-express' });
+  document.head.append(gnav);
+
+  const footer = createTag('meta', { name: 'footer', content: 'global-footer' });
+  document.head.append(footer);
+
+  const footerSrc = createTag('meta', { name: 'footer-source', content: '/federal/footer/footer' });
+  document.head.append(footerSrc);
+  // end TODO remove metadata after we go live
+
   const jarvisVisibleMeta = getMetadata('jarvis-immediately-visible')?.toLowerCase();
   const desktopViewport = window.matchMedia('(min-width: 900px)').matches;
   if (jarvisVisibleMeta && ['mobile', 'desktop', 'on'].includes(jarvisVisibleMeta) && (