From ed229c28f2a7dbc3f5fbd93af984f463cf1730b9 Mon Sep 17 00:00:00 2001
From: Jacob Shandling <61553566+jacobshandling@users.noreply.github.com>
Date: Thu, 10 Aug 2023 14:41:49 -0700
Subject: [PATCH] Prevent host page label filter text from jumping at low
 viewport width (#13256)

---
 changes/13254-jumping-text                                     | 1 +
 .../ManageHostsPage/components/LabelFilterSelect/_styles.scss  | 3 +++
 2 files changed, 4 insertions(+)
 create mode 100644 changes/13254-jumping-text

diff --git a/changes/13254-jumping-text b/changes/13254-jumping-text
new file mode 100644
index 0000000000..6a0ff950c4
--- /dev/null
+++ b/changes/13254-jumping-text
@@ -0,0 +1 @@
+- Fix jumping text on the host page label filter dropdown at low viewport widths
diff --git a/frontend/pages/hosts/ManageHostsPage/components/LabelFilterSelect/_styles.scss b/frontend/pages/hosts/ManageHostsPage/components/LabelFilterSelect/_styles.scss
index ed3affb17c..0cdae3bd21 100644
--- a/frontend/pages/hosts/ManageHostsPage/components/LabelFilterSelect/_styles.scss
+++ b/frontend/pages/hosts/ManageHostsPage/components/LabelFilterSelect/_styles.scss
@@ -77,6 +77,9 @@
 
   .label-filter-select__indicator {
     color: $core-fleet-black;
+    // override react-select default styles to increase flexibility of dropdown styling
+    padding: 0;
+    padding-right: $pad-small;
   }
 
   .label-filter-select__menu {