Merge pull request #21884 from sftim/20200618_reduce_header_sizes_announcement

Reduce header height when announcement shown

assets/scss/_custom.scss

@@ -1,3 +1,5 @@
+$announcement-size-adjustment: 8px;
+
 /* GLOBAL */
 .td-main {
   .row {
@@ -390,4 +392,32 @@ main.content {
       }
     }
   }
-}
+}
+
+/* ANNOUNCEMENTS */
+section#fp-announcement ~ .header-hero {
+    padding: $announcement-size-adjustment  0;
+
+    > div {
+       margin-top: $announcement-size-adjustment;
+       margin-bottom: $announcement-size-adjustment;
+    }
+
+    h1, h2, h3, h4, h5 {
+      margin: $announcement-size-adjustment 0;
+    }
+}
+
+section#announcement ~ .header-hero {
+    padding: #{$announcement-size-adjustment / 2} 0;
+
+    > div {
+       margin-top: #{$announcement-size-adjustment / 2};
+       margin-bottom: #{$announcement-size-adjustment / 2};
+       padding-bottom: #{$announcement-size-adjustment / 2};
+    }
+
+    h1, h2, h3, h4, h5 {
+      margin: #{$announcement-size-adjustment / 2} 0;
+    }
+}

assets/scss/_tablet.scss

@@ -23,7 +23,7 @@ $main-nav-left-button-size: 50px;
 $main-nav-left-button-font-size: 18px;
 
 // hero
-$hero-padding-top: 136px;
+$hero-padding-top: 116px;
 $headline-wrapper-margin-bottom: 40px;
 $quickstart-button-padding: 0 50px;
 $vendor-strip-font-size: 16px;