From a67039a184664d9bca8a565a185c65dd8a147ea7 Mon Sep 17 00:00:00 2001
From: Antonella Sgarlatta <antonella@standardnotes.org>
Date: Thu, 3 Jun 2021 15:43:58 -0300
Subject: [PATCH] styles: set max width for tag hint

---
 app/assets/javascripts/components/AutocompleteTagHint.tsx | 4 +++-
 app/assets/stylesheets/_sn.scss                           | 4 ++++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/components/AutocompleteTagHint.tsx b/app/assets/javascripts/components/AutocompleteTagHint.tsx
index ec5905000..84c172196 100644
--- a/app/assets/javascripts/components/AutocompleteTagHint.tsx
+++ b/app/assets/javascripts/components/AutocompleteTagHint.tsx
@@ -33,7 +33,9 @@ export const AutocompleteTagHint = observer(
               type="hashtag"
               className="sn-icon--small color-neutral mr-1"
             />
-            {autocompleteSearchQuery}
+            <span className="max-w-40 whitespace-nowrap overflow-hidden overflow-ellipsis">
+              {autocompleteSearchQuery}
+            </span>
           </span>
         </button>
       </>
diff --git a/app/assets/stylesheets/_sn.scss b/app/assets/stylesheets/_sn.scss
index 94dc079c1..0a03d1d58 100644
--- a/app/assets/stylesheets/_sn.scss
+++ b/app/assets/stylesheets/_sn.scss
@@ -190,6 +190,10 @@
   max-width: 20rem;
 }
 
+.max-w-40 {
+  max-width: 10rem;
+}
+
 .min-w-5 {
   min-width: 1.25rem;
 }