ticket zoom: move sidebar tabs from scrollbar

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

@@ -604,7 +604,9 @@ class App.Sidebar extends App.Controller
     @toggleTabAction(name)
 
   render: =>
-    @html App.view('generic/sidebar_tabs')( items: @items )
+    @html App.view('generic/sidebar_tabs')
+      items: @items
+      scrollbarWidth: @getScrollBarWidth()
 
     # init content callback
     for item in @items
@@ -620,6 +622,21 @@ class App.Sidebar extends App.Controller
           type:  'small'
         )
 
+  getScrollBarWidth: ->
+    $outer = $('<div>').css(
+      visibility: 'hidden'
+      width: 100
+      overflow: 'scroll'
+    ).appendTo('body')
+
+    widthWithScroll = $('<div>').css(
+      width: '100%'
+    ).appendTo($outer).outerWidth()
+
+    $outer.remove()
+
+    return 100 - widthWithScroll
+
   toggleDropdown: (e) ->
     e.stopPropagation()
     $(e.currentTarget).next('.js-actions').find('.dropdown-toggle').dropdown('toggle')

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

@@ -13,7 +13,7 @@
 
 </div>
 <% end %>
-<div class="tabsSidebar-tabs vertical justified">
+<div class="tabsSidebar-tabs vertical justified" style="margin-left: -<%- @scrollbarWidth %>px">
 <% for item in @items: %>
   <div class="tabsSidebar-tab" data-tab="<%= item.name %>">
     <%- @Icon(item.icon) %>