Make the filter field in item lists wider

CHANGELOG.md

@@ -11,6 +11,7 @@
 - Update item lists check for large images when toggling recurse ([#1654](../../pull/1654))
 - Support named item lists ([#1665](../../pull/1665))
 - Add options to group within item lists ([#1666](../../pull/1666))
+- Make the filter field in item lists wider ([#1669](../../pull/1669))
 
 ### Changes
 

girder/girder_large_image/web_client/stylesheets/itemList.styl

@@ -116,6 +116,16 @@ ul.g-item-list[metadata-columns="0"]
 
 .li-item-list-filter
   padding-left 12px
+  flex 1
+  display flex
+  align-items baseline
+
+  input
+    flex 1
+
+  .li-item-list-filter-clear
+    cursor pointer
+    margin-right 20px
 
 @media (min-width 768px)
   .modal-dialog.li-item-list-dialog
@@ -135,5 +145,9 @@ ul.g-item-list[metadata-columns="0"]
     padding-left 5px
     font-weight normal
 
-.li-item-list-filter-clear
-  cursor pointer
+.g-hierarchy-widget .g-hierarchy-actions-header
+  display flex
+  align-items baseline
+
+  button.g-checked-actions-button
+    float unset

girder/girder_large_image/web_client/views/itemList.js

@@ -387,13 +387,12 @@ wrap(ItemListWidget, 'render', function (render) {
         const root = this.$el.closest('.g-hierarchy-widget');
         if (!root.find('.li-item-list-filter').length) {
             let base = root.find('.g-hierarchy-actions-header .g-folder-header-buttons').eq(0);
-            let func = 'after';
+            let func = 'before';
             if (!base.length) {
                 base = root.find('.g-hierarchy-breadcrumb-bar>.breadcrumb>div').eq(0);
-                func = 'before';
             }
             if (base.length) {
-                base[func]('<span class="li-item-list-filter">Filter: <input class="li-item-list-filter-input" title="' +
+                base[func]('<span class="li-item-list-filter">Filter:&nbsp;<input class="li-item-list-filter-input" title="' +
                     'All specified terms must be included.  ' +
                     'Surround with single quotes to include spaces, double quotes for exact value match.  ' +
                     'Prefix with - to exclude that value.  ' +