Fix Label dropdown and organize code

app/assets/javascripts/gl_dropdown.js.coffee

@@ -224,6 +224,9 @@ class GitLabDropdown
 
     menu.toggleClass PAGE_TWO_CLASS
 
+    # Focus first visible input on active page
+    @dropdown.find('[class^="dropdown-page-"]:visible :text:visible:first').focus()
+
   parseData: (data) ->
     @renderedData = data
 
@@ -243,7 +246,8 @@ class GitLabDropdown
   shouldPropagate: (e) =>
     if @options.multiSelect
       $target = $(e.target)
-      if not $target.hasClass('dropdown-menu-close') and not $target.hasClass('dropdown-menu-close-icon')
+
+      if not $target.hasClass('dropdown-menu-close') and not $target.hasClass('dropdown-menu-close-icon') and ($target.attr('href') is '#')
         e.stopPropagation()
         return false
       else
@@ -378,7 +382,6 @@ class GitLabDropdown
       selectedObject = @renderedData[selectedIndex]
     value = if @options.id then @options.id(selectedObject, el) else selectedObject.id
     field = @dropdown.parent().find("input[name='#{fieldName}'][value='#{value}']")
-
     if el.hasClass(ACTIVE_CLASS)
       el.removeClass(ACTIVE_CLASS)
       field.remove()

app/assets/stylesheets/framework/dropdowns.scss

@@ -320,7 +320,7 @@
   }
 }
 
-.dropdown-input-field {
+.dropdown-input-field, .default-dropdown-input {
   width: 100%;
   padding: 0 7px;
   color: $dropdown-input-color;

app/assets/stylesheets/pages/issuable.scss

@@ -248,6 +248,10 @@
       background: $gray-dark;
       border: 1px solid $border-gray-dark;
     }
+
+    &.btn-primary {
+      @extend .btn-primary
+    }
   }
 
   a:not(.btn) {

app/views/shared/issuable/_label_page_create.html.haml

@@ -2,14 +2,14 @@
   = dropdown_title("Create new label", back: true)
   = dropdown_content do
     .dropdown-labels-error.js-label-error
-    %input#new_label_name.dropdown-input-field{ type: "text", placeholder: "Name new label" }
+    %input#new_label_name.default-dropdown-input{ type: "text", placeholder: "Name new label" }
     .suggest-colors.suggest-colors-dropdown
       - suggested_colors.each do |color|
         = link_to '#', style: "background-color: #{color}", data: { color: color } do
           &nbsp
     .dropdown-label-color-input
       .dropdown-label-color-preview.js-dropdown-label-color-preview
-      %input#new_label_color.dropdown-input-field{ type: "text" }
+      %input#new_label_color.default-dropdown-input{ type: "text" }
     .clearfix
       %button.btn.btn-primary.pull-left.js-new-label-btn{ type: "button" }
         Create

app/views/shared/issuable/_sidebar.html.haml

@@ -96,7 +96,7 @@
             - issuable.labels.each do |label|
               = hidden_field_tag "#{issuable.to_ability_name}[label_names][]", label.id, id: nil
             .dropdown
-              %button.dropdown-menu-toggle.js-label-select.js-multiselect.js-extra-options{type: "button", data: {toggle: "dropdown", field_name: "#{issuable.to_ability_name}[label_names][]", ability_name: issuable.to_ability_name, show_no: "true", show_any: "true", project_id: (@project.id if @project), issue_update: issuable_json_path(issuable), labels: (namespace_project_labels_path(@project.namespace, @project, :json) if @project)}}
+              %button.dropdown-menu-toggle.js-label-select.js-multiselect{type: "button", data: {toggle: "dropdown", field_name: "#{issuable.to_ability_name}[label_names][]", ability_name: issuable.to_ability_name, show_no: "true", show_any: "true", project_id: (@project.id if @project), issue_update: issuable_json_path(issuable), labels: (namespace_project_labels_path(@project.namespace, @project, :json) if @project)}}
                 %span.dropdown-toggle-text
                   Label
                 = icon('chevron-down')