From ec53cccbc895aedd23a613f8ddf6855c4591d221 Mon Sep 17 00:00:00 2001
From: Phil Renaud <phil.renaud@hashicorp.com>
Date: Thu, 17 Oct 2024 23:50:24 -0400
Subject: [PATCH] Adds an ellipsis and max width to profile nav token name
 (#24240)

---
 .changelog/24240.txt           | 3 +++
 ui/app/styles/core/navbar.scss | 8 ++++++++
 2 files changed, 11 insertions(+)
 create mode 100644 .changelog/24240.txt

diff --git a/.changelog/24240.txt b/.changelog/24240.txt
new file mode 100644
index 000000000..0057ee18f
--- /dev/null
+++ b/.changelog/24240.txt
@@ -0,0 +1,3 @@
+```release-note:bug
+ui: Put a max-width on token name so it doesn't collide with the search box in the top nav
+```
diff --git a/ui/app/styles/core/navbar.scss b/ui/app/styles/core/navbar.scss
index b4ee4e9f0..9e9d08be1 100644
--- a/ui/app/styles/core/navbar.scss
+++ b/ui/app/styles/core/navbar.scss
@@ -177,6 +177,14 @@ $secondaryNavbarHeight: 4.5rem;
     }
   }
 
+  .profile-dropdown .hds-dropdown-toggle-button__text {
+    max-width: 150px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    direction: rtl;
+  }
+
   .custom-label {
     border-radius: 1rem;
     padding: 0.25rem 1rem;