From 83bca0819e56ad506b7da931ffc93740545280cf Mon Sep 17 00:00:00 2001
From: RachelElysia <71795832+RachelElysia@users.noreply.github.com>
Date: Tue, 11 Apr 2023 13:13:28 -0400
Subject: [PATCH] Fleet UI: Responsive nav bar sizing (#11135)

---
 changes/10801-responsive-nav-bar                    | 1 +
 frontend/components/top_nav/SiteTopNav/_styles.scss | 5 +++++
 2 files changed, 6 insertions(+)
 create mode 100644 changes/10801-responsive-nav-bar

diff --git a/changes/10801-responsive-nav-bar b/changes/10801-responsive-nav-bar
new file mode 100644
index 0000000000..e213647716
--- /dev/null
+++ b/changes/10801-responsive-nav-bar
@@ -0,0 +1 @@
+- Fleet UI: Nav bar buttons responsively resize when small screen widths cannot fit default size nav bar
\ No newline at end of file
diff --git a/frontend/components/top_nav/SiteTopNav/_styles.scss b/frontend/components/top_nav/SiteTopNav/_styles.scss
index ad10b4aad9..bdf0ef2e9c 100644
--- a/frontend/components/top_nav/SiteTopNav/_styles.scss
+++ b/frontend/components/top_nav/SiteTopNav/_styles.scss
@@ -71,6 +71,11 @@
     color: $core-white;
     padding: 15px 24px;
     text-decoration: none;
+
+    // Prevents user menu from overlapping with nav bar buttons
+    @media (max-width: 825px) {
+      padding: 15px 18px;
+    }
   }
 
   &__logo-wrapper {