Merge remote-tracking branch 'origin/master' into label-dropdown-fix

# Conflicts:
#	app/views/shared/issuable/_sidebar.html.haml

28 files changed, 372 insertions, 199 deletions

diff --git a/app/assets/javascripts/api.js.coffee b/app/assets/javascripts/api.js.coffee
index f3ed9a66715..dd1bbb37551 100644
--- a/app/assets/javascripts/api.js.coffee
+++ b/app/assets/javascripts/api.js.coffee
@@ -5,6 +5,7 @@
   group_projects_path: "/api/:version/groups/:id/projects.json"
   projects_path: "/api/:version/projects.json"
   labels_path: "/api/:version/projects/:id/labels"
+  license_path: "/api/:version/licenses/:key"
 
   group: (group_id, callback) ->
     url = Api.buildUrl(Api.group_path)
@@ -92,6 +93,16 @@
     ).done (projects) ->
       callback(projects)
 
+  # Return text for a specific license
+  licenseText: (key, data, callback) ->
+    url = Api.buildUrl(Api.license_path).replace(':key', key)
+
+    $.ajax(
+      url: url
+      data: data
+    ).done (license) ->
+      callback(license)
+
   buildUrl: (url) ->
     url = gon.relative_url_root + url if gon.relative_url_root?
     return url.replace(':version', gon.api_version)
diff --git a/app/assets/javascripts/application.js.coffee b/app/assets/javascripts/application.js.coffee
index 6f435e4c542..5bac8eef1cb 100644
--- a/app/assets/javascripts/application.js.coffee
+++ b/app/assets/javascripts/application.js.coffee
@@ -174,7 +174,7 @@ $ ->
   $('.trigger-submit').on 'change', ->
     $(@).parents('form').submit()
 
-  gl.utils.localTimeAgo($('abbr.timeago, .js-timeago'), false)
+  gl.utils.localTimeAgo($('abbr.timeago, .js-timeago'), true)
 
   # Flash
   if (flash = $(".flash-container")).length > 0
diff --git a/app/assets/javascripts/blob/blob_license_selector.js.coffee b/app/assets/javascripts/blob/blob_license_selector.js.coffee
new file mode 100644
index 00000000000..e17eaa75dc1
--- /dev/null
+++ b/app/assets/javascripts/blob/blob_license_selector.js.coffee
@@ -0,0 +1,30 @@
+class @BlobLicenseSelector
+  licenseRegex: /^(.+\/)?(licen[sc]e|copying)($|\.)/i
+
+  constructor: (editor) ->
+    @$licenseSelector = $('.js-license-selector')
+    $fileNameInput = $('#file_name')
+
+    initialFileNameValue = if $fileNameInput.length
+      $fileNameInput.val()
+    else if $('.editor-file-name').length
+      $('.editor-file-name').text().trim()
+
+    @toggleLicenseSelector(initialFileNameValue)
+
+    if $fileNameInput
+      $fileNameInput.on 'keyup blur', (e) =>
+        @toggleLicenseSelector($(e.target).val())
+
+    $('select.license-select').on 'change', (e) ->
+      data =
+        project: $(this).data('project')
+        fullname: $(this).data('fullname')
+      Api.licenseText $(this).val(), data, (license) ->
+        editor.setValue(license.content, -1)
+
+  toggleLicenseSelector: (fileName) =>
+    if @licenseRegex.test(fileName)
+      @$licenseSelector.show()
+    else
+      @$licenseSelector.hide()
diff --git a/app/assets/javascripts/blob/edit_blob.js.coffee b/app/assets/javascripts/blob/edit_blob.js.coffee
index 390e41ed8d4..eea9aa972ee 100644
--- a/app/assets/javascripts/blob/edit_blob.js.coffee
+++ b/app/assets/javascripts/blob/edit_blob.js.coffee
@@ -1,44 +1,39 @@
 class @EditBlob
-  constructor: (assets_path, mode)->
-    ace.config.set "modePath", assets_path + '/ace'
+  constructor: (assets_path, ace_mode = null) ->
+    ace.config.set "modePath", "#{assets_path}/ace"
     ace.config.loadModule "ace/ext/searchbox"
-    if mode
-      ace_mode = mode
-    editor = ace.edit("editor")
-    editor.focus()
-    @editor = editor
-
-    if ace_mode
-      editor.getSession().setMode "ace/mode/" + ace_mode
+    @editor = ace.edit("editor")
+    @editor.focus()
+    @editor.getSession().setMode "ace/mode/#{ace_mode}" if ace_mode
 
     # Before a form submission, move the content from the Ace editor into the
     # submitted textarea
-    $('form').submit ->
-      $("#file-content").val(editor.getValue())
+    $('form').submit =>
+      $("#file-content").val(@editor.getValue())
+
+    @initModePanesAndLinks()
+    new BlobLicenseSelector(@editor)
 
-    editModePanes = $(".js-edit-mode-pane")
-    editModeLinks = $(".js-edit-mode a")
-    editModeLinks.click (event) ->
-      event.preventDefault()
-      currentLink = $(this)
-      paneId = currentLink.attr("href")
-      currentPane = editModePanes.filter(paneId)
-      editModeLinks.parent().removeClass "active hover"
-      currentLink.parent().addClass "active hover"
-      editModePanes.hide()
-      if paneId is "#preview"
-        currentPane.fadeIn 200
-        $.post currentLink.data("preview-url"),
-          content: editor.getValue()
-        , (response) ->
-          currentPane.empty().append response
-          currentPane.syntaxHighlight()
-          return
+  initModePanesAndLinks: ->
+    @$editModePanes = $(".js-edit-mode-pane")
+    @$editModeLinks = $(".js-edit-mode a")
+    @$editModeLinks.click @editModeLinkClickHandler
 
-      else
-        currentPane.fadeIn 200
-        editor.focus()
-      return
+  editModeLinkClickHandler: (event) =>
+    event.preventDefault()
+    currentLink = $(event.target)
+    paneId = currentLink.attr("href")
+    currentPane = @$editModePanes.filter(paneId)
+    @$editModeLinks.parent().removeClass "active hover"
+    currentLink.parent().addClass "active hover"
+    @$editModePanes.hide()
+    currentPane.fadeIn 200
+    if paneId is "#preview"
+      $.post currentLink.data("preview-url"),
+        content: @editor.getValue()
+      , (response) ->
+        currentPane.empty().append response
+        currentPane.syntaxHighlight()
 
-  editor: ->
-    return @editor
+    else
+      @editor.focus()
diff --git a/app/assets/javascripts/blob/new_blob.js.coffee b/app/assets/javascripts/blob/new_blob.js.coffee
deleted file mode 100644
index 68c5e5195e3..00000000000
--- a/app/assets/javascripts/blob/new_blob.js.coffee
+++ /dev/null
@@ -1,20 +0,0 @@
-class @NewBlob
-  constructor: (assets_path, mode)->
-    ace.config.set "modePath", assets_path + '/ace'
-    ace.config.loadModule "ace/ext/searchbox"
-    if mode
-      ace_mode = mode
-    editor = ace.edit("editor")
-    editor.focus()
-    @editor = editor
-
-    if ace_mode
-      editor.getSession().setMode "ace/mode/" + ace_mode
-
-    # Before a form submission, move the content from the Ace editor into the
-    # submitted textarea
-    $('form').submit ->
-      $("#file-content").val(editor.getValue())
-
-  editor: ->
-    return @editor
diff --git a/app/assets/javascripts/dropzone_input.js.coffee b/app/assets/javascripts/dropzone_input.js.coffee
index 6eb8d27ee2b..e2194589b38 100644
--- a/app/assets/javascripts/dropzone_input.js.coffee
+++ b/app/assets/javascripts/dropzone_input.js.coffee
@@ -61,6 +61,7 @@ class @DropzoneInput
         return
 
       drop: ->
+        $mdArea.removeClass 'is-dropzone-hover'
         form.find(".div-dropzone-hover").css "opacity", 0
         form_textarea.focus()
         return
diff --git a/app/assets/javascripts/gfm_auto_complete.js.coffee b/app/assets/javascripts/gfm_auto_complete.js.coffee
index 4718bcf7a1e..61e3f811e73 100644
--- a/app/assets/javascripts/gfm_auto_complete.js.coffee
+++ b/app/assets/javascripts/gfm_auto_complete.js.coffee
@@ -2,6 +2,8 @@
 
 window.GitLab ?= {}
 GitLab.GfmAutoComplete =
+  dataLoading: false
+
   dataSource: ''
 
   # Emoji
@@ -17,17 +19,41 @@ GitLab.GfmAutoComplete =
     template: '<li><small>${id}</small> ${title}</li>'
 
   # Add GFM auto-completion to all input fields, that accept GFM input.
-  setup: ->
-    input = $('.js-gfm-input')
+  setup: (wrap) ->
+    @input = $('.js-gfm-input')
+
+    # destroy previous instances
+    @destroyAtWho()
+
+    # set up instances
+    @setupAtWho()
+
+    if @dataSource
+      if !@dataLoading
+        @dataLoading = true
 
+        # We should wait until initializations are done
+        # and only trigger the last .setup since
+        # The previous .dataSource belongs to the previous issuable
+        # and the last one will have the **proper** .dataSource property
+        # TODO: Make this a singleton and turn off events when moving to another page
+        setTimeout( =>
+          fetch = @fetchData(@dataSource)
+          fetch.done (data) =>
+            @dataLoading = false
+            @loadData(data)
+        , 1000)
+
+
+  setupAtWho: ->
     # Emoji
-    input.atwho
+    @input.atwho
       at: ':'
       displayTpl: @Emoji.template
       insertTpl: ':${name}:'
 
     # Team Members
-    input.atwho
+    @input.atwho
       at: '@'
       displayTpl: @Members.template
       insertTpl: '${atwho-at}${username}'
@@ -42,7 +68,7 @@ GitLab.GfmAutoComplete =
             title:    sanitize(title)
             search:   sanitize("#{m.username} #{m.name}")
 
-    input.atwho
+    @input.atwho
       at: '#'
       alias: 'issues'
       searchKey: 'search'
@@ -55,7 +81,7 @@ GitLab.GfmAutoComplete =
             title:  sanitize(i.title)
             search: "#{i.iid} #{i.title}"
 
-    input.atwho
+    @input.atwho
       at: '!'
       alias: 'mergerequests'
       searchKey: 'search'
@@ -68,13 +94,18 @@ GitLab.GfmAutoComplete =
             title:  sanitize(m.title)
             search: "#{m.iid} #{m.title}"
 
-    if @dataSource
-      $.getJSON(@dataSource).done (data) ->
-        # load members
-        input.atwho 'load', '@', data.members
-        # load issues
-        input.atwho 'load', 'issues', data.issues
-        # load merge requests
-        input.atwho 'load', 'mergerequests', data.mergerequests
-        # load emojis
-        input.atwho 'load', ':', data.emojis
+  destroyAtWho: ->
+    @input.atwho('destroy')
+
+  fetchData: (dataSource) ->
+    $.getJSON(dataSource)
+
+  loadData: (data) ->
+    # load members
+    @input.atwho 'load', '@', data.members
+    # load issues
+    @input.atwho 'load', 'issues', data.issues
+    # load merge requests
+    @input.atwho 'load', 'mergerequests', data.mergerequests
+    # load emojis
+    @input.atwho 'load', ':', data.emojis
diff --git a/app/assets/javascripts/gl_dropdown.js.coffee b/app/assets/javascripts/gl_dropdown.js.coffee
index 398d3ba4dc8..6ebecf72329 100644
--- a/app/assets/javascripts/gl_dropdown.js.coffee
+++ b/app/assets/javascripts/gl_dropdown.js.coffee
@@ -32,10 +32,8 @@ class GitLabDropdownFilter
       else if @input.val() is "" and $inputContainer.hasClass HAS_VALUE_CLASS
         $inputContainer.removeClass HAS_VALUE_CLASS
 
-      if keyCode is 13 and @input.val() isnt ""
-        if @options.enterCallback
-          @options.enterCallback()
-        return
+      if keyCode is 13
+        return false
 
       clearTimeout timeout
       timeout = setTimeout =>
@@ -132,7 +130,6 @@ class GitLabDropdown
       @filterInput = @getElement(FILTER_INPUT)
       @highlight = false
       @filterInputBlur = true
-      @enterCallback = true
     } = @options
 
     self = @
@@ -157,6 +154,9 @@ class GitLabDropdown
             @fullData = data
 
             @parseData @fullData
+
+            if @options.filterable
+              @filterInput.trigger 'keyup'
         }
 
     # Init filterable
@@ -178,9 +178,6 @@ class GitLabDropdown
         callback: (data) =>
           currentIndex = -1
           @parseData data
-        enterCallback: =>
-          if @enterCallback
-            @selectRowAtIndex 0
 
     # Event listeners
 
diff --git a/app/assets/javascripts/importer_status.js.coffee b/app/assets/javascripts/importer_status.js.coffee
index be8d225e73b..b0edc895649 100644
--- a/app/assets/javascripts/importer_status.js.coffee
+++ b/app/assets/javascripts/importer_status.js.coffee
@@ -4,18 +4,33 @@ class @ImporterStatus
     this.setAutoUpdate()
 
   initStatusPage: ->
-    $(".js-add-to-import").click (event) =>
-      new_namespace = null
-      tr = $(event.currentTarget).closest("tr")
-      id = tr.attr("id").replace("repo_", "")
-      if tr.find(".import-target input").length > 0
-        new_namespace = tr.find(".import-target input").prop("value")
-        tr.find(".import-target").empty().append(new_namespace + "/" + tr.find(".import-target").data("project_name"))
-      $.post @import_url, {repo_id: id, new_namespace: new_namespace}, dataType: 'script'
-
-    $(".js-import-all").click (event) =>
-      $(".js-add-to-import").each ->
-        $(this).click()
+    $('.js-add-to-import')
+      .off 'click'
+      .on 'click', (e) =>
+        new_namespace = null
+        $btn = $(e.currentTarget)
+        $tr = $btn.closest('tr')
+        id = $tr.attr('id').replace('repo_', '')
+        if $tr.find('.import-target input').length > 0
+          new_namespace = $tr.find('.import-target input').prop('value')
+          $tr.find('.import-target').empty().append("#{new_namespace} / #{$tr.find('.import-target').data('project_name')}")
+
+        $btn
+          .disable()
+          .addClass 'is-loading'
+
+        $.post @import_url, {repo_id: id, new_namespace: new_namespace}, dataType: 'script'
+
+    $('.js-import-all')
+      .off 'click'
+      .on 'click', (e) ->
+        $btn = $(@)
+        $btn
+          .disable()
+          .addClass 'is-loading'
+
+        $('.js-add-to-import').each ->
+          $(this).trigger('click')
 
   setAutoUpdate: ->
     setInterval (=>
diff --git a/app/assets/javascripts/issuable_context.js.coffee b/app/assets/javascripts/issuable_context.js.coffee
index 2f19513a831..9ae0cd06039 100644
--- a/app/assets/javascripts/issuable_context.js.coffee
+++ b/app/assets/javascripts/issuable_context.js.coffee
@@ -9,21 +9,30 @@ class @IssuableContext
     $(".issuable-sidebar .inline-update").on "change", ".js-assignee", ->
       $(this).submit()
 
-    $(document).off("click", ".edit-link").on "click",".edit-link", (e) ->
-      $block = $(@).parents('.block')
-      $selectbox = $block.find('.selectbox')
-      if $selectbox.is(':visible')
-        $selectbox.hide()
-        $block.find('.value').show()
-      else
-        $selectbox.show()
-        $block.find('.value').hide()
-
-      if $selectbox.is(':visible')
-        setTimeout (->
-          $block.find('.dropdown-menu-toggle').trigger 'click'
-        ), 0
-      
+    $(document)
+      .off 'click', '.dropdown-content a'
+      .on 'click', '.dropdown-content a', (e) ->
+        e.preventDefault()
+
+    $(document)
+      .off 'click', '.edit-link'
+      .on 'click', '.edit-link', (e) ->
+        e.preventDefault()
+
+        $block = $(@).parents('.block')
+        $selectbox = $block.find('.selectbox')
+        if $selectbox.is(':visible')
+          $selectbox.hide()
+          $block.find('.value').show()
+        else
+          $selectbox.show()
+          $block.find('.value').hide()
+
+        if $selectbox.is(':visible')
+          setTimeout ->
+            $block.find('.dropdown-menu-toggle').trigger 'click'
+          , 0
+
 
     $(".right-sidebar").niceScroll()
 
diff --git a/app/assets/javascripts/labels_select.js.coffee b/app/assets/javascripts/labels_select.js.coffee
index 602fc4be07e..b8282db76b0 100644
--- a/app/assets/javascripts/labels_select.js.coffee
+++ b/app/assets/javascripts/labels_select.js.coffee
@@ -29,13 +29,13 @@ class @LabelsSelect
       if issueUpdateURL
         labelHTMLTemplate = _.template(
             '<% _.each(labels, function(label){ %>
-            <a href="<%= ["",issueURLSplit[1], issueURLSplit[2],""].join("/") %>issues?label_name=<%= label.title %>">
-            <span class="label has-tooltip color-label" title="<%= label.description %>" style="background-color: <%= label.color %>;">
-            <%= label.title %>
+            <a href="<%= ["",issueURLSplit[1], issueURLSplit[2],""].join("/") %>issues?label_name=<%= _.escape(label.title) %>">
+            <span class="label has-tooltip color-label" title="<%= _.escape(label.description) %>" style="background-color: <%= label.color %>;">
+            <%= _.escape(label.title) %>
             </span>
             </a>
             <% }); %>'
-        );
+        )
         labelNoneHTMLTemplate = _.template('<div class="light">None</div>')
 
       if newLabelField.length
@@ -191,7 +191,7 @@ class @LabelsSelect
           "<li>
             <a href='#' class='#{selectedClass}'>
               #{color}
-              #{label.title}
+              #{_.escape(label.title)}
             </a>
           </li>"
         filterable: true
diff --git a/app/assets/javascripts/merge_request_tabs.js.coffee b/app/assets/javascripts/merge_request_tabs.js.coffee
index 1ab6e5114bc..e8613cab72b 100644
--- a/app/assets/javascripts/merge_request_tabs.js.coffee
+++ b/app/assets/javascripts/merge_request_tabs.js.coffee
@@ -183,9 +183,10 @@ class @MergeRequestTabs
       else
         $diffLine = $('td', $diffLine)
 
-      $diffLine.addClass 'hll'
-      diffLineTop = $diffLine.offset().top
-      navBarHeight = $('.navbar-gitlab').outerHeight()
+      if $diffLine.length
+        $diffLine.addClass 'hll'
+        diffLineTop = $diffLine.offset().top
+        navBarHeight = $('.navbar-gitlab').outerHeight()
 
   loadBuilds: (source) ->
     return if @buildsLoaded
diff --git a/app/assets/javascripts/milestone_select.js.coffee b/app/assets/javascripts/milestone_select.js.coffee
index 6bd4e885a03..04fd5cf37bd 100644
--- a/app/assets/javascripts/milestone_select.js.coffee
+++ b/app/assets/javascripts/milestone_select.js.coffee
@@ -24,7 +24,7 @@ class @MilestoneSelect
 
       if issueUpdateURL
         milestoneLinkTemplate = _.template(
-          '<a href="/<%= namespace %>/<%= path %>/milestones/<%= iid %>"><%= title %></a>'
+          '<a href="/<%= namespace %>/<%= path %>/milestones/<%= iid %>"><%= _.escape(title) %></a>'
         )
 
         milestoneLinkNoneTemplate = '<div class="light">None</div>'
@@ -71,7 +71,7 @@ class @MilestoneSelect
             defaultLabel
         fieldName: $dropdown.data('field-name')
         text: (milestone) ->
-          milestone.title
+          _.escape(milestone.title)
         id: (milestone) ->
           if !useId
             milestone.name
diff --git a/app/assets/javascripts/notes.js.coffee b/app/assets/javascripts/notes.js.coffee
index fa91baa07c0..82e210fed7d 100644
--- a/app/assets/javascripts/notes.js.coffee
+++ b/app/assets/javascripts/notes.js.coffee
@@ -75,6 +75,9 @@ class @Notes
     # when issue status changes, we need to refresh data
     $(document).on "issuable:change", @refresh
 
+    # when a key is clicked on the notes
+    $(document).on "keydown", ".js-note-text", @keydownNoteText
+
   cleanBinding: ->
     $(document).off "ajax:success", ".js-main-target-form"
     $(document).off "ajax:success", ".js-discussion-note-form"
@@ -92,10 +95,19 @@ class @Notes
     $(document).off "click", ".js-note-target-reopen"
     $(document).off "click", ".js-note-target-close"
     $(document).off "click", ".js-note-discard"
+    $(document).off "keydown", ".js-note-text"
 
     $('.note .js-task-list-container').taskList('disable')
     $(document).off 'tasklist:changed', '.note .js-task-list-container'
 
+  keydownNoteText: (e) ->
+    $this = $(this)
+    if $this.val() is '' and e.which is 38 #aka the up key
+      myLastNote = $("li.note[data-author-id='#{gon.current_user_id}'][data-editable]:last")
+      if myLastNote.length
+        myLastNoteEditBtn = myLastNote.find('.js-note-edit')
+        myLastNoteEditBtn.trigger('click', [true, myLastNote])
+
   initRefresh: ->
     clearInterval(Notes.interval)
     Notes.interval = setInterval =>
@@ -343,7 +355,7 @@ class @Notes
   Adds a hidden div with the original content of the note to fill the edit note form with
   if the user cancels
   ###
-  showEditForm: (e) ->
+  showEditForm: (e, scrollTo, myLastNote) ->
     e.preventDefault()
     note = $(this).closest(".note")
     note.addClass "is-editting"
@@ -354,9 +366,27 @@ class @Notes
     # Show the attachment delete link
     note.find(".js-note-attachment-delete").show()
 
-    new GLForm form
+    done = ($noteText) ->
+      # Neat little trick to put the cursor at the end
+      noteTextVal = $noteText.val()
+      $noteText.val('').val(noteTextVal);
 
-    form.find(".js-note-text").focus()
+    new GLForm form
+    if scrollTo? and myLastNote?
+      # scroll to the bottom 
+      # so the open of the last element doesn't make a jump
+      $('html, body').scrollTop($(document).height());
+      $('html, body').animate({
+        scrollTop: myLastNote.offset().top - 150  
+      }, 500, ->
+        $noteText = form.find(".js-note-text")
+        $noteText.focus()
+        done($noteText)
+      );
+    else
+      $noteText = form.find('.js-note-text')
+      $noteText.focus()
+      done($noteText)
 
   ###
   Called in response to clicking the edit note link
diff --git a/app/assets/javascripts/profile.js.coffee b/app/assets/javascripts/profile.js.coffee
index f4a2562885d..26a12423521 100644
--- a/app/assets/javascripts/profile.js.coffee
+++ b/app/assets/javascripts/profile.js.coffee
@@ -45,9 +45,10 @@ class @Profile
 
   saveForm: ->
     self = @
-
     formData = new FormData(@form[0])
-    formData.append('user[avatar]', @avatarGlCrop.getBlob(), 'avatar.png')
+
+    avatarBlob = @avatarGlCrop.getBlob()
+    formData.append('user[avatar]', avatarBlob, 'avatar.png') if avatarBlob?
 
     $.ajax
       url: @form.attr('action')
diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss
index 3f015427d07..c303380764b 100644
--- a/app/assets/stylesheets/framework/header.scss
+++ b/app/assets/stylesheets/framework/header.scss
@@ -71,7 +71,7 @@ header {
   .header-content {
     position: relative;
     height: $header-height;
-    padding-right: 20px;
+    padding-right: 40px;
 
     @media (min-width: $screen-sm-min) {
       padding-right: 0;
@@ -122,6 +122,10 @@ header {
     }
   }
 
+  .project-item-select-holder {
+    display: inline;
+  }
+
   .impersonation i {
     color: $red-normal;
   }
diff --git a/app/assets/stylesheets/framework/issue_box.scss b/app/assets/stylesheets/framework/issue_box.scss
index 7f7b7c806e7..8bfc0d583c5 100644
--- a/app/assets/stylesheets/framework/issue_box.scss
+++ b/app/assets/stylesheets/framework/issue_box.scss
@@ -5,7 +5,7 @@
  */
 
 .status-box {
-  
+
   /* Extra small devices (phones, less than 768px) */
   /* No media query since this is the default in Bootstrap */
   padding: 5px 11px;
diff --git a/app/assets/stylesheets/framework/mobile.scss b/app/assets/stylesheets/framework/mobile.scss
index 66180f38a4f..7eb451c124e 100644
--- a/app/assets/stylesheets/framework/mobile.scss
+++ b/app/assets/stylesheets/framework/mobile.scss
@@ -70,13 +70,6 @@
     display: none;
   }
 
-  .issue-details {
-    .creator,
-    .page-title .btn-close {
-      display: none;
-    }
-  }
-
   %ul.notes .note-role, .note-actions {
     display: none;
   }
diff --git a/app/assets/stylesheets/framework/timeline.scss b/app/assets/stylesheets/framework/timeline.scss
index b91f2f6f898..f0ec250de2b 100644
--- a/app/assets/stylesheets/framework/timeline.scss
+++ b/app/assets/stylesheets/framework/timeline.scss
@@ -39,8 +39,7 @@
   .diff-file {
     border: 1px solid $border-color;
     border-bottom: none;
-    margin-left: 0;
-    margin-right: 0;
+    margin: 0;
   }
 }
 
diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss
index 6453c91d955..c8c6bbde084 100644
--- a/app/assets/stylesheets/pages/commits.scss
+++ b/app/assets/stylesheets/pages/commits.scss
@@ -75,6 +75,11 @@ li.commit {
     }
   }
 
+  .item-title {
+    display: inline-block;
+    max-width: 70%;
+  }
+
   .commit-row-description {
     font-size: 14px;
     border-left: 1px solid #eee;
diff --git a/app/assets/stylesheets/pages/detail_page.scss b/app/assets/stylesheets/pages/detail_page.scss
index 5917f089720..2c2ac903f29 100644
--- a/app/assets/stylesheets/pages/detail_page.scss
+++ b/app/assets/stylesheets/pages/detail_page.scss
@@ -1,5 +1,5 @@
 .detail-page-header {
-  padding: 11px 0;
+  padding: $gl-padding-top 0;
   border-bottom: 1px solid $border-color;
   color: #5c5d5e;
   font-size: 16px;
@@ -16,11 +16,6 @@
   .issue_created_ago, .author_link {
     white-space: nowrap;
   }
-
-  .issue-meta {
-    display: inline-block;
-    line-height: 20px;
-  }
 }
 
 .detail-page-description {
diff --git a/app/assets/stylesheets/pages/editor.scss b/app/assets/stylesheets/pages/editor.scss
index 0f0592a0ab8..8981f070a20 100644
--- a/app/assets/stylesheets/pages/editor.scss
+++ b/app/assets/stylesheets/pages/editor.scss
@@ -26,6 +26,10 @@
     line-height: 42px;
     padding-top: 7px;
     padding-bottom: 7px;
+
+    .pull-right {
+      height: 20px;
+    }
   }
 
   .editor-ref {
@@ -53,4 +57,9 @@
   .select2 {
     float: right;
   }
+
+  .encoding-selector,
+  .license-selector {
+    display: inline-block;
+  }
 }
diff --git a/app/assets/stylesheets/pages/import.scss b/app/assets/stylesheets/pages/import.scss
index 6a99cd9cb94..84cc35239f9 100644
--- a/app/assets/stylesheets/pages/import.scss
+++ b/app/assets/stylesheets/pages/import.scss
@@ -16,3 +16,24 @@ i.icon-gitorious-big {
   width: 18px;
   height: 18px;
 }
+
+.import-jobs-from-col,
+.import-jobs-to-col {
+  width: 40%;
+}
+
+.import-jobs-status-col {
+  width: 20%;
+}
+
+.btn-import {
+  .loading-icon {
+    display: none;
+  }
+
+  &.is-loading {
+    .loading-icon {
+      display: inline-block;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index 152b60d1e85..27b58f7e4ab 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -277,10 +277,6 @@
   }
 }
 
-.btn-default.gutter-toggle {
-  margin-top: 4px;
-}
-
 .detail-page-description {
   small {
     color: $gray-darkest;
@@ -326,3 +322,50 @@
     padding-top: 7px;
   }
 }
+
+.issuable-status-box {
+  float: none;
+  display: inline-block;
+  margin-top: 0;
+
+  @media (max-width: $screen-xs-max) {
+    position: absolute;
+    top: 0;
+    left: 0;
+  }
+}
+
+.issuable-header {
+  position: relative;
+  padding-left: 45px;
+  padding-right: 45px;
+  line-height: 35px;
+
+  @media (min-width: $screen-sm-min) {
+    float: left;
+    padding-left: 0;
+    padding-right: 0;
+  }
+}
+
+.issuable-actions {
+  padding-top: 10px;
+
+  @media (min-width: $screen-sm-min) {
+    float: right;
+    padding-top: 0;
+  }
+}
+
+.issuable-gutter-toggle {
+  @media (max-width: $screen-sm-max) {
+    position: absolute;
+    top: 0;
+    right: 0;
+  }
+}
+
+.issuable-meta {
+  display: inline-block;
+  line-height: 18px;
+}
diff --git a/app/assets/stylesheets/pages/issues.scss b/app/assets/stylesheets/pages/issues.scss
index 6a1d28590c2..fc9db97132d 100644
--- a/app/assets/stylesheets/pages/issues.scss
+++ b/app/assets/stylesheets/pages/issues.scss
@@ -86,41 +86,9 @@ form.edit-issue {
 @media (max-width: $screen-xs-max) {
   .issue-btn-group {
     width: 100%;
-    margin-top: 5px;
-
-    .btn-group {
-      width: 100%;
-
-      ul {
-        width: 100%;
-        text-align: center;
-      }
-    }
 
     .btn {
       width: 100%;
-
-      &:first-child:not(:last-child) {
-
-      }
-
-      &:not(:first-child):not(:last-child) {
-        margin-top: 10px;
-      }
-
-      &:last-child:not(:first-child) {
-        margin-top: 10px;
-      }
-    }
-  }
-
-  .issue {
-    &:hover  .issue-actions {
-      display: none !important;
-    }
-
-    .issue-updated-at {
-      display: none;
     }
   }
 }
@@ -133,11 +101,3 @@ form.edit-issue {
   color: $gl-text-color;
   margin-left: 52px;
 }
-
-.editor-details {
-  display: block;
-
-  @media (min-width: $screen-sm-min) {
-    display: inline-block;
-  }
-}
diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss
index 07c707e7b77..2f6d172568b 100644
--- a/app/assets/stylesheets/pages/note_form.scss
+++ b/app/assets/stylesheets/pages/note_form.scss
@@ -42,6 +42,7 @@
 .note-textarea {
   display: block;
   padding: 10px 0;
+  color: $gl-gray;
   font-family: $regular_font;
   border: 0;
 
@@ -61,11 +62,11 @@
     padding: $gl-padding-top $gl-padding;
     border: 1px solid $note-form-border-color;
     border-radius: $border-radius-base;
+    transition: border-color ease-in-out 0.15s,
+                box-shadow ease-in-out 0.15s;
 
     &.is-focused {
-      border-color: $focus-border-color;
-      box-shadow: 0 0 2px $black-transparent,
-                  0 0 4px rgba($focus-border-color, .4);
+      @extend .form-control:focus;
 
       .comment-toolbar,
       .nav-links {
diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss
index ce44f5aa13b..ffcd89a3c9f 100644
--- a/app/assets/stylesheets/pages/notes.scss
+++ b/app/assets/stylesheets/pages/notes.scss
@@ -171,6 +171,11 @@ ul.notes {
 
       &.parallel {
         border-width: 1px;
+
+        .code,
+        code {
+          white-space: pre-wrap;
+        }
       }
 
       .notes {
@@ -198,6 +203,12 @@ ul.notes {
   color: $notes-light-color;
 }
 
+.discussion-headline-light {
+  a {
+    color: $gl-link-color;
+  }
+}
+
 /**
  * Actions for Discussions/Notes
  */
@@ -209,6 +220,17 @@ ul.notes {
   color: $notes-action-color;
 }
 
+.discussion-actions {
+  @media (max-width: $screen-sm-max) {
+    float: none;
+    margin-left: 0;
+
+    .note-action-button {
+      margin-left: 0;
+    }
+  }
+}
+
 .note-action-button,
 .discussion-action-button {
   display: inline-block;
diff --git a/app/assets/stylesheets/print.scss b/app/assets/stylesheets/print.scss
index 1be0551ad3b..a30b6492572 100644
--- a/app/assets/stylesheets/print.scss
+++ b/app/assets/stylesheets/print.scss
@@ -1,17 +1,37 @@
-/* Generic print styles */
-header, nav, nav.main-nav, nav.navbar-collapse, nav.navbar-collapse.collapse {display: none!important;}
-.profiler-results {display: none;}
-
-/* Styles targeted specifically at printing files */
-.tree-ref-holder, .tree-holder .breadcrumb, .blob-commit-info {display: none;}
-.file-title {display: none;}
-.file-holder {border: none;}
-
 .wiki h1, .wiki h2, .wiki h3, .wiki h4, .wiki h5, .wiki h6 {margin-top: 17px; }
 .wiki h1 {font-size: 30px;}
 .wiki h2 {font-size: 22px;}
 .wiki h3 {font-size: 18px; font-weight: bold; }
 
-.sidebar-wrapper { display: none; }
-.nav { display: none; }
-.btn { display: none; }
+header,
+nav,
+nav.main-nav,
+nav.navbar-collapse,
+nav.navbar-collapse.collapse,
+.profiler-results,
+.tree-ref-holder,
+.tree-holder .breadcrumb,
+.blob-commit-info,
+.file-title,
+.file-holder,
+.sidebar-wrapper,
+.nav,
+.btn,
+ul.notes-form,
+.merge-request-ci-status .ci-status-link:after,
+.issuable-gutter-toggle,
+.gutter-toggle,
+.issuable-details .content-block-small,
+.edit-link,
+.note-action-button {
+  display: none!important;
+}
+
+.page-gutter {
+  padding-top: 0;
+  padding-left: 0;
+}
+
+.right-sidebar {
+  top: 0;
+}