Merge pull request linode#273 from hzoppetti/header-footer-09-22-2020

[Update] Header/footer update 9/22

Author: leslitagordita

src/components/3_organisms/footer-nav.js

@@ -174,6 +174,13 @@ const FooterNav = () => (
                     </span>
                   </a>
                 </li>
+                <li className="o-menu__item">
+                  <a className="o-menu__link" href="https://www.linode.com/alternative-cloud-provider/">
+                    <span className="o-menu__title">
+                      Alternative Cloud
+                    </span>
+                  </a>
+                </li>
                 <li className="o-menu__item">
                   <a className="o-menu__link" href="https://www.linode.com/linode-vs-aws/">
                     <span className="o-menu__title">

src/css/components/3_organisms/header.css

@@ -154,7 +154,6 @@
     width: 13px;
     height: 7px;
     -ms-interpolation-mode: nearest-neighbor;
-        image-rendering: -moz-crisp-edges;
         image-rendering: pixelated;
     content: "";
     transition: all 200ms;
@@ -482,10 +481,27 @@
     transform: translateY(-100px);
     transition: opacity .175s ease-out, transform .25s ease-out;
     will-change: position, transform;
+    display: initial;
     padding-top: 108px;
   }
 
-  .c-sub-menu.active, .c-sub-menu:focus-within {
+  @media (max-width: 61.99em) {
+    .c-sub-menu {
+      display: none;
+    }
+  }
+
+  .c-sub-menu.active {
+    bottom: 0;
+    left: 0;
+    opacity: 1;
+    position: fixed;
+    right: 0;
+    top: 0;
+    transform: translateY(0px);
+  }
+
+  .c-sub-menu:focus-within {
     bottom: 0;
     left: 0;
     opacity: 1;
@@ -695,13 +711,20 @@
   }
 
   .c-sub-menu--mobile {
+    display: none;
     font-size: 18px;
     line-height: 1.33333;
     font-family: "Source Sans Pro", sans-serif;
     font-weight: 400;
     letter-spacing: 0;
   }
 
+  @media (max-width: 61.99em) {
+    .c-sub-menu--mobile {
+      display: initial;
+    }
+  }
+
   .c-sub-menu--mobile .o-layout__colset {
     border-bottom: 0;
     grid-template-columns: 1fr;
@@ -1009,4 +1032,4 @@
   .c-weglot-nav .weglot-flags > span:before {
     content: none !important;
     display: none !important;
-  }
+  }