From 35c9965c11eae54f87a8a2fc24dc856818da7955 Mon Sep 17 00:00:00 2001
From: Eben Eliason <eben.eliason@gmail.com>
Date: Fri, 14 Jan 2022 17:49:47 -0800
Subject: [PATCH 1/2] Collapse the right nav links into a dropdown menu at
 smaller sizes

This prevents a stacking issue which caused the Gruntwork logo to
wind up getting squished when at smaller sizes between desktop and
mobile layouts.
---
 docusaurus.config.js | 20 ++++++++++++++++++++
 src/css/custom.css   | 17 ++++++++++++++++-
 2 files changed, 36 insertions(+), 1 deletion(-)

diff --git a/docusaurus.config.js b/docusaurus.config.js
index 2b47f829b9..dc78851b5c 100644
--- a/docusaurus.config.js
+++ b/docusaurus.config.js
@@ -117,6 +117,26 @@ const config = {
             label: "Sign In",
             position: "right",
           },
+          {
+            type: "dropdown",
+            label: "More…",
+            position: "right",
+            id: "more_dropdown",
+            items: [
+              {
+                href: "https://github.com/gruntwork-io/knowledge-base/discussions",
+                label: "Knowledge Base",
+              },
+              {
+                href: "/docs/guides/support",
+                label: "Support",
+              },
+              {
+                href: "https://app.gruntwork.io",
+                label: "Sign In",
+              },
+            ],
+          },
         ],
       },
       footer: {
diff --git a/src/css/custom.css b/src/css/custom.css
index 7eef8022f0..9cc2fd038a 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -276,7 +276,8 @@ html[data-theme="dark"] .menu__link--sublist {
 
 /* remove external link icons on header/footer links */
 .footer__link-item svg,
-.navbar__items--right .navbar__link svg {
+.navbar__items--right .navbar__link svg,
+.navbar__items--right .dropdown__link svg {
   display: none;
 }
 
@@ -291,3 +292,17 @@ html[data-theme="dark"] .menu__link--sublist {
     display: none;
   }
 }
+
+#more_dropdown {
+  display: none;
+}
+
+@media only screen and (max-width: 1280px) {
+  .navbar__items--right > a {
+    display: none;
+  }
+
+  #more_dropdown {
+    display: block;
+  }
+}

From e6918acf964f86149b5a58e7e1f0ece2eb3e3a67 Mon Sep 17 00:00:00 2001
From: Eben Eliason <eben.eliason@gmail.com>
Date: Tue, 18 Jan 2022 13:21:26 -0800
Subject: [PATCH 2/2] More mobile tweaks for logo/nav

---
 src/css/custom.css | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/css/custom.css b/src/css/custom.css
index 9cc2fd038a..d40f6b7495 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -125,12 +125,6 @@ p > img + em {
   justify-items: center;
 }
 
-@media only screen and (max-width: 996px) {
-  .navbar__brand {
-    border-right: none;
-  }
-}
-
 .navbar__logo {
   height: 2.5rem;
   margin-top: 0.5rem;
@@ -274,10 +268,11 @@ html[data-theme="dark"] .menu__link--sublist {
   color: var(--ifm-color-primary-lightest);
 }
 
-/* remove external link icons on header/footer links */
+/* remove external link icons on header/footer/flyout links */
 .footer__link-item svg,
 .navbar__items--right .navbar__link svg,
-.navbar__items--right .dropdown__link svg {
+.navbar__items--right .dropdown__link svg,
+.navbar-sidebar__items .menu__link svg {
   display: none;
 }
 
@@ -297,7 +292,7 @@ html[data-theme="dark"] .menu__link--sublist {
   display: none;
 }
 
-@media only screen and (max-width: 1280px) {
+@media only screen and (max-width: 1280px) and (min-width: 996px) {
   .navbar__items--right > a {
     display: none;
   }
@@ -306,3 +301,9 @@ html[data-theme="dark"] .menu__link--sublist {
     display: block;
   }
 }
+
+@media only screen and (max-width: 996px) {
+  .navbar__brand {
+    border-right: none;
+  }
+}