ticket zoom: make title into dropdown-toggle

app/assets/javascripts/app/controllers/_application_controller_generic.js.coffee

@@ -477,16 +477,21 @@ class App.ActionRow extends App.Controller
         )
 
 class App.Sidebar extends App.Controller
+  elements:
+    '.tabsSidebar-tab': 'tabs'
+    '.sidebar':         'sidebars'
+
   events:
     'click .tabsSidebar-tab':  'toggleTab'
     'click .tabsSidebar-close': 'toggleSidebar'
+    'click .sidebar-header h2': 'toggleDropdown'
 
   constructor: ->
     super
     @render()
 
     # get first tab
-    name = @el.find('.tabsSidebar-tab').first().data('tab')
+    name = @tabs.first().data('tab')
 
     # activate first tab
     @toggleTabAction(name)
@@ -508,7 +513,11 @@ class App.Sidebar extends App.Controller
           type:  'small'
         )
 
-  toggleSidebar: ->
+  toggleDropdown: (e) =>
+    e.stopPropagation()
+    $(e.currentTarget).next('.js-actions').find('.dropdown-toggle').dropdown('toggle')
+
+  toggleSidebar: =>
     @el.parent().find('.tabsSidebar-sidebarSpacer').toggleClass('is-closed')
     @el.parent().find('.tabsSidebar').toggleClass('is-closed')
     @el.parent().next('.attributeBar').toggleClass('is-closed')
@@ -518,7 +527,7 @@ class App.Sidebar extends App.Controller
     @el.parent().find('.tabsSidebar').removeClass('is-closed')
     @el.parent().next('.attributeBar').addClass('is-closed')
 
-  toggleTab: (e) ->
+  toggleTab: (e) =>
 
     # get selected tab
     name = $(e.target).closest('.tabsSidebar-tab').data('tab')
@@ -537,13 +546,13 @@ class App.Sidebar extends App.Controller
     return if !name
 
     # remove active state
-    @el.find('.tabsSidebar-tab').removeClass('active')
+    @tabs.removeClass('active')
 
     # add active state
     @el.find('.tabsSidebar-tab[data-tab=' + name + ']').addClass('active')
 
     # hide all content tabs
-    @el.find('.sidebar').addClass('hide')
+    @sidebars.addClass('hide')
 
     # show active tab content
     tabContent = @el.find('.sidebar[data-tab=' + name + ']')

app/assets/javascripts/app/views/generic/sidebar_tabs.jst.eco

@@ -2,7 +2,7 @@
 <div class="sidebar bottom-form-shadow flex hide" data-tab="<%= item.name %>">
   <div class="sidebar-header">
     <h2 class="u-textTruncate"><%- @T( item.head ) %></h2>
-    <div class="sidebar-actions js-actions flex"></div>
+    <div class="js-actions flex"></div>
     <div class="tabsSidebar-close centered u-clickable">
       <div class="arrow-right icon"></div>
     </div>

app/assets/stylesheets/zammad.css.scss

@@ -3452,18 +3452,26 @@ footer {
   .tabsSidebar .sidebar-header {
     @extend .horizontal;
     @extend .center;
-    padding: 20px 20px 0;
+    margin: 20px 20px 0;
+    padding: 0 0 5px;
+    position: relative;
+    
+    h2 {
+      margin: 0 0 -1px;
+      line-height: 1;
+      padding-right: 8px;
+      @extend .u-clickable;
+    }
+    
+    + hr {
+      margin-top: 15px;
+    }
+    
+    .dropdown {
+      position: static;
+    }
   }
-
-  .tabsSidebar .sidebar h2 {
-    margin: 0 0 -1px;
-    line-height: 1;
-  }
-
-  .tabsSidebar .sidebar-actions {
-    padding-left: 8px;
-  }
-
+  
   .tabsSidebar-close {
     padding: 20px;
     margin: -15px;