UX: add ellipsis for assign modal (#433)

* UX: add ellipsis for assign modal

* UX: remove suggestions label

assets/javascripts/discourse/templates/components/assignee-chooser-row.hbs

@@ -20,14 +20,4 @@
 {{else}}
   {{d-icon "envelope"}}
   <span class="identifier">{{this.item.id}}</span>
-{{/if}}
-{{#if
-  (and
-    (or (eq this.selectKit.filter null) (eq this.selectKit.filter.length 0))
-    (eq this.index 0)
-  )
-}}
-  <span class="suggestions-label">
-    {{i18n "discourse_assign.assign_modal.suggestions"}}
-  </span>
 {{/if}}

assets/stylesheets/assigns.scss

@@ -83,6 +83,19 @@
   .email-group-user-chooser {
     width: 100%;
 
+    .select-kit-header {
+      outline: 0 !important;
+    }
+    .select-kit-body {
+      position: absolute !important;
+      transform: none !important;
+      max-width: 100%;
+    }
+
+    &-filter.is-expanded {
+      border: 1px solid var(--tertiary);
+    }
+
     .caret-icon {
       color: var(--primary-medium);
     }
@@ -102,6 +115,10 @@
     }
 
     .user-status-message {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      color: var(--primary-medium);
       font-size: var(--font-down-2);
       margin-left: 0.5em;