Reduce the default height of MR/branch dropdowns

To avoid having empty areas in the dropdown that occupy
unnessary space, I removed the dropdown's min-height and changed
its default height in empty state to be same as its loading state
(with the spinner).

Author: fleon

app/assets/javascripts/ide/components/branches/search_list.vue

@@ -67,15 +67,15 @@ export default {
         class="form-control dropdown-input-field"
         @input="searchBranches"
       />
-      <icon :size="18" name="search" class="input-icon" />
+      <icon :size="18" name="search" class="ml-3 input-icon" />
     </label>
     <div class="dropdown-content ide-merge-requests-dropdown-content d-flex">
       <gl-loading-icon
         v-if="isLoading"
         :size="2"
         class="mt-3 mb-3 align-self-center ml-auto mr-auto"
       />
-      <ul v-else class="mb-3 w-100">
+      <ul v-else class="mb-0 w-100">
         <template v-if="hasBranches">
           <li v-for="item in branches" :key="item.name">
             <item :item="item" :project-id="currentProjectId" :is-active="isActiveBranch(item)" />

app/assets/javascripts/ide/components/merge_requests/list.vue

@@ -85,7 +85,7 @@ export default {
         @input="searchMergeRequests"
         @removeToken="setSearchType(null)"
       />
-      <icon :size="18" name="search" class="input-icon" />
+      <icon :size="18" name="search" class="ml-3 input-icon" />
     </label>
     <div class="dropdown-content ide-merge-requests-dropdown-content d-flex">
       <gl-loading-icon
@@ -94,7 +94,7 @@ export default {
         class="mt-3 mb-3 align-self-center ml-auto mr-auto"
       />
       <template v-else>
-        <ul class="mb-3 w-100">
+        <ul class="mb-0 w-100">
           <template v-if="showSearchTypes">
             <li v-for="searchType in $options.searchTypes" :key="searchType.type">
               <button

app/assets/stylesheets/page_bundles/ide.scss

@@ -1188,7 +1188,7 @@ $ide-commit-header-height: 48px;
 
     .input-icon {
       right: auto;
-      left: 26px;
+      left: 10px;
       top: 50%;
       transform: translateY(-50%);
     }
@@ -1216,11 +1216,10 @@ $ide-commit-header-height: 48px;
 }
 
 .ide-search-list-empty {
-  height: 230px;
+  height: 69px;
 }
 
 .ide-merge-requests-dropdown-content {
-  min-height: 230px;
   max-height: 470px;
 }