Merge remote-tracking branch 'upstream/master' into 27377-preload-pipeline-entity27377-preload-pipeline-entity

* upstream/master: (2534 commits)
  Update VERSION to 9.3.0-pre
  Update CHANGELOG.md for 9.2.0
  removes unnecessary redundacy in usage ping doc
  Respect the typo as rubocop said
  Add a test to ensure this works on MySQL
  Change pipelines schedules help page path
  change domain to hostname in usage ping doc
  Fixes broken MySQL migration for retried
  Show password field mask while editing service settings
  Add notes for supported schedulers and cloud providers
  Move environment monitoring to environments doc
  Add docs for change of Cache/Artifact restore order"
  Avoid resource intensive login checks if password is not provided
  Change translation for 'coding' by 'desarrollo' for Spanish
  Add to docs: issues multiple assignees
  rename "Add emoji" and "Award emoji" to "Add reaction" where appropriate
  Add project and group notification settings info
  32570 Fix border-bottom for project activity tab
  Add users endpoint to frontend API class
  Rename users on mysql
  ...

241 files changed, 1644 insertions, 1628 deletions

diff --git a/app/views/projects/_activity.html.haml b/app/views/projects/_activity.html.haml
index aa0cb3e1a50..f5bb7364d4a 100644
--- a/app/views/projects/_activity.html.haml
+++ b/app/views/projects/_activity.html.haml
@@ -1,7 +1,7 @@
 - @no_container = true
 
 %div{ class: container_class }
-  .nav-block.activity-filter-block
+  .nav-block.activity-filter-block.activities
     .controls
       = link_to namespace_project_path(@project.namespace, @project, rss_url_options), title: "Subscribe", class: 'btn rss-btn has-tooltip' do
         = icon('rss')
diff --git a/app/views/projects/_commit_button.html.haml b/app/views/projects/_commit_button.html.haml
index 640612ca433..b55dc3dce5c 100644
--- a/app/views/projects/_commit_button.html.haml
+++ b/app/views/projects/_commit_button.html.haml
@@ -1,5 +1,5 @@
 .form-actions
-  = button_tag 'Commit Changes', class: 'btn commit-btn js-commit-button btn-create'
+  = button_tag 'Commit changes', class: 'btn commit-btn js-commit-button btn-create'
   = link_to 'Cancel', cancel_path,
             class: 'btn btn-cancel', data: {confirm: leave_edit_message}
 
diff --git a/app/views/projects/_files.html.haml b/app/views/projects/_files.html.haml
index 96c2fa87f45..426085b3e1c 100644
--- a/app/views/projects/_files.html.haml
+++ b/app/views/projects/_files.html.haml
@@ -1,6 +1,14 @@
+- commit = local_assigns.fetch(:commit) { @repository.commit }
+- ref = local_assigns.fetch(:ref) { current_ref }
+- project = local_assigns.fetch(:project) { @project }
 #tree-holder.tree-holder.clearfix
   .nav-block
     = render 'projects/tree/tree_header', tree: @tree
 
-  = render 'projects/tree/tree_content', tree: @tree
+  - if commit
+    .info-well.hidden-xs.project-last-commit.append-bottom-default
+      .well-segment
+        %ul.blob-commit-info
+          = render 'projects/commits/commit', commit: commit, ref: ref, project: project
 
+  = render 'projects/tree/tree_content', tree: @tree
diff --git a/app/views/projects/_find_file_link.html.haml b/app/views/projects/_find_file_link.html.haml
index dbb33090670..3feb11645a0 100644
--- a/app/views/projects/_find_file_link.html.haml
+++ b/app/views/projects/_find_file_link.html.haml
@@ -1,3 +1,3 @@
 = link_to namespace_project_find_file_path(@project.namespace, @project, @ref), class: 'btn btn-grouped shortcuts-find-file', rel: 'nofollow' do
   = icon('search')
-  %span Find File
+  %span Find file
diff --git a/app/views/projects/_fork_suggestion.html.haml b/app/views/projects/_fork_suggestion.html.haml
new file mode 100644
index 00000000000..c855bfaf067
--- /dev/null
+++ b/app/views/projects/_fork_suggestion.html.haml
@@ -0,0 +1,11 @@
+- if current_user
+  .js-file-fork-suggestion-section.file-fork-suggestion.hidden
+    %span.file-fork-suggestion-note
+      You're not allowed to
+      %span.js-file-fork-suggestion-section-action
+        edit
+      files in this project directly. Please fork this project,
+      make your changes there, and submit a merge request.
+    = link_to 'Fork', nil, method: :post, class: 'js-fork-suggestion-button btn btn-grouped btn-inverted btn-new'
+    %button.js-cancel-fork-suggestion-button.btn.btn-grouped{ type: 'button' }
+      Cancel
diff --git a/app/views/projects/_home_panel.html.haml b/app/views/projects/_home_panel.html.haml
index 79a0dc1b959..0fd19780570 100644
--- a/app/views/projects/_home_panel.html.haml
+++ b/app/views/projects/_home_panel.html.haml
@@ -1,6 +1,6 @@
 - empty_repo = @project.empty_repo?
 .project-home-panel.text-center{ class: ("empty-project" if empty_repo) }
-  %div{ class: container_class }
+  .limit-container-width{ class: container_class }
     .avatar-container.s70.project-avatar
       = project_icon(@project, alt: @project.name, class: 'avatar s70 avatar-tile')
     %h1.project-title
diff --git a/app/views/projects/_last_commit.html.haml b/app/views/projects/_last_commit.html.haml
deleted file mode 100644
index e1fea8ccf3d..00000000000
--- a/app/views/projects/_last_commit.html.haml
+++ /dev/null
@@ -1,13 +0,0 @@
-
-- ref = local_assigns.fetch(:ref)
-- status = commit.status(ref)
-- if status
-  = link_to pipelines_namespace_project_commit_path(commit.project.namespace, commit.project, commit), class: "ci-status ci-#{status}" do
-    = ci_icon_for_status(status)
-    = ci_label_for_status(status)
-
-= link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit_short_id"
-= link_to_gfm commit.title, namespace_project_commit_path(project.namespace, project, commit), class: "commit-row-message"
-·
-#{time_ago_with_tooltip(commit.committed_date)} by
-= commit_author_link(commit, avatar: true, size: 24)
diff --git a/app/views/projects/_last_push.html.haml b/app/views/projects/_last_push.html.haml
index a08436715d2..f8a6e98d280 100644
--- a/app/views/projects/_last_push.html.haml
+++ b/app/views/projects/_last_push.html.haml
@@ -5,14 +5,14 @@
         .event-last-push
           .event-last-push-text
             %span You pushed to
-            = link_to namespace_project_commits_path(event.project.namespace, event.project, event.ref_name) do
+            = link_to namespace_project_commits_path(event.project.namespace, event.project, event.ref_name, class: 'commit-sha') do
               %strong= event.ref_name
             - if @project && event.project != @project
               %span at
               %strong= link_to_project event.project
-            = clipboard_button(clipboard_text: event.ref_name, class: 'btn-clipboard btn-transparent', title: 'Copy branch to clipboard')
+            = clipboard_button(text: event.ref_name, class: 'btn-clipboard btn-transparent', title: 'Copy branch to clipboard')
             #{time_ago_with_tooltip(event.created_at)}
 
           .pull-right
-            = link_to new_mr_path_from_push_event(event), title: "New Merge Request", class: "btn btn-info btn-sm" do
-              Create Merge Request
+            = link_to new_mr_path_from_push_event(event), title: "New merge request", class: "btn btn-info btn-sm" do
+              Create merge request
diff --git a/app/views/projects/_md_preview.html.haml b/app/views/projects/_md_preview.html.haml
index 23e27c1105c..d0698285f84 100644
--- a/app/views/projects/_md_preview.html.haml
+++ b/app/views/projects/_md_preview.html.haml
@@ -1,3 +1,5 @@
+- referenced_users = local_assigns.fetch(:referenced_users, nil)
+
 .md-area
   .md-header
     %ul.nav-links.clearfix
@@ -28,9 +30,10 @@
 
   .md-write-holder
     = yield
-  .md.md-preview-holder.js-md-preview.hide{ class: (preview_class if defined?(preview_class)) }
+  .md.md-preview-holder.js-md-preview.hide.md-preview{ data: { url: url } }
+  .referenced-commands.hide
 
-  - if defined?(referenced_users) && referenced_users
+  - if referenced_users
     .referenced-users.hide
       %span
         = icon("exclamation-triangle")
diff --git a/app/views/projects/_readme.html.haml b/app/views/projects/_readme.html.haml
deleted file mode 100644
index b6fb08b68e9..00000000000
--- a/app/views/projects/_readme.html.haml
+++ /dev/null
@@ -1,22 +0,0 @@
-- if readme = @repository.readme
-  %article.readme-holder
-    .pull-right
-      - if can?(current_user, :push_code, @project)
-        = link_to icon('pencil'), namespace_project_edit_blob_path(@project.namespace, @project, tree_join(@repository.root_ref, readme.name)), class: 'light edit-project-readme'
-    .file-content.wiki
-      = cache(readme_cache_key) do
-        = render_readme(readme)
-- else
-  .row-content-block.second-block.center
-    %h3.page-title
-      This project does not have a README yet
-    - if can?(current_user, :push_code, @project)
-      %p
-        A
-        %code README
-        file contains information about other files in a repository and is commonly
-        distributed with computer software, forming part of its documentation.
-      %p
-        We recommend you to
-        = link_to "add a README", add_special_file_path(@project, file_name: 'README.md'), class: 'underlined-link'
-        file to the repository and GitLab will render it here instead of this message.
diff --git a/app/views/projects/_wiki.html.haml b/app/views/projects/_wiki.html.haml
index 41d42740f61..2bab22e125d 100644
--- a/app/views/projects/_wiki.html.haml
+++ b/app/views/projects/_wiki.html.haml
@@ -2,8 +2,7 @@
   %div{ class: container_class }
     .wiki-holder.prepend-top-default.append-bottom-default
       .wiki
-        = preserve do
-          = render_wiki_content(@wiki_home)
+        = render_wiki_content(@wiki_home)
 - else
   - can_create_wiki = can?(current_user, :create_wiki, @project)
   .project-home-empty{ class: [('row-content-block' if can_create_wiki), ('content-block' unless can_create_wiki)] }
diff --git a/app/views/projects/_zen.html.haml b/app/views/projects/_zen.html.haml
index 0c8241053e7..3b3d08ddd3c 100644
--- a/app/views/projects/_zen.html.haml
+++ b/app/views/projects/_zen.html.haml
@@ -1,10 +1,11 @@
 - @gfm_form = true
+- current_text ||= nil
 - supports_slash_commands = local_assigns.fetch(:supports_slash_commands, false)
 .zen-backdrop
   - classes << ' js-gfm-input js-autosize markdown-area'
   - if defined?(f) && f
     = f.text_area attr, class: classes, placeholder: placeholder, data: { supports_slash_commands: supports_slash_commands }
   - else
-    = text_area_tag attr, nil, class: classes, placeholder: placeholder
+    = text_area_tag attr, current_text, class: classes, placeholder: placeholder
   %a.zen-control.zen-control-leave.js-zen-leave{ href: "#" }
     = icon('compress')
diff --git a/app/views/projects/artifacts/_tree_directory.html.haml b/app/views/projects/artifacts/_tree_directory.html.haml
index 9e49c93388a..34d5c3b7285 100644
--- a/app/views/projects/artifacts/_tree_directory.html.haml
+++ b/app/views/projects/artifacts/_tree_directory.html.haml
@@ -3,6 +3,6 @@
 %tr.tree-item{ 'data-link' => path_to_directory }
   %td.tree-item-file-name
     = tree_icon('folder', '755', directory.name)
-    %span.str-truncated
-      = link_to directory.name, path_to_directory
+    = link_to path_to_directory do
+      %span.str-truncated= directory.name
   %td
diff --git a/app/views/projects/artifacts/_tree_file.html.haml b/app/views/projects/artifacts/_tree_file.html.haml
index 36fb4c998c9..ce7e25d774b 100644
--- a/app/views/projects/artifacts/_tree_file.html.haml
+++ b/app/views/projects/artifacts/_tree_file.html.haml
@@ -1,9 +1,10 @@
 - path_to_file = file_namespace_project_build_artifacts_path(@project.namespace, @project, @build, path: file.path)
 
 %tr.tree-item{ 'data-link' => path_to_file }
+  - blob = file.blob
   %td.tree-item-file-name
-    = tree_icon('file', '664', file.name)
-    %span.str-truncated
-      = link_to file.name, path_to_file
+    = tree_icon('file', blob.mode, blob.name)
+    = link_to path_to_file do
+      %span.str-truncated= blob.name
   %td
-    = number_to_human_size(file.metadata[:size], precision: 2)
+    = number_to_human_size(blob.size, precision: 2)
diff --git a/app/views/projects/artifacts/browse.html.haml b/app/views/projects/artifacts/browse.html.haml
index edf55d59f28..9fbb30f7c7c 100644
--- a/app/views/projects/artifacts/browse.html.haml
+++ b/app/views/projects/artifacts/browse.html.haml
@@ -1,13 +1,23 @@
-- page_title 'Artifacts', "#{@build.name} (##{@build.id})", 'Jobs'
+- page_title @path.presence, 'Artifacts', "#{@build.name} (##{@build.id})", 'Jobs'
+= render "projects/pipelines/head"
 
-.top-block.row-content-block.clearfix
-  .pull-right
-    = link_to download_namespace_project_build_artifacts_path(@project.namespace, @project, @build),
-      class: 'btn btn-default download' do
-      = icon('download')
-      Download artifacts archive
+= render "projects/builds/header", show_controls: false
 
 .tree-holder
+  .nav-block
+    .tree-controls
+      = link_to download_namespace_project_build_artifacts_path(@project.namespace, @project, @build),
+        rel: 'nofollow', download: '', class: 'btn btn-default download' do
+        = icon('download')
+        Download artifacts archive
+
+    %ul.breadcrumb.repo-breadcrumb
+      %li
+        = link_to 'Artifacts', browse_namespace_project_build_artifacts_path(@project.namespace, @project, @build)
+      - path_breadcrumbs do |title, path|
+        %li
+          = link_to truncate(title, length: 40), browse_namespace_project_build_artifacts_path(@project.namespace, @project, @build, path)
+
   .tree-content-holder
     %table.table.tree-table
       %thead
diff --git a/app/views/projects/artifacts/file.html.haml b/app/views/projects/artifacts/file.html.haml
new file mode 100644
index 00000000000..d8da83b9a80
--- /dev/null
+++ b/app/views/projects/artifacts/file.html.haml
@@ -0,0 +1,33 @@
+- page_title @path, 'Artifacts', "#{@build.name} (##{@build.id})", 'Jobs'
+= render "projects/pipelines/head"
+
+= render "projects/builds/header", show_controls: false
+
+#tree-holder.tree-holder
+  .nav-block
+    %ul.breadcrumb.repo-breadcrumb
+      %li
+        = link_to 'Artifacts', browse_namespace_project_build_artifacts_path(@project.namespace, @project, @build)
+      - path_breadcrumbs do |title, path|
+        - title = truncate(title, length: 40)
+        %li
+          - if path == @path
+            = link_to file_namespace_project_build_artifacts_path(@project.namespace, @project, @build, path) do
+              %strong= title
+          - else
+            = link_to title, browse_namespace_project_build_artifacts_path(@project.namespace, @project, @build, path)
+
+
+  %article.file-holder
+    - blob = @entry.blob
+    .js-file-title.file-title-flex-parent
+      = render 'projects/blob/header_content', blob: blob
+
+      .file-actions.hidden-xs
+        = render 'projects/blob/viewer_switcher', blob: blob
+
+        .btn-group{ role: "group" }<
+          = copy_blob_source_button(blob)
+          = open_raw_blob_button(blob)
+
+    = render 'projects/blob/content', blob: blob
diff --git a/app/views/projects/blame/show.html.haml b/app/views/projects/blame/show.html.haml
index 4ad77b6266d..a2ec3d44185 100644
--- a/app/views/projects/blame/show.html.haml
+++ b/app/views/projects/blame/show.html.haml
@@ -3,11 +3,11 @@
 = render "projects/commits/head"
 
 %div{ class: container_class }
-  %h3.page-title Blame view
-
   #blob-content-holder.tree-holder
+    = render "projects/blob/breadcrumb", blob: @blob, blame: true
+
     .file-holder
-      = render "projects/blob/header", blob: @blob
+      = render "projects/blob/header", blob: @blob, blame: true
 
       .table-responsive.file-content.blame.code.js-syntax-highlight
         %table
@@ -22,7 +22,7 @@
                     %strong
                       = link_to_gfm truncate(commit.title, length: 35), namespace_project_commit_path(@project.namespace, @project, commit.id), class: "cdark"
                     .pull-right
-                      = link_to commit.short_id, namespace_project_commit_path(@project.namespace, @project, commit), class: "monospace"
+                      = link_to commit.short_id, namespace_project_commit_path(@project.namespace, @project, commit), class: "commit-sha"
                     &nbsp;
                   .light
                     = commit_author_link(commit, avatar: false)
diff --git a/app/views/projects/blob/_auxiliary_viewer.html.haml b/app/views/projects/blob/_auxiliary_viewer.html.haml
new file mode 100644
index 00000000000..9749afdc580
--- /dev/null
+++ b/app/views/projects/blob/_auxiliary_viewer.html.haml
@@ -0,0 +1,5 @@
+- blob = local_assigns.fetch(:blob)
+- auxiliary_viewer = blob.auxiliary_viewer
+- if auxiliary_viewer && auxiliary_viewer.render_error.nil? && auxiliary_viewer.visible_to?(current_user)
+  .well-segment.blob-auxiliary-viewer
+    = render 'projects/blob/viewer', viewer: auxiliary_viewer
diff --git a/app/views/projects/blob/_blob.html.haml b/app/views/projects/blob/_blob.html.haml
index 2b2ee6ed987..8bd336269ff 100644
--- a/app/views/projects/blob/_blob.html.haml
+++ b/app/views/projects/blob/_blob.html.haml
@@ -1,28 +1,13 @@
-.nav-block
-  .tree-ref-holder
-    = render 'shared/ref_switcher', destination: 'blob', path: @path
+= render "projects/blob/breadcrumb", blob: blob
 
-  %ul.breadcrumb.repo-breadcrumb
-    %li
-      = link_to namespace_project_tree_path(@project.namespace, @project, @ref) do
-        = @project.path
-    - tree_breadcrumbs(@tree, 6) do |title, path|
-      %li
-        - if path
-          - if path.end_with?(@path)
-            = link_to namespace_project_blob_path(@project.namespace, @project, path) do
-              %strong
-                = truncate(title, length: 40)
-          - else
-            = link_to truncate(title, length: 40), namespace_project_tree_path(@project.namespace, @project, path)
-        - else
-          = link_to title, '#'
+.info-well.hidden-xs
+  .well-segment
+    %ul.blob-commit-info
+      = render 'projects/commits/commit', commit: @last_commit, project: @project, ref: @ref
 
-%ul.blob-commit-info.hidden-xs
-  - blob_commit = @repository.last_commit_for_path(@commit.id, blob.path)
-  = render blob_commit, project: @project, ref: @ref
+  = render "projects/blob/auxiliary_viewer", blob: blob
 
 #blob-content-holder.blob-content-holder
   %article.file-holder
     = render "projects/blob/header", blob: blob
-    = render blob.to_partial_path(@project), blob: blob
+    = render 'projects/blob/content', blob: blob
diff --git a/app/views/projects/blob/_breadcrumb.html.haml b/app/views/projects/blob/_breadcrumb.html.haml
new file mode 100644
index 00000000000..3f58e8d232f
--- /dev/null
+++ b/app/views/projects/blob/_breadcrumb.html.haml
@@ -0,0 +1,36 @@
+- blame = local_assigns.fetch(:blame, false)
+.nav-block
+  .tree-controls
+    = render 'projects/find_file_link'
+
+    .btn-group.prepend-left-10{ role: "group" }<
+      -# only show normal/blame view links for text files
+      - if blob.readable_text?
+        - if blame
+          = link_to 'Normal view', namespace_project_blob_path(@project.namespace, @project, @id),
+              class: 'btn'
+        - else
+          = link_to 'Blame', namespace_project_blame_path(@project.namespace, @project, @id),
+              class: 'btn js-blob-blame-link' unless blob.empty?
+
+      = link_to 'History', namespace_project_commits_path(@project.namespace, @project, @id),
+          class: 'btn'
+
+      = link_to 'Permalink', namespace_project_blob_path(@project.namespace, @project,
+          tree_join(@commit.sha, @path)), class: 'btn js-data-file-blob-permalink-url'
+
+  .tree-ref-holder
+    = render 'shared/ref_switcher', destination: 'blob', path: @path
+
+  %ul.breadcrumb.repo-breadcrumb
+    %li
+      = link_to namespace_project_tree_path(@project.namespace, @project, @ref) do
+        = @project.path
+    - path_breadcrumbs do |title, path|
+      - title = truncate(title, length: 40)
+      %li
+        - if path == @path
+          = link_to namespace_project_blob_path(@project.namespace, @project, tree_join(@ref, path)) do
+            %strong= title
+        - else
+          = link_to title, namespace_project_tree_path(@project.namespace, @project, tree_join(@ref, path))
diff --git a/app/views/projects/blob/_content.html.haml b/app/views/projects/blob/_content.html.haml
new file mode 100644
index 00000000000..7afbd85cd6d
--- /dev/null
+++ b/app/views/projects/blob/_content.html.haml
@@ -0,0 +1,8 @@
+- simple_viewer = blob.simple_viewer
+- rich_viewer = blob.rich_viewer
+- rich_viewer_active = rich_viewer && params[:viewer] != 'simple'
+
+= render 'projects/blob/viewer', viewer: simple_viewer, hidden: rich_viewer_active
+
+- if rich_viewer
+  = render 'projects/blob/viewer', viewer: rich_viewer, hidden: !rich_viewer_active
diff --git a/app/views/projects/blob/_download.html.haml b/app/views/projects/blob/_download.html.haml
deleted file mode 100644
index 7908fcae3de..00000000000
--- a/app/views/projects/blob/_download.html.haml
+++ /dev/null
@@ -1,7 +0,0 @@
-.file-content.blob_file.blob-no-preview
-  .center
-    = link_to namespace_project_raw_path(@project.namespace, @project, @id) do
-      %h1.light
-        %i.fa.fa-download
-      %h4
-        Download (#{number_to_human_size blob_size(blob)})
diff --git a/app/views/projects/blob/_editor.html.haml b/app/views/projects/blob/_editor.html.haml
index e7adef5558a..4b344b2edb9 100644
--- a/app/views/projects/blob/_editor.html.haml
+++ b/app/views/projects/blob/_editor.html.haml
@@ -1,29 +1,23 @@
+- action = current_action?(:edit) || current_action?(:update) ? 'edit' : 'create'
+
 .file-holder.file.append-bottom-default
-  .js-file-title.file-title.clearfix
+  .js-file-title.file-title.clearfix{ data: { current_action: action } }
     .editor-ref
       = icon('code-fork')
       = ref
     %span.editor-file-name
       - if current_action?(:edit) || current_action?(:update)
         = text_field_tag 'file_path', (params[:file_path] || @path),
-                                      class: 'form-control new-file-path'
+                                      class: 'form-control new-file-path js-file-path-name-input'
 
     - if current_action?(:new) || current_action?(:create)
       %span.editor-file-name
         \/
       = text_field_tag 'file_name', params[:file_name], placeholder: "File name",
-        required: true, class: 'form-control new-file-name'
+        required: true, class: 'form-control new-file-name js-file-path-name-input'
 
     .pull-right.file-buttons
-      .license-selector.js-license-selector-wrap.hidden
-        = dropdown_tag("Choose a License template", options: { toggle_class: 'btn js-license-selector', title: "Choose a license", filter: true, placeholder: "Filter", data: { data: licenses_for_select, project: @project.name, fullname: @project.namespace.human_name } } )
-      .gitignore-selector.js-gitignore-selector-wrap.hidden
-        = dropdown_tag("Choose a .gitignore template", options: { toggle_class: 'btn js-gitignore-selector', title: "Choose a template", filter: true, placeholder: "Filter", data: { data: gitignore_names } } )
-      .gitlab-ci-yml-selector.js-gitlab-ci-yml-selector-wrap.hidden
-        = dropdown_tag("Choose a GitLab CI Yaml template", options: { toggle_class: 'btn js-gitlab-ci-yml-selector', title: "Choose a template", filter: true, placeholder: "Filter", data: { data: gitlab_ci_ymls } } )
-      .dockerfile-selector.js-dockerfile-selector-wrap.hidden
-        = dropdown_tag("Choose a Dockerfile template", options: { toggle_class: 'btn js-dockerfile-selector', title: "Choose a template", filter: true, placeholder: "Filter", data: { data: dockerfile_names } } )
-      = button_tag class: 'soft-wrap-toggle btn', type: 'button' do
+      = button_tag class: 'soft-wrap-toggle btn', type: 'button', tabindex: '-1' do
         %span.no-wrap
           = custom_icon('icon_no_wrap')
           No wrap
@@ -31,7 +25,7 @@
           = custom_icon('icon_soft_wrap')
           Soft wrap
       .encoding-selector
-        = select_tag :encoding, options_for_select([ "base64", "text" ], "text"), class: 'select2'
+        = select_tag :encoding, options_for_select([ "base64", "text" ], "text"), class: 'select2', tabindex: '-1'
 
   .file-editor.code
     %pre.js-edit-mode-pane#editor= params[:content] || local_assigns[:blob_data]
diff --git a/app/views/projects/blob/_header.html.haml b/app/views/projects/blob/_header.html.haml
index deeeae3d64a..0be15cc179f 100644
--- a/app/views/projects/blob/_header.html.haml
+++ b/app/views/projects/blob/_header.html.haml
@@ -1,39 +1,19 @@
+- blame = local_assigns.fetch(:blame, false)
 .js-file-title.file-title-flex-parent
-  .file-header-content
-    = blob_icon blob.mode, blob.name
-
-    %strong.file-title-name
-      = blob.name
-
-    = copy_file_path_button(blob.path)
-
-    %small
-      = number_to_human_size(blob_size(blob))
+  = render 'projects/blob/header_content', blob: blob
 
   .file-actions.hidden-xs
+    = render 'projects/blob/viewer_switcher', blob: blob unless blame
+
     .btn-group{ role: "group" }<
-      = copy_blob_content_button(blob) if blob_text_viewable?(blob)
-      = open_raw_file_button(namespace_project_raw_path(@project.namespace, @project, @id))
+      = copy_blob_source_button(blob) unless blame
+      = open_raw_blob_button(blob)
       = view_on_environment_button(@commit.sha, @path, @environment) if @environment
 
     .btn-group{ role: "group" }<
-      -# only show normal/blame view links for text files
-      - if blob_text_viewable?(blob)
-        - if current_page? namespace_project_blame_path(@project.namespace, @project, @id)
-          = link_to 'Normal View', namespace_project_blob_path(@project.namespace, @project, @id),
-              class: 'btn btn-sm'
-        - else
-          = link_to 'Blame', namespace_project_blame_path(@project.namespace, @project, @id),
-              class: 'btn btn-sm js-blob-blame-link' unless blob.empty?
-
-      = link_to 'History', namespace_project_commits_path(@project.namespace, @project, @id),
-          class: 'btn btn-sm'
-
-      = link_to 'Permalink', namespace_project_blob_path(@project.namespace, @project,
-          tree_join(@commit.sha, @path)), class: 'btn btn-sm js-data-file-blob-permalink-url'
-
-    - if current_user
-      .btn-group{ role: "group" }<
-        = edit_blob_link if blob_text_viewable?(blob)
+      = edit_blob_link
+      - if current_user
         = replace_blob_link
         = delete_blob_link
+
+= render 'projects/fork_suggestion'
diff --git a/app/views/projects/blob/_header_content.html.haml b/app/views/projects/blob/_header_content.html.haml
new file mode 100644
index 00000000000..98bedae650a
--- /dev/null
+++ b/app/views/projects/blob/_header_content.html.haml
@@ -0,0 +1,10 @@
+.file-header-content
+  = blob_icon blob.mode, blob.name
+
+  %strong.file-title-name
+    = blob.name
+
+  = copy_file_path_button(blob.path)
+
+  %small
+    = number_to_human_size(blob.raw_size)
diff --git a/app/views/projects/blob/_image.html.haml b/app/views/projects/blob/_image.html.haml
deleted file mode 100644
index ea3cecb86a9..00000000000
--- a/app/views/projects/blob/_image.html.haml
+++ /dev/null
@@ -1,15 +0,0 @@
-.file-content.image_file
-  - if blob.svg?
-    - if blob.size_within_svg_limits?
-      -# We need to scrub SVG but we cannot do so in the RawController: it would
-      -# be wrong/strange if RawController modified the data.
-      - blob.load_all_data!(@repository)
-      - blob = sanitize_svg(blob)
-      %img{ src: "data:#{blob.mime_type};base64,#{Base64.encode64(blob.data)}", alt: "#{blob.name}" }
-    - else
-      .nothing-here-block
-        The SVG could not be displayed as it is too large, you can
-        #{link_to('view the raw file', namespace_project_raw_path(@project.namespace, @project, @id), target: '_blank', rel: 'noopener noreferrer')}
-        instead.
-  - else
-    %img{ src: namespace_project_raw_path(@project.namespace, @project, tree_join(@commit.id, blob.path)), alt: "#{blob.name}" }
diff --git a/app/views/projects/blob/_render_error.html.haml b/app/views/projects/blob/_render_error.html.haml
new file mode 100644
index 00000000000..9eef6cafd04
--- /dev/null
+++ b/app/views/projects/blob/_render_error.html.haml
@@ -0,0 +1,7 @@
+.file-content.code
+  .nothing-here-block
+    The #{viewer.switcher_title} could not be displayed because #{blob_render_error_reason(viewer)}.
+
+    You can
+    = blob_render_error_options(viewer).to_sentence(two_words_connector: ' or ', last_word_connector: ', or ').html_safe
+    instead.
diff --git a/app/views/projects/blob/_template_selectors.html.haml b/app/views/projects/blob/_template_selectors.html.haml
new file mode 100644
index 00000000000..2a178325041
--- /dev/null
+++ b/app/views/projects/blob/_template_selectors.html.haml
@@ -0,0 +1,17 @@
+.template-selectors-menu
+  .templates-selectors-label
+    Template
+  .template-selector-dropdowns-wrap
+    .template-type-selector.js-template-type-selector-wrap.hidden
+      = dropdown_tag("Choose type", options: { toggle_class: 'btn js-template-type-selector', title: "Choose a template type" } )
+    .license-selector.js-license-selector-wrap.js-template-selector-wrap.hidden
+      = dropdown_tag("Apply a license template", options: { toggle_class: 'btn js-license-selector', title: "Apply a license", filter: true, placeholder: "Filter", data: { data: licenses_for_select, project: @project.name, fullname: @project.namespace.human_name } } )
+    .gitignore-selector.js-gitignore-selector-wrap.js-template-selector-wrap.hidden
+      = dropdown_tag("Apply a .gitignore template", options: { toggle_class: 'btn js-gitignore-selector', title: "Apply a template", filter: true, placeholder: "Filter", data: { data: gitignore_names } } )
+    .gitlab-ci-yml-selector.js-gitlab-ci-yml-selector-wrap.js-template-selector-wrap.hidden
+      = dropdown_tag("Apply a GitLab CI Yaml template", options: { toggle_class: 'btn js-gitlab-ci-yml-selector', title: "Apply a template", filter: true, placeholder: "Filter", data: { data: gitlab_ci_ymls } } )
+    .dockerfile-selector.js-dockerfile-selector-wrap.js-template-selector-wrap.hidden
+      = dropdown_tag("Apply a Dockerfile template", options: { toggle_class: 'btn js-dockerfile-selector', title: "Apply a template", filter: true, placeholder: "Filter", data: { data: dockerfile_names } } )
+  .template-selectors-undo-menu.hidden
+    %span.text-info Template applied
+    %button.btn.btn-sm.btn-info Undo
diff --git a/app/views/projects/blob/_text.html.haml b/app/views/projects/blob/_text.html.haml
deleted file mode 100644
index 7b16d266982..00000000000
--- a/app/views/projects/blob/_text.html.haml
+++ /dev/null
@@ -1,19 +0,0 @@
-- if blob.only_display_raw?
-  .file-content.code
-    .nothing-here-block
-      File too large, you can
-      = succeed '.' do
-        = link_to 'view the raw file', namespace_project_raw_path(@project.namespace, @project, @id), target: '_blank', rel: 'noopener noreferrer'
-
-- else
-  - blob.load_all_data!(@repository)
-
-  - if blob.empty?
-    .file-content.code
-      .nothing-here-block Empty file
-  - else
-    - if markup?(blob.name)
-      .file-content.wiki
-        = render_markup(blob.name, blob.data)
-    - else
-      = render 'shared/file_highlight', blob: blob, repository: @repository
diff --git a/app/views/projects/blob/_viewer.html.haml b/app/views/projects/blob/_viewer.html.haml
new file mode 100644
index 00000000000..4252f27d007
--- /dev/null
+++ b/app/views/projects/blob/_viewer.html.haml
@@ -0,0 +1,13 @@
+- hidden = local_assigns.fetch(:hidden, false)
+- render_error = viewer.render_error
+- load_async = local_assigns.fetch(:load_async, viewer.load_async?)
+
+- viewer_url = local_assigns.fetch(:viewer_url) { url_for(params.merge(viewer: viewer.type, format: :json)) } if load_async
+.blob-viewer{ data: { type: viewer.type, url: viewer_url }, class: ('hidden' if hidden) }
+  - if load_async
+    = render viewer.loading_partial_path, viewer: viewer
+  - elsif render_error
+    = render 'projects/blob/render_error', viewer: viewer
+  - else
+    - viewer.prepare!
+    = render viewer.partial_path, viewer: viewer
diff --git a/app/views/projects/blob/_viewer_switcher.html.haml b/app/views/projects/blob/_viewer_switcher.html.haml
new file mode 100644
index 00000000000..6a521069418
--- /dev/null
+++ b/app/views/projects/blob/_viewer_switcher.html.haml
@@ -0,0 +1,12 @@
+- if blob.show_viewer_switcher?
+  - simple_viewer = blob.simple_viewer
+  - rich_viewer = blob.rich_viewer
+
+  .btn-group.js-blob-viewer-switcher{ role: "group" }
+    - simple_label = "Display #{simple_viewer.switcher_title}"
+    %button.btn.btn-default.btn-sm.js-blob-viewer-switch-btn.has-tooltip{ 'aria-label' => simple_label, title: simple_label, data: { viewer: 'simple', container: 'body' } }>
+      = icon(simple_viewer.switcher_icon)
+
+    - rich_label = "Display #{rich_viewer.switcher_title}"
+    %button.btn.btn-default.btn-sm.js-blob-viewer-switch-btn.has-tooltip{ 'aria-label' => rich_label, title: rich_label, data: { viewer: 'rich', container: 'body' } }>
+      = icon(rich_viewer.switcher_icon)
diff --git a/app/views/projects/blob/edit.html.haml b/app/views/projects/blob/edit.html.haml
index afe0b5dba45..4af62461151 100644
--- a/app/views/projects/blob/edit.html.haml
+++ b/app/views/projects/blob/edit.html.haml
@@ -9,14 +9,17 @@
   - if @conflict
     .alert.alert-danger
       Someone edited the file the same time you did. Please check out
-      = link_to "the file", namespace_project_blob_path(@project.namespace, @project, tree_join(@target_branch, @file_path)), target: "_blank", rel: 'noopener noreferrer'
+      = link_to "the file", namespace_project_blob_path(@project.namespace, @project, tree_join(@branch_name, @file_path)), target: "_blank", rel: 'noopener noreferrer'
       and make sure your changes will not unintentionally remove theirs.
-
+  .editor-title-row
+    %h3.page-title.blob-edit-page-title
+      Edit file
+    = render 'template_selectors'
   .file-editor
     %ul.nav-links.no-bottom.js-edit-mode
       %li.active
         = link_to '#editor' do
-          Edit File
+          Write
 
       %li
         = link_to '#preview', 'data-preview-url' => namespace_project_preview_blob_path(@project.namespace, @project, @id) do
diff --git a/app/views/projects/blob/new.html.haml b/app/views/projects/blob/new.html.haml
index 4c449e040ee..2afb909572a 100644
--- a/app/views/projects/blob/new.html.haml
+++ b/app/views/projects/blob/new.html.haml
@@ -2,10 +2,10 @@
 - content_for :page_specific_javascripts do
   = page_specific_javascript_tag('lib/ace.js')
   = page_specific_javascript_bundle_tag('blob')
-
-%h3.page-title
-  New File
-
+.editor-title-row
+  %h3.page-title.blob-new-page-title
+    New file
+  = render 'template_selectors'
 .file-editor
   = form_tag(namespace_project_create_blob_path(@project.namespace, @project, @id), method: :post, class: 'form-horizontal js-edit-blob-form js-new-blob-form js-quick-submit js-requires-input', data: blob_editor_paths) do
     = render 'projects/blob/editor', ref: @ref
diff --git a/app/views/projects/blob/preview.html.haml b/app/views/projects/blob/preview.html.haml
index 5cafb644b40..da2cef17e8a 100644
--- a/app/views/projects/blob/preview.html.haml
+++ b/app/views/projects/blob/preview.html.haml
@@ -1,12 +1,8 @@
-.diff-file
+.diff-file.file-holder
   .diff-content
-    - if gitlab_markdown?(@blob.name)
+    - if markup?(@blob.name)
       .file-content.wiki
-        = preserve do
-          = markdown(@content)
-    - elsif markup?(@blob.name)
-      .file-content.wiki
-        = raw render_markup(@blob.name, @content)
+        = markup(@blob.name, @content)
     - else
       .file-content.code.js-syntax-highlight
         - unless @diff_lines.empty?
diff --git a/app/views/projects/blob/show.html.haml b/app/views/projects/blob/show.html.haml
index b6738c3380f..67f57b5e4b9 100644
--- a/app/views/projects/blob/show.html.haml
+++ b/app/views/projects/blob/show.html.haml
@@ -2,13 +2,16 @@
 - page_title @blob.path, @ref
 = render "projects/commits/head"
 
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('blob')
+
 %div{ class: container_class }
   = render 'projects/last_push'
 
   #tree-holder.tree-holder
     = render 'blob', blob: @blob
 
-  - if can_edit_blob?(@blob)
+  - if can_modify_blob?(@blob)
     = render 'projects/blob/remove'
 
     - title = "Replace #{@blob.name}"
diff --git a/app/views/projects/blob/viewers/_balsamiq.html.haml b/app/views/projects/blob/viewers/_balsamiq.html.haml
new file mode 100644
index 00000000000..28670e7de97
--- /dev/null
+++ b/app/views/projects/blob/viewers/_balsamiq.html.haml
@@ -0,0 +1,4 @@
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('balsamiq_viewer')
+
+.file-content.balsamiq-viewer#js-balsamiq-viewer{ data: { endpoint: blob_raw_url } }
diff --git a/app/views/projects/blob/viewers/_changelog.html.haml b/app/views/projects/blob/viewers/_changelog.html.haml
new file mode 100644
index 00000000000..53921e63b5f
--- /dev/null
+++ b/app/views/projects/blob/viewers/_changelog.html.haml
@@ -0,0 +1,4 @@
+= icon('history fw')
+= succeed '.' do
+  To find the state of this project's repository at the time of any of these versions, check out
+  = link_to "the tags", namespace_project_tags_path(viewer.project.namespace, viewer.project)
diff --git a/app/views/projects/blob/viewers/_contributing.html.haml b/app/views/projects/blob/viewers/_contributing.html.haml
new file mode 100644
index 00000000000..c78f04c9c7c
--- /dev/null
+++ b/app/views/projects/blob/viewers/_contributing.html.haml
@@ -0,0 +1,9 @@
+= icon('book fw')
+After you've reviewed these contribution guidelines, you'll be all set to
+
+- options = contribution_options(viewer.project)
+- if options.any?
+  = succeed '.' do
+    = options.to_sentence(two_words_connector: ' or ', last_word_connector: ', or ').html_safe
+- else
+  contribute to this project.
diff --git a/app/views/projects/blob/viewers/_dependency_manager.html.haml b/app/views/projects/blob/viewers/_dependency_manager.html.haml
new file mode 100644
index 00000000000..a0f0215a5ff
--- /dev/null
+++ b/app/views/projects/blob/viewers/_dependency_manager.html.haml
@@ -0,0 +1,11 @@
+= icon('cubes fw')
+= succeed '.' do
+  This project manages its dependencies using
+  %strong= viewer.manager_name
+
+  - if viewer.package_name
+    and defines a #{viewer.package_type} named
+    %strong<
+      = link_to viewer.package_name, viewer.package_url, target: '_blank', rel: 'noopener noreferrer'
+
+= link_to 'Learn more', viewer.manager_url, target: '_blank', rel: 'noopener noreferrer'
diff --git a/app/views/projects/blob/viewers/_download.html.haml b/app/views/projects/blob/viewers/_download.html.haml
new file mode 100644
index 00000000000..684240d02c7
--- /dev/null
+++ b/app/views/projects/blob/viewers/_download.html.haml
@@ -0,0 +1,7 @@
+.file-content.blob_file.blob-no-preview
+  .center
+    = link_to blob_raw_url do
+      %h1.light
+        = icon('download')
+      %h4
+        Download (#{number_to_human_size(viewer.blob.raw_size)})
diff --git a/app/views/projects/blob/viewers/_empty.html.haml b/app/views/projects/blob/viewers/_empty.html.haml
new file mode 100644
index 00000000000..a293a8de231
--- /dev/null
+++ b/app/views/projects/blob/viewers/_empty.html.haml
@@ -0,0 +1,3 @@
+.file-content.code
+  .nothing-here-block
+    Empty file
diff --git a/app/views/projects/blob/viewers/_gitlab_ci_yml.html.haml b/app/views/projects/blob/viewers/_gitlab_ci_yml.html.haml
new file mode 100644
index 00000000000..28c5be6ebf3
--- /dev/null
+++ b/app/views/projects/blob/viewers/_gitlab_ci_yml.html.haml
@@ -0,0 +1,9 @@
+- if viewer.valid?
+  = icon('check fw')
+  This GitLab CI configuration is valid.
+- else
+  = icon('warning fw')
+  This GitLab CI configuration is invalid:
+  = viewer.validation_message
+
+= link_to 'Learn more', help_page_path('ci/yaml/README')
diff --git a/app/views/projects/blob/viewers/_gitlab_ci_yml_loading.html.haml b/app/views/projects/blob/viewers/_gitlab_ci_yml_loading.html.haml
new file mode 100644
index 00000000000..10cbf6a2f7a
--- /dev/null
+++ b/app/views/projects/blob/viewers/_gitlab_ci_yml_loading.html.haml
@@ -0,0 +1,4 @@
+= icon('spinner spin fw')
+Validating GitLab CI configuration…
+
+= link_to 'Learn more', help_page_path('ci/yaml/README')
diff --git a/app/views/projects/blob/viewers/_image.html.haml b/app/views/projects/blob/viewers/_image.html.haml
new file mode 100644
index 00000000000..640d59b3174
--- /dev/null
+++ b/app/views/projects/blob/viewers/_image.html.haml
@@ -0,0 +1,2 @@
+.file-content.image_file
+  %img{ src: blob_raw_url, alt: viewer.blob.name }
diff --git a/app/views/projects/blob/viewers/_license.html.haml b/app/views/projects/blob/viewers/_license.html.haml
new file mode 100644
index 00000000000..fb9d0b99d09
--- /dev/null
+++ b/app/views/projects/blob/viewers/_license.html.haml
@@ -0,0 +1,8 @@
+- license = viewer.license
+
+= icon('balance-scale fw')
+This project is licensed under the
+= succeed '.' do
+  %strong= license.name
+
+= link_to 'Learn more', license.url, target: '_blank', rel: 'noopener noreferrer'
diff --git a/app/views/projects/blob/viewers/_loading.html.haml b/app/views/projects/blob/viewers/_loading.html.haml
new file mode 100644
index 00000000000..120c0540335
--- /dev/null
+++ b/app/views/projects/blob/viewers/_loading.html.haml
@@ -0,0 +1,2 @@
+.text-center.prepend-top-default.append-bottom-default
+  = icon('spinner spin 2x', 'aria-hidden' => 'true', 'aria-label' => 'Loading content…')
diff --git a/app/views/projects/blob/viewers/_loading_auxiliary.html.haml b/app/views/projects/blob/viewers/_loading_auxiliary.html.haml
new file mode 100644
index 00000000000..c7dc9e3250a
--- /dev/null
+++ b/app/views/projects/blob/viewers/_loading_auxiliary.html.haml
@@ -0,0 +1,2 @@
+= icon('spinner spin fw')
+Analyzing file…
diff --git a/app/views/projects/blob/viewers/_markup.html.haml b/app/views/projects/blob/viewers/_markup.html.haml
new file mode 100644
index 00000000000..230305b488d
--- /dev/null
+++ b/app/views/projects/blob/viewers/_markup.html.haml
@@ -0,0 +1,4 @@
+- blob = viewer.blob
+- rendered_markup = blob.rendered_markup if blob.respond_to?(:rendered_markup)
+.file-content.wiki
+  = markup(blob.name, blob.data, rendered: rendered_markup)
diff --git a/app/views/projects/blob/_notebook.html.haml b/app/views/projects/blob/viewers/_notebook.html.haml
index ab1cf933944..2399fb16265 100644
--- a/app/views/projects/blob/_notebook.html.haml
+++ b/app/views/projects/blob/viewers/_notebook.html.haml
@@ -2,4 +2,4 @@
   = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag('notebook_viewer')
 
-.file-content#js-notebook-viewer{ data: { endpoint: namespace_project_raw_path(@project.namespace, @project, @id) } }
+.file-content#js-notebook-viewer{ data: { endpoint: blob_raw_url } }
diff --git a/app/views/projects/blob/viewers/_pdf.html.haml b/app/views/projects/blob/viewers/_pdf.html.haml
new file mode 100644
index 00000000000..1dd179c4fdc
--- /dev/null
+++ b/app/views/projects/blob/viewers/_pdf.html.haml
@@ -0,0 +1,5 @@
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
+  = page_specific_javascript_bundle_tag('pdf_viewer')
+
+.file-content#js-pdf-viewer{ data: { endpoint: blob_raw_url } }
diff --git a/app/views/projects/blob/viewers/_readme.html.haml b/app/views/projects/blob/viewers/_readme.html.haml
new file mode 100644
index 00000000000..334b33faf48
--- /dev/null
+++ b/app/views/projects/blob/viewers/_readme.html.haml
@@ -0,0 +1,4 @@
+= icon('info-circle fw')
+= succeed '.' do
+  To learn more about this project, read
+  = link_to "the wiki", namespace_project_wikis_path(viewer.project.namespace, viewer.project)
diff --git a/app/views/projects/blob/viewers/_route_map.html.haml b/app/views/projects/blob/viewers/_route_map.html.haml
new file mode 100644
index 00000000000..d0fcd55f6c1
--- /dev/null
+++ b/app/views/projects/blob/viewers/_route_map.html.haml
@@ -0,0 +1,9 @@
+- if viewer.valid?
+  = icon('check fw')
+  This Route Map is valid.
+- else
+  = icon('warning fw')
+  This Route Map is invalid:
+  = viewer.validation_message
+
+= link_to 'Learn more', help_page_path('ci/environments', anchor: 'route-map')
diff --git a/app/views/projects/blob/viewers/_route_map_loading.html.haml b/app/views/projects/blob/viewers/_route_map_loading.html.haml
new file mode 100644
index 00000000000..2318cf82f58
--- /dev/null
+++ b/app/views/projects/blob/viewers/_route_map_loading.html.haml
@@ -0,0 +1,4 @@
+= icon('spinner spin fw')
+Validating Route Map…
+
+= link_to 'Learn more', help_page_path('ci/environments', anchor: 'route-map')
diff --git a/app/views/projects/blob/viewers/_sketch.html.haml b/app/views/projects/blob/viewers/_sketch.html.haml
new file mode 100644
index 00000000000..49f716c2c59
--- /dev/null
+++ b/app/views/projects/blob/viewers/_sketch.html.haml
@@ -0,0 +1,7 @@
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
+  = page_specific_javascript_bundle_tag('sketch_viewer')
+
+.file-content#js-sketch-viewer{ data: { endpoint: blob_raw_url } }
+  .js-loading-icon.text-center.prepend-top-default.append-bottom-default.js-loading-icon{ 'aria-label' => 'Loading Sketch preview' }
+    = icon('spinner spin 2x', 'aria-hidden' => 'true');
diff --git a/app/views/projects/blob/viewers/_stl.html.haml b/app/views/projects/blob/viewers/_stl.html.haml
new file mode 100644
index 00000000000..e4e9d746176
--- /dev/null
+++ b/app/views/projects/blob/viewers/_stl.html.haml
@@ -0,0 +1,12 @@
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('stl_viewer')
+
+.file-content.is-stl-loading
+  .text-center#js-stl-viewer{ data: { endpoint: blob_raw_url } }
+    = icon('spinner spin 2x', class: 'prepend-top-default append-bottom-default', 'aria-hidden' => 'true', 'aria-label' => 'Loading')
+  .text-center.prepend-top-default.append-bottom-default.stl-controls
+    .btn-group
+      %button.btn.btn-default.btn-sm.js-material-changer{ data: { type: 'wireframe' } }
+        Wireframe
+      %button.btn.btn-default.btn-sm.active.js-material-changer{ data: { type: 'default' } }
+        Solid
diff --git a/app/views/projects/blob/viewers/_svg.html.haml b/app/views/projects/blob/viewers/_svg.html.haml
new file mode 100644
index 00000000000..62f647581b6
--- /dev/null
+++ b/app/views/projects/blob/viewers/_svg.html.haml
@@ -0,0 +1,4 @@
+- blob = viewer.blob
+- data = sanitize_svg_data(blob.data)
+.file-content.image_file
+  %img{ src: "data:#{blob.mime_type};base64,#{Base64.encode64(data)}", alt: blob.name }
diff --git a/app/views/projects/blob/viewers/_text.html.haml b/app/views/projects/blob/viewers/_text.html.haml
new file mode 100644
index 00000000000..a91df321ca0
--- /dev/null
+++ b/app/views/projects/blob/viewers/_text.html.haml
@@ -0,0 +1 @@
+= render 'shared/file_highlight', blob: viewer.blob, repository: @repository
diff --git a/app/views/projects/blob/viewers/_video.html.haml b/app/views/projects/blob/viewers/_video.html.haml
new file mode 100644
index 00000000000..595a890a27d
--- /dev/null
+++ b/app/views/projects/blob/viewers/_video.html.haml
@@ -0,0 +1,2 @@
+.file-content.video
+  %video{ src: blob_raw_url, controls: true, data: { setup: '{}' } }
diff --git a/app/views/projects/boards/_show.html.haml b/app/views/projects/boards/_show.html.haml
index added3f669b..efec69662f3 100644
--- a/app/views/projects/boards/_show.html.haml
+++ b/app/views/projects/boards/_show.html.haml
@@ -3,13 +3,11 @@
 - page_title "Boards"
 
 - content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('common_vue')
-  = page_specific_javascript_bundle_tag('filtered_search')
-  = page_specific_javascript_bundle_tag('boards')
-  = page_specific_javascript_bundle_tag('simulate_drag') if Rails.env.test?
+  = webpack_bundle_tag 'common_vue'
+  = webpack_bundle_tag 'filtered_search'
+  = webpack_bundle_tag 'boards'
 
   %script#js-board-template{ type: "text/x-template" }= render "projects/boards/components/board"
-  %script#js-board-list-template{ type: "text/x-template" }= render "projects/boards/components/board_list"
   %script#js-board-modal-filter{ type: "text/x-template" }= render "shared/issuable/search_bar", type: :boards_modal
 
 = render "projects/issues/head"
diff --git a/app/views/projects/boards/components/_board.html.haml b/app/views/projects/boards/components/_board.html.haml
index 5a4eaf92b16..bc5c727bf0d 100644
--- a/app/views/projects/boards/components/_board.html.haml
+++ b/app/views/projects/boards/components/_board.html.haml
@@ -13,8 +13,8 @@
             %button.btn.btn-small.btn-default.pull-right.has-tooltip{ type: "button",
               "@click" => "showNewIssueForm",
               "v-if" => 'list.type !== "closed"',
-              "aria-label" => "Add an issue",
-              "title" => "Add an issue",
+              "aria-label" => "New issue",
+              "title" => "New issue",
               data: { placement: "top", container: "body" } }
               = icon("plus")
         - if can?(current_user, :admin_list, @project)
diff --git a/app/views/projects/boards/components/_board_list.html.haml b/app/views/projects/boards/components/_board_list.html.haml
deleted file mode 100644
index 4a0b2110601..00000000000
--- a/app/views/projects/boards/components/_board_list.html.haml
+++ /dev/null
@@ -1,26 +0,0 @@
-.board-list-component
-  .board-list-loading.text-center{ "v-if" => "loading" }
-    = icon("spinner spin")
-  - if can? current_user, :create_issue, @project
-    %board-new-issue{ ":list" => "list",
-      "v-if" => 'list.type !== "closed" && showIssueForm' }
-  %ul.board-list{ "ref" => "list",
-    "v-show" => "!loading",
-    ":data-board" => "list.id",
-    ":class" => '{ "is-smaller": showIssueForm }' }
-    %board-card{ "v-for" => "(issue, index) in issues",
-      "ref" => "issue",
-      ":index" => "index",
-      ":list" => "list",
-      ":issue" => "issue",
-      ":issue-link-base" => "issueLinkBase",
-      ":root-path" => "rootPath",
-      ":disabled" => "disabled",
-      ":key" => "issue.id" }
-    %li.board-list-count.text-center{ "v-if" => "showCount",
-      "data-issue-id" => "-1" }
-      = icon("spinner spin", "v-show" => "list.loadingMore" )
-      %span{ "v-if" => "list.issues.length === list.issuesSize" }
-        Showing all issues
-      %span{ "v-else" => true }
-        Showing {{ list.issues.length }} of {{ list.issuesSize }} issues
diff --git a/app/views/projects/boards/components/sidebar/_assignee.html.haml b/app/views/projects/boards/components/sidebar/_assignee.html.haml
index e75ce305440..48f8c656080 100644
--- a/app/views/projects/boards/components/sidebar/_assignee.html.haml
+++ b/app/views/projects/boards/components/sidebar/_assignee.html.haml
@@ -1,39 +1,27 @@
-.block.assignee
-  .title.hide-collapsed
-    Assignee
-    - if can?(current_user, :admin_issue, @project)
-      = icon("spinner spin", class: "block-loading")
-      = link_to "Edit", "#", class: "edit-link pull-right"
-  .value.hide-collapsed
-    %span.assign-yourself.no-value{ "v-if" => "!issue.assignee" }
-      No assignee
-      - if can?(current_user, :admin_issue, @project)
-        \-
-        %a.js-assign-yourself{ href: "#" }
-          assign yourself
-    %a.author_link.bold{ ":href" => "'#{root_url}' + issue.assignee.username",
-      "v-if" => "issue.assignee" }
-      %img.avatar.avatar-inline.s32{ ":src" => "issue.assignee.avatar",
-        width: "32", alt: "Avatar" }
-      %span.author
-        {{ issue.assignee.name }}
-      %span.username
-        = precede "@" do
-          {{ issue.assignee.username }}
+.block.assignee{ ref: "assigneeBlock" }
+  %template{ "v-if" => "issue.assignees" }
+    %assignee-title{ ":number-of-assignees" => "issue.assignees.length",
+      ":loading" => "loadingAssignees",
+      ":editable" => can?(current_user, :admin_issue, @project) }
+    %assignees.value{ "root-path" => "#{root_url}",
+      ":users" => "issue.assignees",
+      ":editable" => can?(current_user, :admin_issue, @project),
+      "@assign-self" => "assignSelf" }
+
   - if can?(current_user, :admin_issue, @project)
     .selectbox.hide-collapsed
-      %input{ type: "hidden",
-        name: "issue[assignee_id]",
-        id: "issue_assignee_id",
-        ":value" => "issue.assignee.id",
-        "v-if" => "issue.assignee" }
+      %input.js-vue{ type: "hidden",
+        name: "issue[assignee_ids][]",
+        ":value" => "assignee.id",
+        "v-if" => "issue.assignees",
+        "v-for" => "assignee in issue.assignees" }
       .dropdown
-        %button.dropdown-menu-toggle.js-user-search.js-author-search.js-issue-board-sidebar{ type: "button", data: { toggle: "dropdown", field_name: "issue[assignee_id]", first_user: (current_user.username if current_user), current_user: "true", project_id: @project.id, null_user: "true" },
+        %button.dropdown-menu-toggle.js-user-search.js-author-search.js-multiselect.js-save-user-data.js-issue-board-sidebar{ type: "button", ref: "assigneeDropdown", data: { toggle: "dropdown", field_name: "issue[assignee_ids][]", first_user: (current_user.username if current_user), current_user: "true", project_id: @project.id, null_user: "true", multi_select: "true", 'max-select' => 1, dropdown: { header: 'Assignee' } },
           ":data-issuable-id" => "issue.id",
           ":data-issue-update" => "'#{namespace_project_issues_path(@project.namespace, @project)}/' + issue.id + '.json'" }
           Select assignee
           = icon("chevron-down")
-        .dropdown-menu.dropdown-menu-user.dropdown-menu-selectable.dropdown-menu-author
+        .dropdown-menu.dropdown-select.dropdown-menu-user.dropdown-menu-selectable.dropdown-menu-author
           = dropdown_title("Assign to")
           = dropdown_filter("Search users")
           = dropdown_content
diff --git a/app/views/projects/boards/components/sidebar/_labels.html.haml b/app/views/projects/boards/components/sidebar/_labels.html.haml
index 0f0a84c156d..bee0f3dd065 100644
--- a/app/views/projects/boards/components/sidebar/_labels.html.haml
+++ b/app/views/projects/boards/components/sidebar/_labels.html.haml
@@ -19,7 +19,7 @@
         ":value" => "label.id" }
       .dropdown
         %button.dropdown-menu-toggle.js-label-select.js-multiselect.js-issue-board-sidebar{ type: "button",
-          data: { toggle: "dropdown", field_name: "issue[label_names][]", show_no: "true", show_any: "true", project_id: @project.id, labels: namespace_project_labels_path(@project.namespace, @project, :json), namespace_path: @project.try(:namespace).try(:path), project_path: @project.try(:path) },
+          data: { toggle: "dropdown", field_name: "issue[label_names][]", show_no: "true", show_any: "true", project_id: @project.id, labels: namespace_project_labels_path(@project.namespace, @project, :json), namespace_path: @project.try(:namespace).try(:full_path), project_path: @project.try(:path) },
           ":data-issue-update" => "'#{namespace_project_issues_path(@project.namespace, @project)}/' + issue.id + '.json'" }
           %span.dropdown-toggle-text
             Label
diff --git a/app/views/projects/boards/components/sidebar/_milestone.html.haml b/app/views/projects/boards/components/sidebar/_milestone.html.haml
index 008d1186478..4e46351bf8a 100644
--- a/app/views/projects/boards/components/sidebar/_milestone.html.haml
+++ b/app/views/projects/boards/components/sidebar/_milestone.html.haml
@@ -16,13 +16,14 @@
         name: "issue[milestone_id]",
         "v-if" => "issue.milestone" }
       .dropdown
-        %button.dropdown-menu-toggle.js-milestone-select.js-issue-board-sidebar{ type: "button", data: { toggle: "dropdown", show_no: "true", field_name: "issue[milestone_id]", project_id: @project.id, milestones: namespace_project_milestones_path(@project.namespace, @project, :json), ability_name: "issue", use_id: "true" },
+        %button.dropdown-menu-toggle.js-milestone-select.js-issue-board-sidebar{ type: "button", data: { toggle: "dropdown", show_no: "true", field_name: "issue[milestone_id]", project_id: @project.id, milestones: namespace_project_milestones_path(@project.namespace, @project, :json), ability_name: "issue", use_id: "true", default_no: "true" },
+          ":data-selected" => "milestoneTitle",
           ":data-issuable-id" => "issue.id",
           ":data-issue-update" => "'#{namespace_project_issues_path(@project.namespace, @project)}/' + issue.id + '.json'" }
           Milestone
           = icon("chevron-down")
         .dropdown-menu.dropdown-select.dropdown-menu-selectable
-          = dropdown_title("Assignee milestone")
+          = dropdown_title("Assign milestone")
           = dropdown_filter("Search milestones")
           = dropdown_content
           = dropdown_loading
diff --git a/app/views/projects/branches/_branch.html.haml b/app/views/projects/branches/_branch.html.haml
index 9eb610ba9c0..304c512e1b5 100644
--- a/app/views/projects/branches/_branch.html.haml
+++ b/app/views/projects/branches/_branch.html.haml
@@ -6,7 +6,8 @@
 - merge_project = can?(current_user, :create_merge_request, @project) ? @project : (current_user && current_user.fork_of(@project))
 %li{ class: "js-branch-#{branch.name}" }
   %div
-    = link_to namespace_project_tree_path(@project.namespace, @project, branch.name), class: 'item-title str-truncated' do
+    = link_to namespace_project_tree_path(@project.namespace, @project, branch.name), class: 'item-title str-truncated ref-name' do
+      = icon('code-fork')
       = branch.name
     &nbsp;
     - if branch.name == @repository.root_ref
@@ -15,13 +16,13 @@
       %span.label.label-info.has-tooltip{ title: "Merged into #{@repository.root_ref}" }
         merged
 
-    - if @project.protected_branch? branch.name
+    - if protected_branch?(@project, branch)
       %span.label.label-success
         protected
     .controls.hidden-xs<
       - if merge_project && create_mr_button?(@repository.root_ref, branch.name)
         = link_to create_mr_path(@repository.root_ref, branch.name), class: 'btn btn-default' do
-          Merge Request
+          Merge request
 
       - if branch.name != @repository.root_ref
         = link_to namespace_project_compare_index_path(@project.namespace, @project, from: @repository.root_ref, to: branch.name), class: "btn btn-default #{'prepend-left-10' unless merge_project}", method: :post, title: "Compare" do
@@ -30,13 +31,34 @@
       = render 'projects/buttons/download', project: @project, ref: branch.name, pipeline: @refs_pipelines[branch.name]
 
       - if can?(current_user, :push_code, @project)
-        = link_to namespace_project_branch_path(@project.namespace, @project, branch.name),
-          class: "btn btn-remove remove-row js-ajax-loading-spinner #{can_remove_branch?(@project, branch.name) ? '' : 'disabled'}",
-          method: :delete,
-          data: { confirm: "Deleting the '#{branch.name}' branch cannot be undone. Are you sure?" },
-          remote: true,
-          "aria-label" => "Delete branch" do
-          = icon("trash-o")
+        - if branch.name == @project.repository.root_ref
+          %button{ class: "btn btn-remove remove-row js-ajax-loading-spinner has-tooltip disabled",
+            disabled: true,
+            title: "The default branch cannot be deleted" }
+            = icon("trash-o")
+        - elsif protected_branch?(@project, branch)
+          - if can?(current_user, :delete_protected_branch, @project)
+            %button{ class: "btn btn-remove remove-row js-ajax-loading-spinner has-tooltip",
+              title: "Delete protected branch",
+              data: { toggle: "modal",
+                target: "#modal-delete-branch",
+                delete_path: namespace_project_branch_path(@project.namespace, @project, branch.name),
+                branch_name: branch.name } }
+              = icon("trash-o")
+          - else
+            %button{ class: "btn btn-remove remove-row js-ajax-loading-spinner has-tooltip disabled",
+              disabled: true,
+              title: "Only a project master or owner can delete a protected branch" }
+              = icon("trash-o")
+        - else
+          = link_to namespace_project_branch_path(@project.namespace, @project, branch.name),
+            class: "btn btn-remove remove-row js-ajax-loading-spinner has-tooltip",
+            title: "Delete branch",
+            method: :delete,
+            data: { confirm: "Deleting the '#{branch.name}' branch cannot be undone. Are you sure?" },
+            remote: true,
+            "aria-label" => "Delete branch" do
+            = icon("trash-o")
 
     - if branch.name != @repository.root_ref
       .divergence-graph{ title: "#{number_commits_ahead} commits ahead, #{number_commits_behind} commits behind #{@repository.root_ref}" }
diff --git a/app/views/projects/branches/_commit.html.haml b/app/views/projects/branches/_commit.html.haml
index de607772df6..ad8f9da0621 100644
--- a/app/views/projects/branches/_commit.html.haml
+++ b/app/views/projects/branches/_commit.html.haml
@@ -1,7 +1,7 @@
 .branch-commit
   .icon-container.commit-icon
     = custom_icon("icon_commit")
-  = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-id monospace"
+  = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-sha"
   &middot;
   %span.str-truncated
     = link_to_gfm commit.title, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-row-message"
diff --git a/app/views/projects/branches/_delete_protected_modal.html.haml b/app/views/projects/branches/_delete_protected_modal.html.haml
new file mode 100644
index 00000000000..c5888afa54d
--- /dev/null
+++ b/app/views/projects/branches/_delete_protected_modal.html.haml
@@ -0,0 +1,34 @@
+#modal-delete-branch.modal{ tabindex: -1 }
+  .modal-dialog
+    .modal-content
+      .modal-header
+        %button.close{ data: { dismiss: 'modal' } } ×
+        %h3.page-title
+          Delete protected branch
+          = surround "'", "'?" do
+            %span.js-branch-name>[branch name]
+
+      .modal-body
+        %p
+          You’re about to permanently delete the protected branch
+          = succeed '.' do
+            %strong.js-branch-name [branch name]
+        %p
+          Once you confirm and press
+          = succeed ',' do
+            %strong Delete protected branch
+          it cannot be undone or recovered.
+        %p
+          %strong To confirm, type
+          %kbd.js-branch-name [branch name]
+
+        .form-group
+        = text_field_tag 'delete_branch_input', '', class: 'form-control js-delete-branch-input'
+
+      .modal-footer
+        %button.btn{ data: { dismiss: 'modal' } } Cancel
+        = link_to 'Delete protected branch', '',
+          class: "btn btn-danger js-delete-branch",
+          title: 'Delete branch',
+          method: :delete,
+          "aria-label" => "Delete"
diff --git a/app/views/projects/branches/index.html.haml b/app/views/projects/branches/index.html.haml
index bd1f2d96f56..4bade77a077 100644
--- a/app/views/projects/branches/index.html.haml
+++ b/app/views/projects/branches/index.html.haml
@@ -15,16 +15,14 @@
       .dropdown.inline>
         %button.dropdown-menu-toggle{ type: 'button', 'data-toggle' => 'dropdown' }
           %span.light
-            = projects_sort_options_hash[@sort]
+            = branches_sort_options_hash[@sort]
           = icon('chevron-down')
-        %ul.dropdown-menu.dropdown-menu-align-right
-          %li
-            = link_to filter_branches_path(sort: sort_value_name) do
-              = sort_title_name
-            = link_to filter_branches_path(sort: sort_value_recently_updated) do
-              = sort_title_recently_updated
-            = link_to filter_branches_path(sort: sort_value_oldest_updated) do
-              = sort_title_oldest_updated
+        %ul.dropdown-menu.dropdown-menu-align-right.dropdown-menu-selectable
+          %li.dropdown-header
+            Sort by
+          - branches_sort_options_hash.each do |value, title|
+            %li
+              = link_to title, filter_branches_path(sort: value), class: ("is-active" if @sort == value)
 
       - if can? current_user, :push_code, @project
         = link_to namespace_project_merged_branches_path(@project.namespace, @project), class: 'btn btn-inverted btn-remove has-tooltip', title: "Delete all branches that are merged into '#{@project.repository.root_ref}'", method: :delete, data: { confirm: "Deleting the merged branches cannot be undone. Are you sure?", container: 'body' } do
@@ -39,3 +37,5 @@
     = paginate @branches, theme: 'gitlab'
   - else
     .nothing-here-block No branches to show
+
+= render 'projects/branches/delete_protected_modal'
diff --git a/app/views/projects/branches/new.html.haml b/app/views/projects/branches/new.html.haml
index d3c3e40d518..5a0eba3551f 100644
--- a/app/views/projects/branches/new.html.haml
+++ b/app/views/projects/branches/new.html.haml
@@ -1,4 +1,5 @@
 - page_title "New Branch"
+- default_ref = params[:ref] || @project.default_branch
 
 - if @error
   .alert.alert-danger
@@ -16,12 +17,13 @@
       .help-block.text-danger.js-branch-name-error
   .form-group
     = label_tag :ref, 'Create from', class: 'control-label'
-    .col-sm-10
-      = hidden_field_tag :ref, params[:ref] || @project.default_branch
-      = dropdown_tag(params[:ref] || @project.default_branch,
-                     options: { toggle_class: 'js-branch-select wide',
-                                filter: true, dropdown_class: "dropdown-menu-selectable", placeholder: "Search branches",
-                                data: { selected: params[:ref] || @project.default_branch, field_name: 'ref' } })
+    .col-sm-10.create-from
+      .dropdown
+        = hidden_field_tag :ref, default_ref
+        = button_tag type: 'button', title: default_ref, class: 'dropdown-menu-toggle wide form-control js-branch-select git-revision-dropdown-toggle', required: true, data: { toggle: 'dropdown', selected: default_ref, field_name: 'ref' } do
+          .text-left.dropdown-toggle-text= default_ref
+          = icon('chevron-down')
+        = render 'shared/ref_dropdown', dropdown_class: 'wide'
       .help-block Existing branch name, tag, or commit SHA
   .form-actions
     = button_tag 'Create branch', class: 'btn btn-create', tabindex: 3
diff --git a/app/views/projects/builds/_header.html.haml b/app/views/projects/builds/_header.html.haml
index 7eb17e887e7..d4cdb709b97 100644
--- a/app/views/projects/builds/_header.html.haml
+++ b/app/views/projects/builds/_header.html.haml
@@ -1,25 +1,31 @@
+- show_controls = local_assigns.fetch(:show_controls, true)
+- pipeline = @build.pipeline
+
 .content-block.build-header.top-area
   .header-content
-    = render 'ci/status/badge', status: @build.detailed_status(current_user), link: false
-    Job
-    %strong.js-build-id ##{@build.id}
+    = render 'ci/status/badge', status: @build.detailed_status(current_user), link: false, title: @build.status_title
+    %strong
+      Job
+      = link_to "##{@build.id}", namespace_project_build_path(@project.namespace, @project, @build), class: 'js-build-id'
     in pipeline
-    = link_to pipeline_path(@build.pipeline) do
-      %strong ##{@build.pipeline.id}
-    for commit
-    = link_to namespace_project_commit_path(@project.namespace, @project, @build.pipeline.sha) do
-      %strong= @build.pipeline.short_sha
+    %strong
+      = link_to "##{pipeline.id}", pipeline_path(pipeline)
+    for
+    %strong
+      = link_to pipeline.short_sha, namespace_project_commit_path(@project.namespace, @project, pipeline.sha), class: 'commit-sha'
     from
-    = link_to namespace_project_commits_path(@project.namespace, @project, @build.ref) do
-      %code
-        = @build.ref
-    - if @build.user
-      = render "user"
+    %strong
+      = link_to @build.ref, project_ref_path(@project, @build.ref), class: 'ref-name'
+
+    = render "projects/builds/user" if @build.user
+
     = time_ago_with_tooltip(@build.created_at)
-  .nav-controls
-    - if can?(current_user, :create_issue, @project) && @build.failed?
-      = link_to "New issue", new_namespace_project_issue_path(@project.namespace, @project, issue: build_failed_issue_options), class: 'btn btn-new btn-inverted'
-    - if can?(current_user, :update_build, @build) && @build.retryable?
-      = link_to "Retry job", retry_namespace_project_build_path(@project.namespace, @project, @build), class: 'btn btn-inverted-secondary', method: :post
-  %button.btn.btn-default.pull-right.visible-xs-block.visible-sm-block.build-gutter-toggle.js-sidebar-build-toggle{ role: "button", type: "button" }
-    = icon('angle-double-left')
+
+  - if show_controls
+    .nav-controls
+      - if can?(current_user, :create_issue, @project) && @build.failed?
+        = link_to "New issue", new_namespace_project_issue_path(@project.namespace, @project, issue: build_failed_issue_options), class: 'btn btn-new btn-inverted'
+      - if can?(current_user, :update_build, @build) && @build.retryable?
+        = link_to "Retry job", retry_namespace_project_build_path(@project.namespace, @project, @build), class: 'btn btn-inverted-secondary', method: :post
+    %button.btn.btn-default.pull-right.visible-xs-block.visible-sm-block.build-gutter-toggle.js-sidebar-build-toggle{ role: "button", type: "button" }
+      = icon('angle-double-left')
diff --git a/app/views/projects/builds/_sidebar.html.haml b/app/views/projects/builds/_sidebar.html.haml
index b597c7f7a12..8032d81cd91 100644
--- a/app/views/projects/builds/_sidebar.html.haml
+++ b/app/views/projects/builds/_sidebar.html.haml
@@ -1,6 +1,6 @@
 - builds = @build.pipeline.builds.to_a
 
-%aside.right-sidebar.right-sidebar-expanded.build-sidebar.js-build-sidebar.js-right-sidebar{ data: { "offset-top" => "153", "spy" => "affix" } }
+%aside.right-sidebar.right-sidebar-expanded.build-sidebar.js-build-sidebar.js-right-sidebar{ data: { "offset-top" => "101", "spy" => "affix" } }
   .block.build-sidebar-header.visible-xs-block.visible-sm-block.append-bottom-default
     Job
     %strong ##{@build.id}
@@ -33,7 +33,7 @@
               = link_to keep_namespace_project_build_artifacts_path(@project.namespace, @project, @build), class: 'btn btn-sm btn-default', method: :post do
                 Keep
 
-            = link_to download_namespace_project_build_artifacts_path(@project.namespace, @project, @build), class: 'btn btn-sm btn-default' do
+            = link_to download_namespace_project_build_artifacts_path(@project.namespace, @project, @build), rel: 'nofollow', download: '', class: 'btn btn-sm btn-default' do
               Download
 
             - if @build.artifacts_metadata?
@@ -48,7 +48,7 @@
       - if @build.merge_request
         %p.build-detail-row
           %span.build-light-text Merge Request:
-          = link_to "#{@build.merge_request.to_reference}", merge_request_path(@build.merge_request)
+          = link_to "#{@build.merge_request.to_reference}", merge_request_path(@build.merge_request), class: 'bold'
       - if @build.duration
         %p.build-detail-row
           %span.build-light-text Duration:
@@ -68,7 +68,7 @@
         - elsif @build.runner
           \##{@build.runner.id}
       .btn-group.btn-group-justified{ role: :group }
-        - if @build.has_trace_file?
+        - if @build.has_trace?
           = link_to 'Raw', raw_namespace_project_build_path(@project.namespace, @project, @build), class: 'btn btn-sm btn-default'
         - if @build.active?
           = link_to "Cancel", cancel_namespace_project_build_path(@project.namespace, @project, @build), class: 'btn btn-sm btn-default', method: :post
diff --git a/app/views/projects/builds/_table.html.haml b/app/views/projects/builds/_table.html.haml
index acfdb250aff..82806f022ee 100644
--- a/app/views/projects/builds/_table.html.haml
+++ b/app/views/projects/builds/_table.html.haml
@@ -20,6 +20,6 @@
           %th Coverage
           %th
 
-      = render partial: "projects/ci/builds/build", collection: builds, as: :build, locals: { commit_sha: true, ref: true, pipeline_link: true, stage: true, allow_retry: true, coverage: admin || project.build_coverage_enabled?, admin: admin }
+      = render partial: "projects/ci/builds/build", collection: builds, as: :build, locals: { commit_sha: true, ref: true, pipeline_link: true, stage: true, allow_retry: true, admin: admin }
 
   = paginate builds, theme: 'gitlab'
diff --git a/app/views/projects/builds/index.html.haml b/app/views/projects/builds/index.html.haml
index 5ffc0e20d10..a8c8afe2695 100644
--- a/app/views/projects/builds/index.html.haml
+++ b/app/views/projects/builds/index.html.haml
@@ -14,10 +14,10 @@
             data: { confirm: 'Are you sure?' }, class: 'btn btn-danger', method: :post
 
         - unless @repository.gitlab_ci_yml
-          = link_to 'Get started with CI/CD Pipelines', help_page_path('ci/quick_start/README'), class: 'btn btn-info'
+          = link_to 'Get started with Pipelines', help_page_path('ci/quick_start/README'), class: 'btn btn-info'
 
         = link_to ci_lint_path, class: 'btn btn-default' do
-          %span CI Lint
+          %span CI lint
 
   .content-list.builds-content-list
     = render "table", builds: @builds, project: @project
diff --git a/app/views/projects/builds/show.html.haml b/app/views/projects/builds/show.html.haml
index d5fe771613c..7cb2ec83cc7 100644
--- a/app/views/projects/builds/show.html.haml
+++ b/app/views/projects/builds/show.html.haml
@@ -71,6 +71,11 @@
                   = custom_icon('scroll_down_hover_active')
         #up-build-trace
         %pre.build-trace#build-trace
+          .js-truncated-info.truncated-info.hidden<
+            Showing last
+            %span.js-truncated-info-size.truncated-info-size><
+            KiB of log -
+            %a.js-raw-link.raw-link{ :href => raw_namespace_project_build_path(@project.namespace, @project, @build) }>< Complete Raw
           %code.bash.js-build-output
           .build-loader-animation.js-build-refresh
 
diff --git a/app/views/projects/ci/builds/_build.html.haml b/app/views/projects/ci/builds/_build.html.haml
index 09286a1b3c6..e796920ac82 100644
--- a/app/views/projects/ci/builds/_build.html.haml
+++ b/app/views/projects/ci/builds/_build.html.haml
@@ -1,109 +1,110 @@
+- job = build.present(current_user: current_user)
+- pipeline = job.pipeline
 - admin = local_assigns.fetch(:admin, false)
 - ref = local_assigns.fetch(:ref, nil)
 - commit_sha = local_assigns.fetch(:commit_sha, nil)
 - retried = local_assigns.fetch(:retried, false)
 - pipeline_link = local_assigns.fetch(:pipeline_link, false)
 - stage = local_assigns.fetch(:stage, false)
-- coverage = local_assigns.fetch(:coverage, false)
 - allow_retry = local_assigns.fetch(:allow_retry, false)
 
 %tr.build.commit{ class: ('retried' if retried) }
   %td.status
-    = render "ci/status/badge", status: build.detailed_status(current_user)
+    = render "ci/status/badge", status: job.detailed_status(current_user), title: job.status_title
 
   %td.branch-commit
-    - if can?(current_user, :read_build, build)
-      = link_to namespace_project_build_url(build.project.namespace, build.project, build) do
-        %span.build-link ##{build.id}
+    - if can?(current_user, :read_build, job)
+      = link_to namespace_project_build_url(job.project.namespace, job.project, job) do
+        %span.build-link ##{job.id}
     - else
-      %span.build-link ##{build.id}
+      %span.build-link ##{job.id}
 
     - if ref
-      - if build.ref
+      - if job.ref
         .icon-container
-          = build.tag? ? icon('tag') : icon('code-fork')
-        = link_to build.ref, namespace_project_commits_path(build.project.namespace, build.project, build.ref), class: "monospace branch-name"
+          = job.tag? ? icon('tag') : icon('code-fork')
+        = link_to job.ref, project_ref_path(job.project, job.ref), class: "ref-name"
       - else
         .light none
       .icon-container.commit-icon
         = custom_icon("icon_commit")
 
     - if commit_sha
-      = link_to build.short_sha, namespace_project_commit_path(build.project.namespace, build.project, build.sha), class: "commit-id monospace"
+      = link_to job.short_sha, namespace_project_commit_path(job.project.namespace, job.project, job.sha), class: "commit-sha"
 
-    - if build.stuck?
+    - if job.stuck?
       = icon('warning', class: 'text-warning has-tooltip', title: 'Job is stuck. Check runners.')
 
     - if retried
-      = icon('refresh', class: 'text-warning has-tooltip', title: 'Job was retried')
+      = icon('spinner', class: 'text-warning has-tooltip', title: 'Job was retried')
 
     .label-container
-      - if build.tags.any?
-        - build.tags.each do |tag|
+      - if job.tags.any?
+        - job.tags.each do |tag|
           %span.label.label-primary
             = tag
-      - if build.try(:trigger_request)
+      - if job.try(:trigger_request)
         %span.label.label-info triggered
-      - if build.try(:allow_failure)
+      - if job.try(:allow_failure)
         %span.label.label-danger allowed to fail
-      - if build.action?
+      - if job.action?
         %span.label.label-info manual
 
   - if pipeline_link
     %td
-      = link_to pipeline_path(build.pipeline) do
-        %span.pipeline-id ##{build.pipeline.id}
+      = link_to pipeline_path(pipeline) do
+        %span.pipeline-id ##{pipeline.id}
       %span by
-      - if build.pipeline.user
-        = user_avatar(user: build.pipeline.user, size: 20)
+      - if pipeline.user
+        = user_avatar(user: pipeline.user, size: 20)
       - else
-        %span.monospace API
+        %span.api API
 
   - if admin
     %td
-      - if build.project
-        = link_to build.project.name_with_namespace, admin_namespace_project_path(build.project.namespace, build.project)
+      - if job.project
+        = link_to job.project.name_with_namespace, admin_namespace_project_path(job.project.namespace, job.project)
     %td
-      - if build.try(:runner)
-        = runner_link(build.runner)
+      - if job.try(:runner)
+        = runner_link(job.runner)
       - else
         .light none
 
   - if stage
     %td
-      = build.stage
+      = job.stage
 
   %td
-    = build.name
+    = job.name
 
   %td
-    - if build.duration
+    - if job.duration
       %p.duration
         = custom_icon("icon_timer")
-        = duration_in_numbers(build.duration)
+        = duration_in_numbers(job.duration)
 
-    - if build.finished_at
+    - if job.finished_at
       %p.finished-at
         = icon("calendar")
-        %span= time_ago_with_tooltip(build.finished_at)
+        %span= time_ago_with_tooltip(job.finished_at)
 
   %td.coverage
-    - if coverage && build.try(:coverage)
-      #{build.coverage}%
+    - if job.try(:coverage)
+      #{job.coverage}%
 
   %td
     .pull-right
-      - if can?(current_user, :read_build, build) && build.artifacts?
-        = link_to download_namespace_project_build_artifacts_path(build.project.namespace, build.project, build), title: 'Download artifacts', class: 'btn btn-build' do
+      - if can?(current_user, :read_build, job) && job.artifacts?
+        = link_to download_namespace_project_build_artifacts_path(job.project.namespace, job.project, job), rel: 'nofollow', download: '', title: 'Download artifacts', class: 'btn btn-build' do
           = icon('download')
-      - if can?(current_user, :update_build, build)
-        - if build.active?
-          = link_to cancel_namespace_project_build_path(build.project.namespace, build.project, build, return_to: request.original_url), method: :post, title: 'Cancel', class: 'btn btn-build' do
+      - if can?(current_user, :update_build, job)
+        - if job.active?
+          = link_to cancel_namespace_project_build_path(job.project.namespace, job.project, job, return_to: request.original_url), method: :post, title: 'Cancel', class: 'btn btn-build' do
             = icon('remove', class: 'cred')
         - elsif allow_retry
-          - if build.playable? && !admin
-            = link_to play_namespace_project_build_path(build.project.namespace, build.project, build, return_to: request.original_url), method: :post, title: 'Play', class: 'btn btn-build' do
+          - if job.playable? && !admin && can?(current_user, :update_build, job)
+            = link_to play_namespace_project_build_path(job.project.namespace, job.project, job, return_to: request.original_url), method: :post, title: 'Play', class: 'btn btn-build' do
               = custom_icon('icon_play')
-          - elsif build.retryable?
-            = link_to retry_namespace_project_build_path(build.project.namespace, build.project, build, return_to: request.original_url), method: :post, title: 'Retry', class: 'btn btn-build' do
+          - elsif job.retryable?
+            = link_to retry_namespace_project_build_path(job.project.namespace, job.project, job, return_to: request.original_url), method: :post, title: 'Retry', class: 'btn btn-build' do
               = icon('repeat')
diff --git a/app/views/projects/commit/_commit_box.html.haml b/app/views/projects/commit/_commit_box.html.haml
index a0a292d0508..0aef5822f81 100644
--- a/app/views/projects/commit/_commit_box.html.haml
+++ b/app/views/projects/commit/_commit_box.html.haml
@@ -1,7 +1,9 @@
 .page-content-header
   .header-main-content
-    %strong Commit #{@commit.short_id}
-    = clipboard_button(clipboard_text: @commit.id, title: "Copy commit SHA to clipboard")
+    %strong
+      Commit
+      %span.commit-sha= @commit.short_id
+    = clipboard_button(text: @commit.id, title: "Copy commit SHA to clipboard")
     %span.hidden-xs authored
     #{time_ago_with_tooltip(@commit.authored_date)}
     %span by
@@ -20,7 +22,7 @@
         = icon('comment')
         = @notes_count
     = link_to namespace_project_tree_path(@project.namespace, @project, @commit), class: "btn btn-default append-right-10 hidden-xs hidden-sm" do
-      Browse Files
+      Browse files
     .dropdown.inline
       %a.btn.btn-default.dropdown-toggle{ data: { toggle: "dropdown" } }
         %span Options
@@ -57,23 +59,25 @@
       = custom_icon("icon_commit")
     %span.cgray= pluralize(@commit.parents.count, "parent")
     - @commit.parents.each do |parent|
-      = link_to parent.short_id, namespace_project_commit_path(@project.namespace, @project, parent), class: "monospace"
+      = link_to parent.short_id, namespace_project_commit_path(@project.namespace, @project, parent), class: "commit-sha"
     %span.commit-info.branches
       %i.fa.fa-spinner.fa-spin
 
-  - if @commit.status
+  - if @commit.last_pipeline
+    - last_pipeline = @commit.last_pipeline
     .well-segment.pipeline-info
       .status-icon-container{ class: "ci-status-icon-#{@commit.status}" }
-        = link_to namespace_project_pipeline_path(@project.namespace, @project, @commit.latest_pipeline.id) do
-          = ci_icon_for_status(@commit.status)
+        = link_to namespace_project_pipeline_path(@project.namespace, @project, last_pipeline.id) do
+          = ci_icon_for_status(last_pipeline.status)
       Pipeline
-      = link_to "##{@commit.latest_pipeline.id}", namespace_project_pipeline_path(@project.namespace, @project, @commit.latest_pipeline.id), class: "monospace"
-      = ci_label_for_status(@commit.status)
-      - if @commit.latest_pipeline.stages.any?
+      = link_to "##{last_pipeline.id}", namespace_project_pipeline_path(@project.namespace, @project, last_pipeline.id)
+      = ci_label_for_status(last_pipeline.status)
+      - if last_pipeline.stages.any?
+        with #{"stage".pluralize(last_pipeline.stages.count)}
         .mr-widget-pipeline-graph
-          = render 'shared/mini_pipeline_graph', pipeline: @commit.latest_pipeline, klass: 'js-commit-pipeline-graph'
+          = render 'shared/mini_pipeline_graph', pipeline: last_pipeline, klass: 'js-commit-pipeline-graph'
       in
-      = time_interval_in_words @commit.pipelines.total_duration
+      = time_interval_in_words last_pipeline.duration
 
 :javascript
   $(".commit-info.branches").load("#{branches_namespace_project_commit_path(@project.namespace, @project, @commit.id)}");
diff --git a/app/views/projects/commit/_pipeline.html.haml b/app/views/projects/commit/_pipeline.html.haml
deleted file mode 100644
index c2b32a22170..00000000000
--- a/app/views/projects/commit/_pipeline.html.haml
+++ /dev/null
@@ -1,53 +0,0 @@
-.pipeline-graph-container
-  .row-content-block.build-content.middle-block.pipeline-actions
-    .pull-right
-      - if can?(current_user, :update_pipeline, pipeline.project)
-        - if pipeline.builds.latest.failed.any?(&:retryable?)
-          = link_to "Retry", retry_namespace_project_pipeline_path(pipeline.project.namespace, pipeline.project, pipeline.id), class: 'js-retry-button btn btn-grouped btn-primary', method: :post
-
-        - if pipeline.builds.running_or_pending.any?
-          = link_to "Cancel running", cancel_namespace_project_pipeline_path(pipeline.project.namespace, pipeline.project, pipeline.id), data: { confirm: 'Are you sure?' }, class: 'btn btn-grouped btn-danger', method: :post
-
-    .oneline.clearfix
-      - if defined?(pipeline_details) && pipeline_details
-        Pipeline
-        = link_to "##{pipeline.id}", namespace_project_pipeline_path(pipeline.project.namespace, pipeline.project, pipeline.id), class: "monospace"
-        with
-        = pluralize pipeline.statuses.count(:id), "job"
-        - if pipeline.ref
-          for
-          = link_to pipeline.ref, namespace_project_commits_path(pipeline.project.namespace, pipeline.project, pipeline.ref), class: "monospace"
-        - if defined?(link_to_commit) && link_to_commit
-          for commit
-          = link_to pipeline.short_sha, namespace_project_commit_path(pipeline.project.namespace, pipeline.project, pipeline.sha), class: "monospace"
-        - if pipeline.duration
-          in
-          = time_interval_in_words pipeline.duration
-
-  .row-content-block.build-content.middle-block.js-pipeline-graph.hidden
-    = render "projects/pipelines/graph", pipeline: pipeline
-
-- if pipeline.yaml_errors.present?
-  .bs-callout.bs-callout-danger
-    %h4 Found errors in your .gitlab-ci.yml:
-    %ul
-      - pipeline.yaml_errors.split(",").each do |error|
-        %li= error
-    You can also test your .gitlab-ci.yml in the #{link_to "Lint", ci_lint_path}
-
-- if pipeline.project.builds_enabled? && !pipeline.ci_yaml_file
-  .bs-callout.bs-callout-warning
-    \.gitlab-ci.yml not found in this commit
-
-.table-holder.pipeline-holder
-  %table.table.ci-table.pipeline
-    %thead
-      %tr
-        %th Status
-        %th Job ID
-        %th Name
-        %th
-        - if pipeline.project.build_coverage_enabled?
-          %th Coverage
-        %th
-    = render partial: "projects/stage/stage", collection: pipeline.stages, as: :stage
diff --git a/app/views/projects/commit/branches.html.haml b/app/views/projects/commit/branches.html.haml
index 2b0c9a4b4de..911c9ddce06 100644
--- a/app/views/projects/commit/branches.html.haml
+++ b/app/views/projects/commit/branches.html.haml
@@ -1,15 +1,15 @@
-- if @branches.any?
-  %span
-    - branch = commit_default_branch(@project, @branches)
-    = link_to(namespace_project_tree_path(@project.namespace, @project, branch)) do
-      %span.label.label-gray
-        = branch
-    - if @branches.any? || @tags.any?
-      = link_to("#", class: "js-details-expand") do
-        %span.label.label-gray
-          \...
+- if @branches.any? || @tags.any?
+  - branch = commit_default_branch(@project, @branches)
+  = link_to(project_ref_path(@project, branch), class: "label label-gray ref-name") do
+    = icon('code-fork')
+    = branch
+
+  -# `commit_default_branch` deletes the default branch from `@branches`,
+  -# so only render this if we have more branches left
+  - if @branches.any? || @tags.any?
+    %span
+      = link_to "…", "#", class: "js-details-expand label label-gray"
+
       %span.js-details-content.hide
-        - if @branches.any?
-          = commit_branches_links(@project, @branches)
-        - if @tags.any?
-          = commit_tags_links(@project, @tags)
+        = commit_branches_links(@project, @branches) if @branches.any?
+        = commit_tags_links(@project, @tags) if @tags.any?
diff --git a/app/views/projects/commit/show.html.haml b/app/views/projects/commit/show.html.haml
index d5fc283aa8d..6051ea2f1ce 100644
--- a/app/views/projects/commit/show.html.haml
+++ b/app/views/projects/commit/show.html.haml
@@ -1,16 +1,19 @@
 - @no_container = true
+- container_class = !fluid_layout && diff_view == :inline ? 'container-limited' : ''
+- limited_container_width = fluid_layout || diff_view == :inline ? '' : 'limit-container-width'
 - page_title        "#{@commit.title} (#{@commit.short_id})", "Commits"
 - page_description  @commit.description
 = render "projects/commits/head"
 
-%div{ class: container_class }
+.container-fluid{ class: [limited_container_width, container_class] }
   = render "commit_box"
   - if @commit.status
     = render "ci_menu"
   - else
     .block-connector
   = render "projects/diffs/diffs", diffs: @diffs, environment: @environment
-  = render "projects/notes/notes_with_form"
+
+  = render "shared/notes/notes_with_form"
   - if can_collaborate_with_project?
     - %w(revert cherry-pick).each do |type|
       = render "projects/commit/change", type: type, commit: @commit, title: @commit.title
diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml
index 4b1ff75541a..3350a0ec152 100644
--- a/app/views/projects/commits/_commit.html.haml
+++ b/app/views/projects/commits/_commit.html.haml
@@ -37,6 +37,6 @@
       .commit-actions.flex-row.hidden-xs
         - if commit.status(ref)
           = render_commit_status(commit, ref: ref)
-        = clipboard_button(clipboard_text: commit.id, title: "Copy commit SHA to clipboard")
-        = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit-short-id btn btn-transparent"
+        = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit-sha btn btn-transparent"
+        = clipboard_button(text: commit.id, title: "Copy commit SHA to clipboard")
         = link_to_browse_code(project, commit)
diff --git a/app/views/projects/commits/_inline_commit.html.haml b/app/views/projects/commits/_inline_commit.html.haml
index c03bc3f9df9..5fb89935467 100644
--- a/app/views/projects/commits/_inline_commit.html.haml
+++ b/app/views/projects/commits/_inline_commit.html.haml
@@ -1,6 +1,6 @@
 %li.commit.inline-commit
   .commit-row-title
-    = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit_short_id"
+    = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit-sha"
     &nbsp;
     %span.str-truncated
       = link_to_gfm commit.title, namespace_project_commit_path(project.namespace, project, commit.id), class: "commit-row-message"
diff --git a/app/views/projects/commits/show.html.haml b/app/views/projects/commits/show.html.haml
index 38dbf2ac10b..c1c2fb3d299 100644
--- a/app/views/projects/commits/show.html.haml
+++ b/app/views/projects/commits/show.html.haml
@@ -18,16 +18,16 @@
     .block-controls.hidden-xs.hidden-sm
       - if @merge_request.present?
         .control
-          = link_to "View Open Merge Request", namespace_project_merge_request_path(@project.namespace, @project, @merge_request), class: 'btn'
+          = link_to "View open merge request", namespace_project_merge_request_path(@project.namespace, @project, @merge_request), class: 'btn'
       - elsif create_mr_button?(@repository.root_ref, @ref)
         .control
-          = link_to "Create Merge Request", create_mr_path(@repository.root_ref, @ref), class: 'btn btn-success'
+          = link_to "Create merge request", create_mr_path(@repository.root_ref, @ref), class: 'btn btn-success'
 
       .control
         = form_tag(namespace_project_commits_path(@project.namespace, @project, @id), method: :get, class: 'commits-search-form') do
           = search_field_tag :search, params[:search], { placeholder: 'Filter by commit message', id: 'commits-search', class: 'form-control search-text-input input-short', spellcheck: false }
       .control
-        = link_to namespace_project_commits_path(@project.namespace, @project, @ref, rss_url_options), title: "Commits Feed", class: 'btn' do
+        = link_to namespace_project_commits_path(@project.namespace, @project, @ref, rss_url_options), title: "Commits feed", class: 'btn' do
           = icon("rss")
 
   %div{ id: dom_id(@project) }
diff --git a/app/views/projects/compare/_form.html.haml b/app/views/projects/compare/_form.html.haml
index 08236216421..adb724c1b8d 100644
--- a/app/views/projects/compare/_form.html.haml
+++ b/app/views/projects/compare/_form.html.haml
@@ -7,20 +7,20 @@
       .input-group.inline-input-group
         %span.input-group-addon from
         = hidden_field_tag :from, params[:from]
-        = button_tag type: 'button', title: params[:from], class: "form-control compare-dropdown-toggle js-compare-dropdown has-tooltip", required: true, data: { refs_url: refs_namespace_project_path(@project.namespace, @project), toggle: "dropdown", target: ".js-compare-from-dropdown", selected: params[:from], field_name: :from } do
+        = button_tag type: 'button', title: params[:from], class: "form-control compare-dropdown-toggle js-compare-dropdown has-tooltip git-revision-dropdown-toggle", required: true, data: { refs_url: refs_namespace_project_path(@project.namespace, @project), toggle: "dropdown", target: ".js-compare-from-dropdown", selected: params[:from], field_name: :from } do
           .dropdown-toggle-text.str-truncated= params[:from] || 'Select branch/tag'
-      = render "ref_dropdown"
+      = render 'shared/ref_dropdown'
     .compare-ellipsis.inline ...
     .form-group.dropdown.compare-form-group.to.js-compare-to-dropdown
       .input-group.inline-input-group
         %span.input-group-addon to
         = hidden_field_tag :to, params[:to]
-        = button_tag type: 'button', title: params[:to], class: "form-control compare-dropdown-toggle js-compare-dropdown has-tooltip", required: true, data: { refs_url: refs_namespace_project_path(@project.namespace, @project), toggle: "dropdown", target: ".js-compare-to-dropdown", selected: params[:to], field_name: :to } do
+        = button_tag type: 'button', title: params[:to], class: "form-control compare-dropdown-toggle js-compare-dropdown has-tooltip git-revision-dropdown-toggle", required: true, data: { refs_url: refs_namespace_project_path(@project.namespace, @project), toggle: "dropdown", target: ".js-compare-to-dropdown", selected: params[:to], field_name: :to } do
           .dropdown-toggle-text.str-truncated= params[:to] || 'Select branch/tag'
-      = render "ref_dropdown"
+      = render 'shared/ref_dropdown'
     &nbsp;
     = button_tag "Compare", class: "btn btn-create commits-compare-btn"
     - if @merge_request.present?
-      = link_to "View Open Merge Request", namespace_project_merge_request_path(@project.namespace, @project, @merge_request), class: 'prepend-left-10 btn'
+      = link_to "View open merge request", namespace_project_merge_request_path(@project.namespace, @project, @merge_request), class: 'prepend-left-10 btn'
     - elsif create_mr_button?
-      = link_to "Create Merge Request", create_mr_path, class: 'prepend-left-10 btn'
+      = link_to "Create merge request", create_mr_path, class: 'prepend-left-10 btn'
diff --git a/app/views/projects/compare/_ref_dropdown.html.haml b/app/views/projects/compare/_ref_dropdown.html.haml
deleted file mode 100644
index 05fb37cdc0f..00000000000
--- a/app/views/projects/compare/_ref_dropdown.html.haml
+++ /dev/null
@@ -1,5 +0,0 @@
-.dropdown-menu.dropdown-menu-selectable
-  = dropdown_title "Select Git revision"
-  = dropdown_filter "Filter by Git revision"
-  = dropdown_content
-  = dropdown_loading
diff --git a/app/views/projects/compare/index.html.haml b/app/views/projects/compare/index.html.haml
index 45be6581cfc..2cf14859f30 100644
--- a/app/views/projects/compare/index.html.haml
+++ b/app/views/projects/compare/index.html.haml
@@ -6,10 +6,10 @@
   .sub-header-block
     Compare Git revisions.
     %br
-    Fill input field with commit id like
-    %code.label-branch 4eedf23
+    Fill input field with commit SHA like
+    %code.ref-name 4eedf23
     or branch/tag name like
-    %code.label-branch master
+    %code.ref-name master
     and press compare button for the commits list and a code diff.
     %br
     Changes are shown <b>from</b> the version in the first field <b>to</b> the version in the second field.
diff --git a/app/views/projects/compare/show.html.haml b/app/views/projects/compare/show.html.haml
index 0dfc9fe20ed..a1bca2cf83a 100644
--- a/app/views/projects/compare/show.html.haml
+++ b/app/views/projects/compare/show.html.haml
@@ -16,9 +16,9 @@
           There isn't anything to compare.
         %p.slead
           - if params[:to] == params[:from]
-            %span.label-branch= params[:from]
+            %span.ref-name= params[:from]
             and
-            %span.label-branch= params[:to]
+            %span.ref-name= params[:to]
             are the same.
           - else
             You'll need to use different branch names to get a valid comparison.
diff --git a/app/views/projects/cycle_analytics/_empty_stage.html.haml b/app/views/projects/cycle_analytics/_empty_stage.html.haml
index c3f95860e92..cdad0bc7231 100644
--- a/app/views/projects/cycle_analytics/_empty_stage.html.haml
+++ b/app/views/projects/cycle_analytics/_empty_stage.html.haml
@@ -2,6 +2,6 @@
   .empty-stage
     .icon-no-data
       = custom_icon ('icon_no_data')
-    %h4 We don't have enough data to show this stage.
+    %h4 {{ __('We don\'t have enough data to show this stage.') }}
     %p
       {{currentStage.emptyStageText}}
diff --git a/app/views/projects/cycle_analytics/_no_access.html.haml b/app/views/projects/cycle_analytics/_no_access.html.haml
index 0ffc79b3181..c3eda398234 100644
--- a/app/views/projects/cycle_analytics/_no_access.html.haml
+++ b/app/views/projects/cycle_analytics/_no_access.html.haml
@@ -2,6 +2,6 @@
   .no-access-stage
     .icon-lock
       = custom_icon ('icon_lock')
-    %h4 You need permission.
+    %h4 {{ __('You need permission.') }}
     %p
-      Want to see the data? Please ask administrator for access.
+      {{ __('Want to see the data? Please ask an administrator for access.') }}
diff --git a/app/views/projects/cycle_analytics/show.html.haml b/app/views/projects/cycle_analytics/show.html.haml
index dd3fa814716..74255167352 100644
--- a/app/views/projects/cycle_analytics/show.html.haml
+++ b/app/views/projects/cycle_analytics/show.html.haml
@@ -2,29 +2,30 @@
 - page_title "Cycle Analytics"
 - content_for :page_specific_javascripts do
   = page_specific_javascript_bundle_tag('common_vue')
+  = page_specific_javascript_bundle_tag('locale')
   = page_specific_javascript_bundle_tag('cycle_analytics')
 
 = render "projects/head"
 
 #cycle-analytics{ class: container_class, "v-cloak" => "true", data: { request_path: project_cycle_analytics_path(@project) } }
   - if @cycle_analytics_no_data
-    .bordered-box.landing.content-block{ "v-if" => "!isOverviewDialogDismissed" }
-      = icon("times", class: "dismiss-icon", "@click" => "dismissOverviewDialog()")
-      .row
-        .col-sm-3.col-xs-12.svg-container
-          = custom_icon('icon_cycle_analytics_splash')
-        .col-sm-8.col-xs-12.inner-content
-          %h4
-            Introducing Cycle Analytics
-          %p
-            Cycle Analytics gives an overview of how much time it takes to go from idea to production in your project.
-
-          = link_to "Read more",  help_page_path('user/project/cycle_analytics'), target: '_blank', class: 'btn'
+    .landing.content-block{ "v-if" => "!isOverviewDialogDismissed" }
+      %button.dismiss-button{ type: 'button', 'aria-label': 'Dismiss Cycle Analytics introduction box' }
+        = icon("times", "@click" => "dismissOverviewDialog()")
+      .svg-container
+        = custom_icon('icon_cycle_analytics_splash')
+      .inner-content
+        %h4
+          {{ __('Introducing Cycle Analytics') }}
+        %p
+          {{ __('Cycle Analytics gives an overview of how much time it takes to go from idea to production in your project.') }}
+        %p
+          = link_to _('Read more'), help_page_path('user/project/cycle_analytics'), target: '_blank', class: 'btn'
   = icon("spinner spin", "v-show" => "isLoading")
   .wrapper{ "v-show" => "!isLoading && !hasError" }
     .panel.panel-default
       .panel-heading
-        Pipeline Health
+        {{ __('Pipeline Health') }}
       .content-block
         .container-fluid
           .row
@@ -34,15 +35,15 @@
             .col-sm-3.col-xs-12.column
               .dropdown.inline.js-ca-dropdown
                 %button.dropdown-menu-toggle{ "data-toggle" => "dropdown", :type => "button" }
-                  %span.dropdown-label Last 30 days
+                  %span.dropdown-label {{ n__('Last %d day', 'Last %d days', 30) }}
                   %i.fa.fa-chevron-down
                 %ul.dropdown-menu.dropdown-menu-align-right
                   %li
                     %a{ "href" => "#", "data-value" => "30" }
-                      Last 30 days
+                      {{ n__('Last %d day', 'Last %d days', 30) }}
                   %li
                     %a{ "href" => "#", "data-value" => "90" }
-                      Last 90 days
+                      {{ n__('Last %d day', 'Last %d days', 90) }}
     .stage-panel-container
       .panel.panel-default.stage-panel
         .panel-heading
@@ -50,20 +51,20 @@
             %ul
               %li.stage-header
                 %span.stage-name
-                  Stage
-                %i.has-tooltip.fa.fa-question-circle{ "data-placement" => "top", title: "The phase of the development lifecycle.", "aria-hidden" => "true" }
+                  {{ s__('ProjectLifecycle|Stage') }}
+                %i.has-tooltip.fa.fa-question-circle{ "data-placement" => "top", title: _("The phase of the development lifecycle."), "aria-hidden" => "true" }
               %li.median-header
                 %span.stage-name
-                  Median
-                %i.has-tooltip.fa.fa-question-circle{ "data-placement" => "top", title: "The value lying at the midpoint of a series of observed values. E.g., between 3, 5, 9, the median is 5. Between 3, 5, 7, 8, the median is (5+7)/2 = 6.", "aria-hidden" => "true" }
+                  {{ __('Median') }}
+                %i.has-tooltip.fa.fa-question-circle{ "data-placement" => "top", title: _("The value lying at the midpoint of a series of observed values. E.g., between 3, 5, 9, the median is 5. Between 3, 5, 7, 8, the median is (5+7)/2 = 6."), "aria-hidden" => "true" }
               %li.event-header
                 %span.stage-name
-                  {{ currentStage ? currentStage.legend : 'Related Issues' }}
-                %i.has-tooltip.fa.fa-question-circle{ "data-placement" => "top", title: "The collection of events added to the data gathered for that stage.", "aria-hidden" => "true" }
+                  {{ currentStage ? __(currentStage.legend) : __('Related Issues') }}
+                %i.has-tooltip.fa.fa-question-circle{ "data-placement" => "top", title: _("The collection of events added to the data gathered for that stage."), "aria-hidden" => "true" }
               %li.total-time-header
                 %span.stage-name
-                  Total Time
-                %i.has-tooltip.fa.fa-question-circle{ "data-placement" => "top", title: "The time taken by each data entry gathered by that stage.", "aria-hidden" => "true" }
+                  {{ __('Total Time') }}
+                %i.has-tooltip.fa.fa-question-circle{ "data-placement" => "top", title: _("The time taken by each data entry gathered by that stage."), "aria-hidden" => "true" }
         .stage-panel-body
           %nav.stage-nav
             %ul
@@ -75,10 +76,10 @@
                     %span{ "v-if" => "stage.value" }
                       {{ stage.value }}
                     %span.stage-empty{ "v-else" => true }
-                      Not enough data
+                      {{ __('Not enough data') }}
                   %template{ "v-else" => true }
                     %span.not-available
-                      Not available
+                      {{ __('Not available') }}
           .section.stage-events
             %template{ "v-if" => "isLoadingStage" }
               = icon("spinner spin")
diff --git a/app/views/projects/deploy_keys/_index.html.haml b/app/views/projects/deploy_keys/_index.html.haml
index 4cfbd9add00..74756b58439 100644
--- a/app/views/projects/deploy_keys/_index.html.haml
+++ b/app/views/projects/deploy_keys/_index.html.haml
@@ -10,25 +10,4 @@
     = render @deploy_keys.form_partial_path
   .col-lg-9.col-lg-offset-3
     %hr
-  .col-lg-9.col-lg-offset-3.append-bottom-default.deploy-keys
-    %h5.prepend-top-0
-      Enabled deploy keys for this project (#{@deploy_keys.enabled_keys_size})
-    - if @deploy_keys.any_keys_enabled?
-      %ul.well-list
-        = render partial: 'projects/deploy_keys/deploy_key', collection: @deploy_keys.enabled_keys, as: :deploy_key
-    - else
-      .settings-message.text-center
-        No deploy keys found. Create one with the form above.
-    %h5.prepend-top-default
-      Deploy keys from projects you have access to (#{@deploy_keys.available_project_keys_size})
-    - if @deploy_keys.any_available_project_keys_enabled?
-      %ul.well-list
-        = render partial: 'projects/deploy_keys/deploy_key', collection: @deploy_keys.available_project_keys, as: :deploy_key
-    - else
-      .settings-message.text-center
-        No deploy keys from your projects could be found. Create one with the form above or add existing one below.
-    - if @deploy_keys.any_available_public_keys_enabled?
-      %h5.prepend-top-default
-        Public deploy keys available to any project (#{@deploy_keys.available_public_keys_size})
-      %ul.well-list
-        = render partial: 'projects/deploy_keys/deploy_key', collection: @deploy_keys.available_public_keys, as: :deploy_key
+  #js-deploy-keys{ data: { endpoint: namespace_project_deploy_keys_path } }
diff --git a/app/views/projects/deployments/_commit.html.haml b/app/views/projects/deployments/_commit.html.haml
index 170d786ecbf..31fd982c522 100644
--- a/app/views/projects/deployments/_commit.html.haml
+++ b/app/views/projects/deployments/_commit.html.haml
@@ -2,10 +2,10 @@
   - if deployment.ref
     .icon-container
       = deployment.tag? ? icon('tag') : icon('code-fork')
-    = link_to deployment.ref, namespace_project_commits_path(@project.namespace, @project, deployment.ref), class: "monospace branch-name"
+    = link_to deployment.ref, project_ref_path(@project, deployment.ref), class: "ref-name"
   .icon-container.commit-icon
     = custom_icon("icon_commit")
-  = link_to deployment.short_sha, namespace_project_commit_path(@project.namespace, @project, deployment.sha), class: "commit-id monospace"
+  = link_to deployment.short_sha, namespace_project_commit_path(@project.namespace, @project, deployment.sha), class: "commit-sha"
 
   %p.commit-title
     %span
diff --git a/app/views/projects/diffs/_content.html.haml b/app/views/projects/diffs/_content.html.haml
index 5c38b5ad9c0..c781e423c4d 100644
--- a/app/views/projects/diffs/_content.html.haml
+++ b/app/views/projects/diffs/_content.html.haml
@@ -3,9 +3,9 @@
   - return unless blob.respond_to?(:text?)
   - if diff_file.too_large?
     .nothing-here-block This diff could not be displayed because it is too large.
-  - elsif blob.only_display_raw?
-    .nothing-here-block This file is too large to display.
-  - elsif blob_text_viewable?(blob)
+  - elsif blob.too_large?
+    .nothing-here-block The file could not be displayed because it is too large.
+  - elsif blob.readable_text?
     - if !project.repository.diffable?(blob)
       .nothing-here-block This diff was suppressed by a .gitattributes entry.
     - elsif diff_file.collapsed?
diff --git a/app/views/projects/diffs/_diffs.html.haml b/app/views/projects/diffs/_diffs.html.haml
index 4b49bed835f..71a1b9e6c05 100644
--- a/app/views/projects/diffs/_diffs.html.haml
+++ b/app/views/projects/diffs/_diffs.html.haml
@@ -27,7 +27,7 @@
     - diff_commit = commit_for_diff(diff_file)
     - blob = diff_file.blob(diff_commit)
     - next unless blob
-    - blob.load_all_data!(diffs.project.repository) unless blob.only_display_raw?
+    - blob.load_all_data!(diffs.project.repository) unless blob.too_large?
     - file_hash = hexdigest(diff_file.file_path)
 
     = render 'projects/diffs/file', file_hash: file_hash, project: diffs.project,
diff --git a/app/views/projects/diffs/_file.html.haml b/app/views/projects/diffs/_file.html.haml
index 0232a09b4a8..f22b385fc0f 100644
--- a/app/views/projects/diffs/_file.html.haml
+++ b/app/views/projects/diffs/_file.html.haml
@@ -6,7 +6,7 @@
 
     - unless diff_file.submodule?
       .file-actions.hidden-xs
-        - if blob_text_viewable?(blob)
+        - if blob.readable_text?
           = link_to '#', class: 'js-toggle-diff-comments btn active has-tooltip', title: "Toggle comments for this file", disabled: @diff_notes_disabled do
             = icon('comment')
           \
@@ -18,4 +18,6 @@
         = view_file_button(diff_commit.id, diff_file.new_path, project)
         = view_on_environment_button(diff_commit.id, diff_file.new_path, environment) if environment
 
+  = render 'projects/fork_suggestion'
+
   = render 'projects/diffs/content', diff_file: diff_file, diff_commit: diff_commit, blob: blob, project: project
diff --git a/app/views/projects/diffs/_file_header.html.haml b/app/views/projects/diffs/_file_header.html.haml
index 7d6b3701f95..4e4fdb73ae3 100644
--- a/app/views/projects/diffs/_file_header.html.haml
+++ b/app/views/projects/diffs/_file_header.html.haml
@@ -1,4 +1,8 @@
-%i.fa.diff-toggle-caret.fa-fw
+- show_toggle = local_assigns.fetch(:show_toggle, true)
+
+- if show_toggle
+  %i.fa.diff-toggle-caret.fa-fw
+
 - if defined?(blob) && blob && diff_file.submodule?
   %span
     = icon('archive fw')
diff --git a/app/views/projects/diffs/_line.html.haml b/app/views/projects/diffs/_line.html.haml
index c09c7b87e24..7439b8a66f7 100644
--- a/app/views/projects/diffs/_line.html.haml
+++ b/app/views/projects/diffs/_line.html.haml
@@ -4,7 +4,7 @@
 - type = line.type
 - line_code = diff_file.line_code(line)
 - if discussions && !line.meta?
-  - discussion = discussions[line_code]
+  - line_discussions = discussions[line_code]
 %tr.line_holder{ class: type, id: (line_code unless plain) }
   - case type
   - when 'match'
@@ -20,6 +20,7 @@
         = link_text
       - else
         %a{ href: "##{line_code}", data: { linenumber: link_text } }
+      - discussion = line_discussions.try(:first)
       - if discussion && discussion.resolvable? && !plain
         %diff-note-avatars{ "discussion-id" => discussion.id }
     %td.new_line.diff-line-num{ class: type, data: { linenumber: line.new_pos } }
@@ -34,6 +35,6 @@
       - else
         = diff_line_content(line.text)
 
-- if discussion
-  - discussion_expanded = local_assigns.fetch(:discussion_expanded, discussion.expanded?)
-  = render "discussions/diff_discussion", discussion: discussion, expanded: discussion_expanded
+- if line_discussions&.any?
+  - discussion_expanded = local_assigns.fetch(:discussion_expanded, line_discussions.any?(&:expanded?))
+  = render "discussions/diff_discussion", discussions: line_discussions, expanded: discussion_expanded
diff --git a/app/views/projects/diffs/_parallel_view.html.haml b/app/views/projects/diffs/_parallel_view.html.haml
index b7346f27ddb..45c95f7ab6a 100644
--- a/app/views/projects/diffs/_parallel_view.html.haml
+++ b/app/views/projects/diffs/_parallel_view.html.haml
@@ -5,8 +5,7 @@
       - left = line[:left]
       - right = line[:right]
       - last_line = right.new_pos if right
-      - unless @diff_notes_disabled
-        - discussion_left, discussion_right = parallel_diff_discussions(left, right, diff_file)
+      - discussions_left, discussions_right = parallel_diff_discussions(left, right, diff_file)
       %tr.line_holder.parallel
         - if left
           - case left.type
@@ -20,6 +19,7 @@
             - left_position = diff_file.position(left)
             %td.old_line.diff-line-num.js-avatar-container{ id: left_line_code, class: left.type, data: { linenumber: left.old_pos } }
               %a{ href: "##{left_line_code}", data: { linenumber: left.old_pos } }
+              - discussion_left = discussions_left.try(:first)
               - if discussion_left && discussion_left.resolvable?
                 %diff-note-avatars{ "discussion-id" => discussion_left.id }
             %td.line_content.parallel.noteable_line{ class: left.type, data: diff_view_line_data(left_line_code, left_position, 'old') }= diff_line_content(left.text)
@@ -39,6 +39,7 @@
             - right_position = diff_file.position(right)
             %td.new_line.diff-line-num.js-avatar-container{ id: right_line_code, class: right.type, data: { linenumber: right.new_pos } }
               %a{ href: "##{right_line_code}", data: { linenumber: right.new_pos } }
+              - discussion_right = discussions_right.try(:first)
               - if discussion_right && discussion_right.resolvable?
                 %diff-note-avatars{ "discussion-id" => discussion_right.id }
             %td.line_content.parallel.noteable_line{ class: right.type, data: diff_view_line_data(right_line_code, right_position, 'new') }= diff_line_content(right.text)
@@ -46,8 +47,8 @@
           %td.old_line.diff-line-num.empty-cell
           %td.line_content.parallel
 
-      - if discussion_left || discussion_right
-        = render "discussions/parallel_diff_discussion", discussion_left: discussion_left, discussion_right: discussion_right
+      - if discussions_left || discussions_right
+        = render "discussions/parallel_diff_discussion", discussions_left: discussions_left, discussions_right: discussions_right
     - if !diff_file.new_file && !diff_file.deleted_file && diff_file.diff_lines.any?
       - last_line = diff_file.diff_lines.last
       - if last_line.new_pos < total_lines
diff --git a/app/views/projects/diffs/_text_file.html.haml b/app/views/projects/diffs/_text_file.html.haml
index ebd1a914ee7..5f3968b6709 100644
--- a/app/views/projects/diffs/_text_file.html.haml
+++ b/app/views/projects/diffs/_text_file.html.haml
@@ -4,11 +4,10 @@
     %a.show-suppressed-diff.js-show-suppressed-diff Changes suppressed. Click to show.
 
 %table.text-file.code.js-syntax-highlight{ data: diff_view_data, class: too_big ? 'hide' : '' }
-  - discussions = @grouped_diff_discussions unless @diff_notes_disabled
   = render partial: "projects/diffs/line",
     collection: diff_file.highlighted_diff_lines,
     as: :line,
-    locals: { diff_file: diff_file, discussions: discussions }
+    locals: { diff_file: diff_file, discussions: @grouped_diff_discussions }
 
   - if !diff_file.new_file && !diff_file.deleted_file && diff_file.highlighted_diff_lines.any?
     - last_line = diff_file.highlighted_diff_lines.last
diff --git a/app/views/projects/edit.html.haml b/app/views/projects/edit.html.haml
index 82e0d0025ec..dd27e0866de 100644
--- a/app/views/projects/edit.html.haml
+++ b/app/views/projects/edit.html.haml
@@ -40,8 +40,8 @@
           .form_group.prepend-top-20.sharing-and-permissions
             .row.js-visibility-select
               .col-md-9
-                %label.label-light
-                  = label_tag :project_visibility, 'Project Visibility', class: 'label-light'
+                .label-light
+                  = label_tag :project_visibility, 'Project Visibility', class: 'label-light', for: :project_visibility_level
                   = link_to "(?)", help_page_path("public_access/public_access")
                 %span.help-block
               .col-md-3.visibility-select-container
@@ -65,7 +65,7 @@
                 .row
                   .col-md-9.project-feature.nested
                     = feature_fields.label :builds_access_level, "Pipelines", class: 'label-light'
-                    %span.help-block Submit, test and deploy your changes before merge
+                    %span.help-block Build, test, and deploy your changes
                   .col-md-3
                     = project_feature_access_select(:builds_access_level)
 
@@ -163,7 +163,7 @@
 
       - if @project.export_project_path
         = link_to 'Download export',  download_export_namespace_project_path(@project.namespace, @project),
-                method: :get, class: "btn btn-default"
+                rel: 'nofollow', download: '', method: :get, class: "btn btn-default"
         = link_to 'Generate new export',  generate_new_export_namespace_project_path(@project.namespace, @project),
                 method: :post, class: "btn btn-default"
       - else
@@ -238,6 +238,8 @@
           %ul
             %li Be careful. Renaming a project's repository can have unintended side effects.
             %li You will need to update your local repositories to point to the new location.
+            - if @project.deployment_services.any?
+              %li Your deployment services will be broken, you will need to manually fix the services after renaming.
         = f.submit 'Rename project', class: "btn btn-warning"
   - if can?(current_user, :change_namespace, @project)
     %hr
diff --git a/app/views/projects/empty.html.haml b/app/views/projects/empty.html.haml
index 85e442e115c..50e0bad3ccf 100644
--- a/app/views/projects/empty.html.haml
+++ b/app/views/projects/empty.html.haml
@@ -60,7 +60,7 @@
               git init
               git remote add origin #{ content_tag(:span, default_url_to_repo, class: 'clone')}
               git add .
-              git commit
+              git commit -m "Initial commit"
               git push -u origin master
 
         %fieldset
diff --git a/app/views/projects/environments/_external_url.html.haml b/app/views/projects/environments/_external_url.html.haml
index bf0f1819073..a82ef5ee5bb 100644
--- a/app/views/projects/environments/_external_url.html.haml
+++ b/app/views/projects/environments/_external_url.html.haml
@@ -1,3 +1,4 @@
 - if environment.external_url && can?(current_user, :read_environment, environment)
   = link_to environment.external_url, target: '_blank', rel: 'noopener noreferrer', class: 'btn external-url' do
     = icon('external-link')
+    View deployment
diff --git a/app/views/projects/environments/_metrics_button.html.haml b/app/views/projects/environments/_metrics_button.html.haml
index acbac1869fd..b4102fcf103 100644
--- a/app/views/projects/environments/_metrics_button.html.haml
+++ b/app/views/projects/environments/_metrics_button.html.haml
@@ -1,6 +1,7 @@
 - environment = local_assigns.fetch(:environment)
 
-- return unless environment.has_metrics? && can?(current_user, :read_environment, environment)
+- return unless can?(current_user, :read_environment, environment)
 
 = link_to environment_metrics_path(environment), title: 'See metrics', class: 'btn metrics-button' do
   = icon('area-chart')
+  Monitoring
diff --git a/app/views/projects/environments/folder.html.haml b/app/views/projects/environments/folder.html.haml
index 4b101447bc0..f7e3733ba0b 100644
--- a/app/views/projects/environments/folder.html.haml
+++ b/app/views/projects/environments/folder.html.haml
@@ -8,7 +8,4 @@
 
 #environments-folder-list-view{ data: { "can-create-deployment" => can?(current_user, :create_deployment, @project).to_s,
   "can-read-environment" => can?(current_user, :read_environment, @project).to_s,
-  "css-class" => container_class,
-  "commit-icon-svg" => custom_icon("icon_commit"),
-  "terminal-icon-svg" => custom_icon("icon_terminal"),
-  "play-icon-svg" => custom_icon("icon_play") } }
+  "css-class" => container_class } }
diff --git a/app/views/projects/environments/metrics.html.haml b/app/views/projects/environments/metrics.html.haml
index 3b45162df52..e8f8fbbcf09 100644
--- a/app/views/projects/environments/metrics.html.haml
+++ b/app/views/projects/environments/metrics.html.haml
@@ -5,24 +5,76 @@
   = page_specific_javascript_bundle_tag('monitoring')
 = render "projects/pipelines/head"
 
-%div{ class: container_class }
+#js-metrics.prometheus-container{ class: container_class, data: { has_metrics: "#{@environment.has_metrics?}", deployment_endpoint: namespace_project_environment_deployments_path(@project.namespace, @project, @environment, format: :json) } }
   .top-area
     .row
       .col-sm-6
         %h3.page-title
           Environment:
-          = @environment.name
+          = link_to @environment.name, environment_path(@environment)
 
-      .col-sm-6
-        .nav-controls
-          = render 'projects/deployments/actions', deployment: @environment.last_deployment
-  .row
-    .col-sm-12
-      %h4
-        CPU utilization
-      %svg.prometheus-graph{ 'graph-type' => 'cpu_values' }
-  .row
-    .col-sm-12
-      %h4
-        Memory usage
-      %svg.prometheus-graph{ 'graph-type' => 'memory_values' }
+  .prometheus-state
+    .js-getting-started.hidden
+      .row
+        .col-md-4.col-md-offset-4.state-svg
+          = render "shared/empty_states/monitoring/getting_started.svg"
+      .row
+        .col-md-6.col-md-offset-3
+          %h4.text-center.state-title
+            Get started with performance monitoring
+      .row
+        .col-md-6.col-md-offset-3
+          .description-text.text-center.state-description
+            Stay updated about the performance and health of your environment by configuring Prometheus to monitor your deployments.
+            = link_to help_page_path('administration/monitoring/prometheus/index.md') do
+              Learn more about performance monitoring
+      .row.state-button-section
+        .col-md-4.col-md-offset-4.text-center.state-button
+          = link_to edit_namespace_project_service_path(@project.namespace, @project, 'prometheus'), class: 'btn btn-success' do
+            Configure Prometheus
+    .js-loading.hidden
+      .row
+        .col-md-4.col-md-offset-4.state-svg
+          = render "shared/empty_states/monitoring/loading.svg"
+      .row
+        .col-md-6.col-md-offset-3
+          %h4.text-center.state-title
+            Waiting for performance data
+      .row
+        .col-md-6.col-md-offset-3
+          .description-text.text-center.state-description
+            Creating graphs uses the data from the Prometheus server. If this takes a long time, ensure that data is available.
+      .row.state-button-section
+        .col-md-4.col-md-offset-4.text-center.state-button
+          = link_to help_page_path('administration/monitoring/prometheus/index.md'), class: 'btn btn-success' do
+            View documentation
+    .js-unable-to-connect.hidden
+      .row
+        .col-md-4.col-md-offset-4.state-svg
+          = render "shared/empty_states/monitoring/unable_to_connect.svg"
+      .row
+        .col-md-6.col-md-offset-3
+          %h4.text-center.state-title
+            Unable to connect to Prometheus server
+      .row
+        .col-md-6.col-md-offset-3
+          .description-text.text-center.state-description
+            Ensure connectivity is available from the GitLab server to the
+            = link_to edit_namespace_project_service_path(@project.namespace, @project, 'prometheus') do
+              Prometheus server
+      .row.state-button-section
+        .col-md-4.col-md-offset-4.text-center.state-button
+          = link_to help_page_path('administration/monitoring/prometheus/index.md'), class:'btn btn-success' do
+            View documentation
+
+  .prometheus-graphs
+    .row
+      .col-sm-12
+        %h4
+          CPU utilization
+        %svg.prometheus-graph{ 'graph-type' => 'cpu_values' }
+    .row
+      .col-sm-12
+        %h4
+          Memory usage
+        %svg.prometheus-graph{ 'graph-type' => 'memory_values' }
diff --git a/app/views/projects/environments/show.html.haml b/app/views/projects/environments/show.html.haml
index f463a429f65..7315e671056 100644
--- a/app/views/projects/environments/show.html.haml
+++ b/app/views/projects/environments/show.html.haml
@@ -4,13 +4,13 @@
 
 %div{ class: container_class }
   .top-area.adjust
-    .col-md-9
+    .col-md-7
       %h3.page-title= @environment.name
-    .col-md-3
+    .col-md-5
       .nav-controls
-        = render 'projects/environments/metrics_button', environment: @environment
         = render 'projects/environments/terminal_button', environment: @environment
         = render 'projects/environments/external_url', environment: @environment
+        = render 'projects/environments/metrics_button', environment: @environment
         - if can?(current_user, :update_environment, @environment)
           = link_to 'Edit', edit_namespace_project_environment_path(@project.namespace, @project, @environment), class: 'btn'
         - if can?(current_user, :create_deployment, @environment) && @environment.can_stop?
diff --git a/app/views/projects/environments/terminal.html.haml b/app/views/projects/environments/terminal.html.haml
index c8363087d6a..4c4aa0baff3 100644
--- a/app/views/projects/environments/terminal.html.haml
+++ b/app/views/projects/environments/terminal.html.haml
@@ -16,8 +16,9 @@
 
       .col-sm-6
         .nav-controls
-          = link_to @environment.external_url, class: 'btn btn-default', target: '_blank', rel: 'noopener noreferrer nofollow' do
-            = icon('external-link')
+          - if @environment.external_url.present?
+            = link_to @environment.external_url, class: 'btn btn-default', target: '_blank', rel: 'noopener noreferrer nofollow' do
+              = icon('external-link')
           = render 'projects/deployments/actions', deployment: @environment.last_deployment
 
 .terminal-container{ class: container_class }
diff --git a/app/views/projects/find_file/show.html.haml b/app/views/projects/find_file/show.html.haml
index 4cdb44325b3..be0462f91cd 100644
--- a/app/views/projects/find_file/show.html.haml
+++ b/app/views/projects/find_file/show.html.haml
@@ -1,4 +1,5 @@
 - page_title "Find File", @ref
+= render "projects/commits/head"
 
 .file-finder-holder.tree-holder.clearfix
   .nav-block
diff --git a/app/views/projects/forks/error.html.haml b/app/views/projects/forks/error.html.haml
index 98d81308407..524b77783ef 100644
--- a/app/views/projects/forks/error.html.haml
+++ b/app/views/projects/forks/error.html.haml
@@ -22,4 +22,4 @@
     %p
       = link_to new_namespace_project_fork_path(@project.namespace, @project), title: "Fork", class: "btn" do
         %i.fa.fa-code-fork
-        Try to Fork again
+        Try to fork again
diff --git a/app/views/projects/generic_commit_statuses/_generic_commit_status.html.haml b/app/views/projects/generic_commit_statuses/_generic_commit_status.html.haml
index 07fb80750d6..b23bbadbdb4 100644
--- a/app/views/projects/generic_commit_statuses/_generic_commit_status.html.haml
+++ b/app/views/projects/generic_commit_statuses/_generic_commit_status.html.haml
@@ -4,7 +4,6 @@
 - retried = local_assigns.fetch(:retried, false)
 - pipeline_link = local_assigns.fetch(:pipeline_link, false)
 - stage = local_assigns.fetch(:stage, false)
-- coverage = local_assigns.fetch(:coverage, false)
 
 %tr.generic_commit_status{ class: ('retried' if retried) }
   %td.status
@@ -28,7 +27,7 @@
         = custom_icon("icon_commit")
 
     - if commit_sha
-      = link_to generic_commit_status.short_sha, namespace_project_commit_path(generic_commit_status.project.namespace, generic_commit_status.project, generic_commit_status.sha), class: "commit-id monospace"
+      = link_to generic_commit_status.short_sha, namespace_project_commit_path(generic_commit_status.project.namespace, generic_commit_status.project, generic_commit_status.sha), class: "commit-sha"
 
     - if retried
       = icon('warning', class: 'text-warning has-tooltip', title: 'Status was retried.')
@@ -49,7 +48,7 @@
       - if generic_commit_status.pipeline.user
         = user_avatar(user: generic_commit_status.pipeline.user, size: 20)
       - else
-        %span.monospace API
+        %span.api API
 
   - if admin
     %td
@@ -80,7 +79,7 @@
         %span= time_ago_with_tooltip(generic_commit_status.finished_at)
 
   %td.coverage
-    - if coverage && generic_commit_status.try(:coverage)
+    - if generic_commit_status.try(:coverage)
       #{generic_commit_status.coverage}%
 
   %td
diff --git a/app/views/projects/group_links/_index.html.haml b/app/views/projects/group_links/_index.html.haml
index b6116dbec41..debb0214d06 100644
--- a/app/views/projects/group_links/_index.html.haml
+++ b/app/views/projects/group_links/_index.html.haml
@@ -6,11 +6,9 @@
     %p
       Projects can be stored in only one group at once. However you can share a project with other groups here.
   .col-lg-9
-    %h5.prepend-top-0
-      Set a group to share
     = form_tag namespace_project_group_links_path(@project.namespace, @project), class: 'js-requires-input', method: :post do
       .form-group
-        = label_tag :link_group_id, "Group", class: "label-light"
+        = label_tag :link_group_id, "Select a group to share with", class: "label-light"
         = groups_select_tag(:link_group_id, data: { skip_groups: @skip_groups }, required: true)
       .form-group
         = label_tag :link_group_access, "Max access level", class: "label-light"
diff --git a/app/views/projects/hooks/_index.html.haml b/app/views/projects/hooks/_index.html.haml
index 8faad351463..676b7c345bc 100644
--- a/app/views/projects/hooks/_index.html.haml
+++ b/app/views/projects/hooks/_index.html.haml
@@ -1 +1,23 @@
-= render 'shared/web_hooks/form', hook: @hook, hooks: @hooks, url_components: [@project.namespace.becomes(Namespace), @project]
+.row.prepend-top-default
+  .col-lg-3
+    %h4.prepend-top-0
+      = page_title
+    %p
+      #{link_to 'Webhooks', help_page_path('user/project/integrations/webhooks')} can be
+      used for binding events when something is happening within the project.
+
+  .col-lg-9.append-bottom-default
+    = form_for @hook, as: :hook, url: polymorphic_path([@project.namespace.becomes(Namespace), @project, :hooks]) do |f|
+      = render partial: 'shared/web_hooks/form', locals: { form: f, hook: @hook }
+      = f.submit 'Add webhook', class: 'btn btn-create'
+
+    %hr
+    %h5.prepend-top-default
+      Webhooks (#{@hooks.count})
+    - if @hooks.any?
+      %ul.well-list
+        - @hooks.each do |hook|
+          = render 'project_hook', hook: hook
+    - else
+      %p.settings-message.text-center.append-bottom-0
+        No webhooks found, add one in the form above.
diff --git a/app/views/projects/hooks/edit.html.haml b/app/views/projects/hooks/edit.html.haml
new file mode 100644
index 00000000000..7998713be1f
--- /dev/null
+++ b/app/views/projects/hooks/edit.html.haml
@@ -0,0 +1,14 @@
+= render 'projects/settings/head'
+
+.row.prepend-top-default
+  .col-lg-3
+    %h4.prepend-top-0
+      = page_title
+    %p
+      #{link_to 'Webhooks', help_page_path('user/project/integrations/webhooks')} can be
+      used for binding events when something is happening within the project.
+  .col-lg-9.append-bottom-default
+    = form_for [@project.namespace.becomes(Namespace), @project, @hook], as: :hook, url: namespace_project_hook_path do |f|
+      = render partial: 'shared/web_hooks/form', locals: { form: f, hook: @hook }
+      = f.submit 'Save changes', class: 'btn btn-create'
+
diff --git a/app/views/projects/imports/new.html.haml b/app/views/projects/imports/new.html.haml
index 2cd8d03e30e..25a87411cac 100644
--- a/app/views/projects/imports/new.html.haml
+++ b/app/views/projects/imports/new.html.haml
@@ -10,7 +10,7 @@
     .panel-body
       %pre
         :preserve
-          #{sanitize_repo_path(@project, @project.import_error)}
+          #{h(sanitize_repo_path(@project, @project.import_error))}
 
 = form_for @project, url: namespace_project_import_path(@project.namespace, @project), method: :post, html: { class: 'form-horizontal' } do |f|
   = render "shared/import_form", f: f
diff --git a/app/views/projects/issues/_discussion.html.haml b/app/views/projects/issues/_discussion.html.haml
index 5d4e593e4ef..4dfda54feb5 100644
--- a/app/views/projects/issues/_discussion.html.haml
+++ b/app/views/projects/issues/_discussion.html.haml
@@ -4,4 +4,4 @@
     = link_to 'Close issue', issue_path(@issue, issue: {state_event: :close}, format: 'json'), data: {no_turbolink: true, original_text: "Close issue", alternative_text: "Comment & close issue"}, class: "btn btn-nr btn-close btn-comment js-note-target-close #{issue_button_visibility(@issue, true)}", title: 'Close issue'
 
 #notes
-  = render 'projects/notes/notes_with_form'
+  = render 'shared/notes/notes_with_form'
diff --git a/app/views/projects/issues/_issue.html.haml b/app/views/projects/issues/_issue.html.haml
index 0e3902c066a..c184e0e0022 100644
--- a/app/views/projects/issues/_issue.html.haml
+++ b/app/views/projects/issues/_issue.html.haml
@@ -13,9 +13,9 @@
             %li
               CLOSED
 
-          - if issue.assignee
+          - if issue.assignees.any?
             %li
-              = link_to_member(@project, issue.assignee, name: false, title: "Assigned to :name")
+              = render 'shared/issuable/assignees', project: @project, issue: issue
 
           = render 'shared/issuable_meta_data', issuable: issue
 
diff --git a/app/views/projects/issues/_issue_by_email.html.haml b/app/views/projects/issues/_issue_by_email.html.haml
index d2038a2be68..da65157a10b 100644
--- a/app/views/projects/issues/_issue_by_email.html.haml
+++ b/app/views/projects/issues/_issue_by_email.html.haml
@@ -16,7 +16,7 @@
         .email-modal-input-group.input-group
           = text_field_tag :issue_email, email, class: "monospace js-select-on-focus form-control", readonly: true
           .input-group-btn
-            = clipboard_button(clipboard_target: '#issue_email')
+            = clipboard_button(target: '#issue_email')
         %p
           The subject will be used as the title of the new issue, and the message will be the description.
 
diff --git a/app/views/projects/issues/_new_branch.html.haml b/app/views/projects/issues/_new_branch.html.haml
index 13e2150f997..dba092c8844 100644
--- a/app/views/projects/issues/_new_branch.html.haml
+++ b/app/views/projects/issues/_new_branch.html.haml
@@ -1,9 +1,29 @@
 - if can?(current_user, :push_code, @project)
-  .pull-right
-    #new-branch.new-branch{ 'data-path' => can_create_branch_namespace_project_issue_path(@project.namespace, @project, @issue) }
-      = link_to namespace_project_branches_path(@project.namespace, @project, branch_name: @issue.to_branch_name, issue_iid: @issue.iid),
-        method: :post, class: 'btn btn-new btn-inverted btn-grouped has-tooltip available hide', title: @issue.to_branch_name do
-        New branch
-      = link_to '#', class: 'unavailable btn btn-grouped hide', disabled: 'disabled' do
-        = icon('exclamation-triangle')
-        New branch unavailable
+  .create-mr-dropdown-wrap{ data: { can_create_path: can_create_branch_namespace_project_issue_path(@project.namespace, @project, @issue), create_mr_path: create_merge_request_namespace_project_issue_path(@project.namespace, @project, @issue), create_branch_path: namespace_project_branches_path(@project.namespace, @project, branch_name: @issue.to_branch_name, issue_iid: @issue.iid) } }
+    .btn-group.unavailable
+      %button.btn.btn-grouped{ type: 'button', disabled: 'disabled' }
+        = icon('spinner', class: 'fa-spin')
+        %span.text
+          Checking branch availability…
+    .btn-group.available.hide
+      %input.btn.js-create-merge-request.btn-inverted.btn-success{ type: 'button', value: 'Create a merge request', data: { action: 'create-mr' } }
+      %button.btn.btn-inverted.dropdown-toggle.btn-inverted.btn-success.js-dropdown-toggle{ type: 'button', data: { 'dropdown-trigger' => '#create-merge-request-dropdown' } }
+        = icon('caret-down')
+      %ul#create-merge-request-dropdown.dropdown-menu.dropdown-menu-align-right{ data: { dropdown: true } }
+        %li.droplab-item-selected{ role: 'button', data: { value: 'create-mr', 'text' => 'Create a merge request' } }
+          .menu-item
+            .icon-container
+              = icon('check')
+            .description
+              %strong Create a merge request
+              %span
+                Creates a merge request named after this issue, with source branch created from '#{@project.default_branch}'.
+        %li.divider.droplab-item-ignore
+        %li{ role: 'button', data: {  value: 'create-branch', 'text' => 'Create a branch' } }
+          .menu-item
+            .icon-container
+              = icon('check')
+            .description
+              %strong Create a branch
+              %span
+                Creates a branch named after this issue, from '#{@project.default_branch}'.
diff --git a/app/views/projects/issues/_related_branches.html.haml b/app/views/projects/issues/_related_branches.html.haml
index 1892ebb512f..8c9f6f3b4df 100644
--- a/app/views/projects/issues/_related_branches.html.haml
+++ b/app/views/projects/issues/_related_branches.html.haml
@@ -11,5 +11,4 @@
             = render_pipeline_status(pipeline)
         %span.related-branch-info
           %strong
-            = link_to namespace_project_compare_path(@project.namespace, @project, from: @project.default_branch, to: branch), class: "label-branch" do
-              = branch
+            = link_to branch, namespace_project_compare_path(@project.namespace, @project, from: @project.default_branch, to: branch), class: "ref-name"
diff --git a/app/views/projects/issues/index.html.haml b/app/views/projects/issues/index.html.haml
index f3a429d12d9..60900e9d660 100644
--- a/app/views/projects/issues/index.html.haml
+++ b/app/views/projects/issues/index.html.haml
@@ -7,7 +7,8 @@
   = render "projects/issues/head"
 
 - content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('filtered_search')
+  = webpack_bundle_tag 'common_vue'
+  = webpack_bundle_tag 'filtered_search'
 
 = content_for :meta_tags do
   = auto_discovery_link_tag(:atom, params.merge(rss_url_options), title: "#{@project.name} issues")
@@ -24,9 +25,9 @@
                                                    issue: { assignee_id: issues_finder.assignee.try(:id),
                                                             milestone_id: issues_finder.milestones.first.try(:id) }),
                                                    class: "btn btn-new",
-                                                   title: "New Issue",
+                                                   title: "New issue",
                                                    id: "new_issue_link" do
-          New Issue
+          New issue
     = render 'shared/issuable/search_bar', type: :issues
 
     .issues-holder
diff --git a/app/views/projects/issues/show.html.haml b/app/views/projects/issues/show.html.haml
index 6ac05bf3afe..b2401442620 100644
--- a/app/views/projects/issues/show.html.haml
+++ b/app/views/projects/issues/show.html.haml
@@ -49,19 +49,19 @@
         = link_to 'Submit as spam', mark_as_spam_namespace_project_issue_path(@project.namespace, @project, @issue), method: :post, class: 'hidden-xs hidden-sm btn btn-grouped btn-spam', title: 'Submit as spam'
       = link_to 'Edit', edit_namespace_project_issue_path(@project.namespace, @project, @issue), class: 'hidden-xs hidden-sm btn btn-grouped issuable-edit'
 
-
 .issue-details.issuable-details
-  .detail-page-description.content-block{ class: ('hide-bottom-border' unless @issue.description.present? ) }
-    %h2.title
-      = markdown_field(@issue, :title)
-    - if @issue.description.present?
-      .description{ class: can?(current_user, :update_issue, @issue) ? 'js-task-list-container' : '' }
-        .wiki
-          = preserve do
-            = markdown_field(@issue, :description)
-        %textarea.hidden.js-task-list-field
-          = @issue.description
-    = edited_time_ago_with_tooltip(@issue, placement: 'bottom', html_class: 'issue_edited_ago')
+  .detail-page-description.content-block
+    #js-issuable-app{ "data" => { "endpoint" => realtime_changes_namespace_project_issue_path(@project.namespace, @project, @issue),
+      "can-update" => can?(current_user, :update_issue, @issue).to_s,
+      "issuable-ref" => @issue.to_reference,
+    } }
+      %h2.title= markdown_field(@issue, :title)
+      - if @issue.description.present?
+        .description{ class: can?(current_user, :update_issue, @issue) ? 'js-task-list-container' : '' }
+          .wiki= markdown_field(@issue, :description)
+          %textarea.hidden.js-task-list-field= @issue.description
+
+    = edited_time_ago_with_tooltip(@issue, placement: 'bottom', html_class: 'issue-edited-ago js-issue-edited-ago')
 
     #merge-requests{ data: { url: referenced_merge_requests_namespace_project_issue_url(@project.namespace, @project, @issue) } }
       // This element is filled in using JavaScript.
@@ -70,10 +70,16 @@
       // This element is filled in using JavaScript.
 
   .content-block.content-block-small
-    = render 'new_branch' unless @issue.confidential?
-    = render 'award_emoji/awards_block', awardable: @issue, inline: true
+    .row
+      .col-sm-6
+        = render 'award_emoji/awards_block', awardable: @issue, inline: true
+      .col-sm-6.new-branch-col
+        = render 'new_branch' unless @issue.confidential?
 
   %section.issuable-discussion
     = render 'projects/issues/discussion'
 
 = render 'shared/issuable/sidebar', issuable: @issue
+
+= page_specific_javascript_bundle_tag('common_vue')
+= page_specific_javascript_bundle_tag('issue_show')
diff --git a/app/views/projects/labels/edit.html.haml b/app/views/projects/labels/edit.html.haml
index a80a07b52e6..7f0059cdcda 100644
--- a/app/views/projects/labels/edit.html.haml
+++ b/app/views/projects/labels/edit.html.haml
@@ -1,6 +1,6 @@
 - @no_container = true
 - page_title "Edit", @label.name, "Labels"
-= render "projects/issues/head"
+= render "shared/mr_head"
 
 %div{ class: container_class }
   %h3.page-title
diff --git a/app/views/projects/labels/index.html.haml b/app/views/projects/labels/index.html.haml
index 8d4a91cb64c..fc72c4fb635 100644
--- a/app/views/projects/labels/index.html.haml
+++ b/app/views/projects/labels/index.html.haml
@@ -1,10 +1,7 @@
 - @no_container = true
 - page_title "Labels"
 - hide_class = ''
-= render "projects/issues/head"
-
-- content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('simulate_drag') if Rails.env.test?
+= render "shared/mr_head"
 
 - if @labels.exists? || @prioritized_labels.exists?
   %div{ class: container_class }
diff --git a/app/views/projects/labels/new.html.haml b/app/views/projects/labels/new.html.haml
index f0d9be744d1..8f6c085a361 100644
--- a/app/views/projects/labels/new.html.haml
+++ b/app/views/projects/labels/new.html.haml
@@ -1,6 +1,6 @@
 - @no_container = true
 - page_title "New Label"
-= render "projects/issues/head"
+= render "shared/mr_head"
 
 %div{ class: container_class }
   %h3.page-title
diff --git a/app/views/projects/merge_requests/_discussion.html.haml b/app/views/projects/merge_requests/_discussion.html.haml
index cfb44bd206c..2e6420db212 100644
--- a/app/views/projects/merge_requests/_discussion.html.haml
+++ b/app/views/projects/merge_requests/_discussion.html.haml
@@ -1,11 +1,11 @@
 - content_for :note_actions do
   - if can?(current_user, :update_merge_request, @merge_request)
     - if @merge_request.open?
-      = link_to 'Close merge request', merge_request_path(@merge_request, merge_request: {state_event: :close }), method: :put, class: "btn btn-nr btn-comment btn-close close-mr-link js-note-target-close", title: "Close merge request", data: {original_text: "Close merge request", alternative_text: "Comment & close merge request"}
+      = link_to 'Close merge request', merge_request_path(@merge_request, merge_request: { state_event: :close }), method: :put, class: "btn btn-nr btn-comment btn-close close-mr-link js-note-target-close", title: "Close merge request", data: { original_text: "Close merge request", alternative_text: "Comment & close merge request"}
     - if @merge_request.reopenable?
-      = link_to 'Reopen merge request', merge_request_path(@merge_request, merge_request: {state_event: :reopen }), method: :put, class: "btn btn-nr btn-comment btn-reopen reopen-mr-link js-note-target-reopen", title: "Reopen merge request", data: {original_text: "Reopen merge request", alternative_text: "Comment & reopen merge request"}
+      = link_to 'Reopen merge request', merge_request_path(@merge_request, merge_request: { state_event: :reopen }), method: :put, class: "btn btn-nr btn-comment btn-reopen reopen-mr-link js-note-target-close js-note-target-reopen", title: "Reopen merge request", data: { original_text: "Reopen merge request", alternative_text: "Comment & reopen merge request"}
   %comment-and-resolve-btn{ "inline-template" => true, ":discussion-id" => "" }
     %button.btn.btn-nr.btn-default.append-right-10.js-comment-resolve-button{ "v-if" => "showButton", type: "submit", data: { project_path: "#{project_path(@merge_request.project)}" } }
       {{ buttonText }}
 
-#notes= render "projects/notes/notes_with_form"
+#notes= render "shared/notes/notes_with_form"
diff --git a/app/views/projects/merge_requests/_head.html.haml b/app/views/projects/merge_requests/_head.html.haml
new file mode 100644
index 00000000000..b7f73fe5339
--- /dev/null
+++ b/app/views/projects/merge_requests/_head.html.haml
@@ -0,0 +1,21 @@
+= content_for :sub_nav do
+  .scrolling-tabs-container.sub-nav-scroll
+    = render 'shared/nav_scroll'
+    .nav-links.sub-nav.scrolling-tabs
+      %ul{ class: (container_class) }
+        = nav_link(controller: :merge_requests) do
+          = link_to namespace_project_merge_requests_path(@project.namespace, @project), title: 'Merge Requests' do
+            %span
+              List
+
+        - if project_nav_tab? :labels
+          = nav_link(controller: :labels) do
+            = link_to namespace_project_labels_path(@project.namespace, @project), title: 'Labels' do
+              %span
+                Labels
+
+        - if project_nav_tab? :milestones
+          = nav_link(controller: :milestones) do
+            = link_to namespace_project_milestones_path(@project.namespace, @project), title: 'Milestones' do
+              %span
+                Milestones
diff --git a/app/views/projects/merge_requests/_merge_request.html.haml b/app/views/projects/merge_requests/_merge_request.html.haml
index 11b7aaec704..94b9577e9eb 100644
--- a/app/views/projects/merge_requests/_merge_request.html.haml
+++ b/app/views/projects/merge_requests/_merge_request.html.haml
@@ -37,7 +37,7 @@
       by #{link_to_member(@project, merge_request.author, avatar: false)}
       - if merge_request.target_project.default_branch != merge_request.target_branch
         &nbsp;
-        = link_to namespace_project_commits_path(merge_request.project.namespace, merge_request.project, merge_request.target_branch) do
+        = link_to project_ref_path(merge_request.project, merge_request.target_branch), class: 'ref-name' do
           = icon('code-fork')
           = merge_request.target_branch
 
diff --git a/app/views/projects/merge_requests/_merge_requests.html.haml b/app/views/projects/merge_requests/_merge_requests.html.haml
index fe82f751f53..4e97f74dd6a 100644
--- a/app/views/projects/merge_requests/_merge_requests.html.haml
+++ b/app/views/projects/merge_requests/_merge_requests.html.haml
@@ -1,8 +1,8 @@
 %ul.content-list.mr-list.issuable-list
-  = render @merge_requests
-  - if @merge_requests.blank?
-    %li
-      .nothing-here-block No merge requests to show
+  - if @merge_requests.exists?
+    = render @merge_requests
+  - else
+    = render 'shared/empty_states/merge_requests'
 
 - if @merge_requests.present?
   = paginate @merge_requests, theme: "gitlab"
diff --git a/app/views/projects/merge_requests/_new_compare.html.haml b/app/views/projects/merge_requests/_new_compare.html.haml
index 8d134aaac67..0f37abb579c 100644
--- a/app/views/projects/merge_requests/_new_compare.html.haml
+++ b/app/views/projects/merge_requests/_new_compare.html.haml
@@ -21,8 +21,8 @@
                   selected: f.object.source_project_id
           .merge-request-select.dropdown
             = f.hidden_field :source_branch
-            = dropdown_toggle f.object.source_branch || "Select source branch", { toggle: "dropdown", field_name: "#{f.object_name}[source_branch]" }, { toggle_class: "js-compare-dropdown js-source-branch" }
-            .dropdown-menu.dropdown-menu-selectable.dropdown-source-branch
+            = dropdown_toggle f.object.source_branch || "Select source branch", { toggle: "dropdown", field_name: "#{f.object_name}[source_branch]" }, { toggle_class: "js-compare-dropdown js-source-branch git-revision-dropdown-toggle" }
+            .dropdown-menu.dropdown-menu-selectable.dropdown-source-branch.git-revision-dropdown
               = dropdown_title("Select source branch")
               = dropdown_filter("Search branches")
               = dropdown_content do
@@ -38,7 +38,7 @@
         .panel-heading
           Target branch
         .panel-body.clearfix
-          - projects =  @project.forked_from_project.nil? ? [@project] : [@project, @project.forked_from_project]
+          - projects = target_projects(@project)
           .merge-request-select.dropdown
             = f.hidden_field :target_project_id
             = dropdown_toggle f.object.target_project.path_with_namespace, { toggle: "dropdown", field_name: "#{f.object_name}[target_project_id]", disabled: @merge_request.persisted? }, { toggle_class: "js-compare-dropdown js-target-project" }
@@ -51,8 +51,8 @@
                   selected: f.object.target_project_id
           .merge-request-select.dropdown
             = f.hidden_field :target_branch
-            = dropdown_toggle f.object.target_branch, { toggle: "dropdown", field_name: "#{f.object_name}[target_branch]" }, { toggle_class: "js-compare-dropdown js-target-branch" }
-            .dropdown-menu.dropdown-menu-selectable.dropdown-target-branch.js-target-branch-dropdown
+            = dropdown_toggle f.object.target_branch, { toggle: "dropdown", field_name: "#{f.object_name}[target_branch]" }, { toggle_class: "js-compare-dropdown js-target-branch git-revision-dropdown-toggle" }
+            .dropdown-menu.dropdown-menu-selectable.dropdown-target-branch.js-target-branch-dropdown.git-revision-dropdown
               = dropdown_title("Select target branch")
               = dropdown_filter("Search branches")
               = dropdown_content do
diff --git a/app/views/projects/merge_requests/_new_submit.html.haml b/app/views/projects/merge_requests/_new_submit.html.haml
index e7fcac4c477..e3ecbee5490 100644
--- a/app/views/projects/merge_requests/_new_submit.html.haml
+++ b/app/views/projects/merge_requests/_new_submit.html.haml
@@ -3,9 +3,9 @@
 %p.slead
   - source_title, target_title = format_mr_branch_names(@merge_request)
   From
-  %strong.label-branch= source_title
+  %strong.ref-name= source_title
   %span into
-  %strong.label-branch= target_title
+  %strong.ref-name= target_title
 
   %span.pull-right
     = link_to 'Change branches', mr_change_branches_path(@merge_request)
@@ -46,12 +46,13 @@
         -# This tab is always loaded via AJAX
       - if @pipelines.any?
         #pipelines.pipelines.tab-pane
-          = render 'projects/merge_requests/show/pipelines', endpoint: url_for(params.merge(format: :json))
+          = render 'projects/merge_requests/show/pipelines', endpoint: url_for(params.merge(format: :json)), disable_initialization: true
 
   .mr-loading-status
     = spinner
 
 :javascript
   var merge_request = new MergeRequest({
-    action: "#{(@show_changes_tab ? 'new/diffs' : 'new')}"
+    action: "#{(@show_changes_tab ? 'new/diffs' : 'new')}",
+    setUrl: false,
   });
diff --git a/app/views/projects/merge_requests/_show.html.haml b/app/views/projects/merge_requests/_show.html.haml
index 881ee9fd596..75120409bb3 100644
--- a/app/views/projects/merge_requests/_show.html.haml
+++ b/app/views/projects/merge_requests/_show.html.haml
@@ -1,91 +1,69 @@
 - @content_class = "limit-container-width" unless fluid_layout
-- page_title           "#{@merge_request.title} (#{@merge_request.to_reference})", "Merge Requests"
-- page_description     @merge_request.description
+- page_title "#{@merge_request.title} (#{@merge_request.to_reference})", "Merge Requests"
+- page_description @merge_request.description
 - page_card_attributes @merge_request.card_attributes
 - content_for :page_specific_javascripts do
   = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag('diff_notes')
 
-.merge-request{ 'data-url' => merge_request_path(@merge_request), 'data-project-path' => project_path(@merge_request.project) }
+.merge-request{ 'data-url' => merge_request_path(@merge_request, format: :json), 'data-project-path' => project_path(@merge_request.project) }
   = render "projects/merge_requests/show/mr_title"
 
   .merge-request-details.issuable-details{ data: { id: @merge_request.project.id } }
     = render "projects/merge_requests/show/mr_box"
-    .append-bottom-default.mr-source-target.prepend-top-default
-      - if @merge_request.open?
-        .pull-right
-          - if @merge_request.source_branch_exists?
-            - if koding_enabled? && @repository.koding_yml
-              = link_to koding_project_url(@merge_request.source_project, @merge_request.source_branch, @merge_request.commits.first.short_id), class: "btn inline btn-grouped btn-sm", target: '_blank', rel: 'noopener noreferrer' do
-                Run in IDE (Koding)
-            = link_to "#modal_merge_info", class: "btn inline btn-grouped btn-sm", "data-toggle" => "modal" do
-              Check out branch
-
-          %span.dropdown.inline.prepend-left-5
-            %a.btn.btn-sm.dropdown-toggle{ data: {toggle: :dropdown} }
-              Download as
-              = icon('caret-down')
-            %ul.dropdown-menu.dropdown-menu-align-right
-              %li= link_to "Email Patches", merge_request_path(@merge_request, format: :patch)
-              %li= link_to "Plain Diff",    merge_request_path(@merge_request, format: :diff)
-      .normal
-        %span <b>Request to merge</b>
-        %span.label-branch= source_branch_with_namespace(@merge_request)
-        %span <b>into</b>
-        %span.label-branch
-          = link_to_if @merge_request.target_branch_exists?, @merge_request.target_branch, namespace_project_commits_path(@project.namespace, @project, @merge_request.target_branch)
-        - if @merge_request.open? && @merge_request.diverged_from_target_branch?
-          %span (#{pluralize(@merge_request.diverged_commits_count, 'commit')} behind)
 
     - if @merge_request.source_branch_exists?
       = render "projects/merge_requests/show/how_to_merge"
 
-    = render "projects/merge_requests/widget/show.html.haml"
+    :javascript
+      window.gl.mrWidgetData = #{serialize_issuable(@merge_request)}
+
+    #js-vue-mr-widget.mr-widget
 
-    - if @merge_request.source_branch_exists? && @merge_request.mergeable? && @merge_request.can_be_merged_by?(current_user)
-      .merge-manually.light.prepend-top-default
-        You can also accept this merge request manually using the
-        = succeed '.' do
-          = link_to "command line", "#modal_merge_info", class: "how_to_merge_link vlink", title: "How To Merge", "data-toggle" => "modal"
+    - content_for :page_specific_javascripts do
+      = webpack_bundle_tag 'common_vue'
+      = webpack_bundle_tag 'vue_merge_request_widget'
 
     .content-block.content-block-small.emoji-list-container
       = render 'award_emoji/awards_block', awardable: @merge_request, inline: true
 
     .merge-request-tabs-holder{ class: ("js-tabs-affix" unless ENV['RAILS_ENV'] == 'test') }
-      .merge-request-tabs-container.scrolling-tabs-container.inner-page-scroll-tabs
-        .fade-left= icon('angle-left')
-        .fade-right= icon('angle-right')
-        %ul.merge-request-tabs.nav-links.scrolling-tabs
-          %li.notes-tab
-            = link_to namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: { target: 'div#notes', action: 'notes', toggle: 'tab' } do
-              Discussion
-              %span.badge= @merge_request.related_notes.user.count
-          - if @merge_request.source_project
-            %li.commits-tab
-              = link_to commits_namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: { target: 'div#commits', action: 'commits', toggle: 'tab' } do
-                Commits
-                %span.badge= @commits_count
-          - if @pipelines.any?
-            %li.pipelines-tab
-              = link_to pipelines_namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: { target: '#pipelines', action: 'pipelines', toggle: 'tab' } do
-                Pipelines
-                %span.badge= @pipelines.size
-          %li.diffs-tab
-            = link_to diffs_namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: { target: 'div#diffs', action: 'diffs', toggle: 'tab' } do
-              Changes
-              %span.badge= @merge_request.diff_size
-          %li#resolve-count-app.line-resolve-all-container.pull-right.prepend-top-10.hidden-xs{ "v-cloak" => true }
-            %resolve-count{ "inline-template" => true, ":logged-out" => "#{current_user.nil?}" }
-              %div
-                .line-resolve-all{ "v-show" => "discussionCount > 0",
-                  ":class" => "{ 'has-next-btn': !loggedOut && resolvedDiscussionCount !== discussionCount }" }
-                  %span.line-resolve-btn.is-disabled{ type: "button",
-                      ":class" => "{ 'is-active': resolvedDiscussionCount === discussionCount }" }
-                    = render "shared/icons/icon_status_success.svg"
-                  %span.line-resolve-text
-                    {{ resolvedDiscussionCount }}/{{ discussionCount }} {{ resolvedCountText }} resolved
-                = render "discussions/new_issue_for_all_discussions", merge_request: @merge_request
-                = render "discussions/jump_to_next"
+      .merge-request-tabs-container
+        .scrolling-tabs-container.inner-page-scroll-tabs.is-smaller
+          .fade-left= icon('angle-left')
+          .fade-right= icon('angle-right')
+          .nav-links.scrolling-tabs
+            %ul.merge-request-tabs
+              %li.notes-tab
+                = link_to namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: { target: 'div#notes', action: 'notes', toggle: 'tab' } do
+                  Discussion
+                  %span.badge= @merge_request.related_notes.user.count
+              - if @merge_request.source_project
+                %li.commits-tab
+                  = link_to commits_namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: { target: 'div#commits', action: 'commits', toggle: 'tab' } do
+                    Commits
+                    %span.badge= @commits_count
+              - if @pipelines.any?
+                %li.pipelines-tab
+                  = link_to pipelines_namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: { target: '#pipelines', action: 'pipelines', toggle: 'tab' } do
+                    Pipelines
+                    %span.badge= @pipelines.size
+              %li.diffs-tab
+                = link_to diffs_namespace_project_merge_request_path(@project.namespace, @project, @merge_request), data: { target: 'div#diffs', action: 'diffs', toggle: 'tab' } do
+                  Changes
+                  %span.badge= @merge_request.diff_size
+        #resolve-count-app.line-resolve-all-container.prepend-top-10{ "v-cloak" => true }
+          %resolve-count{ "inline-template" => true, ":logged-out" => "#{current_user.nil?}" }
+            %div
+              .line-resolve-all{ "v-show" => "discussionCount > 0",
+                ":class" => "{ 'has-next-btn': !loggedOut && resolvedDiscussionCount !== discussionCount }" }
+                %span.line-resolve-btn.is-disabled{ type: "button",
+                    ":class" => "{ 'is-active': resolvedDiscussionCount === discussionCount }" }
+                  = render "shared/icons/icon_status_success.svg"
+                %span.line-resolve-text
+                  {{ resolvedDiscussionCount }}/{{ discussionCount }} {{ resolvedCountText }} resolved
+              = render "discussions/new_issue_for_all_discussions", merge_request: @merge_request
+              = render "discussions/jump_to_next"
 
     .tab-content#diff-notes-app
       #notes.notes.tab-pane.voting_notes
@@ -113,9 +91,7 @@
 
 :javascript
   $(function () {
-    new MergeRequest({
+    window.mergeRequest = new MergeRequest({
       action: "#{controller.action_name}"
     });
   });
-
-  var mrRefreshWidgetUrl = "#{mr_widget_refresh_url(@merge_request)}";
diff --git a/app/views/projects/merge_requests/cancel_merge_when_pipeline_succeeds.js.haml b/app/views/projects/merge_requests/cancel_merge_when_pipeline_succeeds.js.haml
deleted file mode 100644
index eab5be488b5..00000000000
--- a/app/views/projects/merge_requests/cancel_merge_when_pipeline_succeeds.js.haml
+++ /dev/null
@@ -1,2 +0,0 @@
-:plain
-  $('.mr-widget-body').html("#{escape_javascript(render('projects/merge_requests/widget/open/accept'))}");
diff --git a/app/views/projects/merge_requests/index.html.haml b/app/views/projects/merge_requests/index.html.haml
index 8a96c8dacf6..502220232a1 100644
--- a/app/views/projects/merge_requests/index.html.haml
+++ b/app/views/projects/merge_requests/index.html.haml
@@ -2,21 +2,28 @@
 - @bulk_edit = can?(current_user, :admin_merge_request, @project)
 
 - page_title "Merge Requests"
+- unless @project.default_issues_tracker?
+  = content_for :sub_nav do
+    = render "projects/merge_requests/head"
 = render 'projects/last_push'
 
 - content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('filtered_search')
+  = webpack_bundle_tag 'common_vue'
+  = webpack_bundle_tag 'filtered_search'
 
-%div{ class: container_class }
-  .top-area
-    = render 'shared/issuable/nav', type: :merge_requests
-    .nav-controls
-      - merge_project = can?(current_user, :create_merge_request, @project) ? @project : (current_user && current_user.fork_of(@project))
-      - if merge_project
-        = link_to new_namespace_project_merge_request_path(merge_project.namespace, merge_project), class: "btn btn-new", title: "New Merge Request" do
-          New Merge Request
+- if @project.merge_requests.exists?
+  %div{ class: container_class }
+    .top-area
+      = render 'shared/issuable/nav', type: :merge_requests
+      .nav-controls
+        - merge_project = can?(current_user, :create_merge_request, @project) ? @project : (current_user && current_user.fork_of(@project))
+        - if merge_project
+          = link_to new_namespace_project_merge_request_path(merge_project.namespace, merge_project), class: "btn btn-new", title: "New merge request" do
+            New merge request
 
-  = render 'shared/issuable/search_bar', type: :merge_requests
+    = render 'shared/issuable/search_bar', type: :merge_requests
 
-  .merge-requests-holder
-    = render 'merge_requests'
+    .merge-requests-holder
+      = render 'merge_requests'
+- else
+  = render 'shared/empty_states/merge_requests', button_path: new_namespace_project_merge_request_path(@project.namespace, @project)
diff --git a/app/views/projects/merge_requests/merge.js.haml b/app/views/projects/merge_requests/merge.js.haml
deleted file mode 100644
index e632fc681cf..00000000000
--- a/app/views/projects/merge_requests/merge.js.haml
+++ /dev/null
@@ -1,14 +0,0 @@
-- case @status
-- when :success
-  - remove_source_branch = params[:should_remove_source_branch] == '1' || @merge_request.remove_source_branch?
-  :plain
-    merge_request_widget.mergeInProgress(#{remove_source_branch});
-- when :merge_when_pipeline_succeeds
-  :plain
-    $('.mr-widget-body').html("#{escape_javascript(render('projects/merge_requests/widget/open/merge_when_pipeline_succeeds'))}");
-- when :sha_mismatch
-  :plain
-    $('.mr-widget-body').html("#{escape_javascript(render('projects/merge_requests/widget/open/sha_mismatch'))}");
-- else
-  :plain
-    $('.mr-widget-body').html("#{escape_javascript(render('projects/merge_requests/widget/open/reload'))}");
diff --git a/app/views/projects/merge_requests/show/_how_to_merge.html.haml b/app/views/projects/merge_requests/show/_how_to_merge.html.haml
index cde0ce08e14..766cb272bec 100644
--- a/app/views/projects/merge_requests/show/_how_to_merge.html.haml
+++ b/app/views/projects/merge_requests/show/_how_to_merge.html.haml
@@ -8,7 +8,7 @@
         %p
           %strong Step 1.
           Fetch and check out the branch for this merge request
-        = clipboard_button(clipboard_target: "pre#merge-info-1", title: "Copy commands to clipboard")
+        = clipboard_button(target: "pre#merge-info-1", title: "Copy commands to clipboard")
         %pre.dark#merge-info-1
           - if @merge_request.for_fork?
             :preserve
@@ -25,7 +25,7 @@
         %p
           %strong Step 3.
           Merge the branch and fix any conflicts that come up
-        = clipboard_button(clipboard_target: "pre#merge-info-3", title: "Copy commands to clipboard")
+        = clipboard_button(target: "pre#merge-info-3", title: "Copy commands to clipboard")
         %pre.dark#merge-info-3
           - if @merge_request.for_fork?
             :preserve
@@ -38,7 +38,7 @@
         %p
           %strong Step 4.
           Push the result of the merge to GitLab
-        = clipboard_button(clipboard_target: "pre#merge-info-4", title: "Copy commands to clipboard")
+        = clipboard_button(target: "pre#merge-info-4", title: "Copy commands to clipboard")
         %pre.dark#merge-info-4
           :preserve
             git push origin #{h @merge_request.target_branch}
@@ -49,7 +49,7 @@
           %strong Tip:
           = succeed '.' do
             You can also checkout merge requests locally by
-            = link_to 'following these guidelines', help_page_path('user/project/merge_requests.md', anchor: "checkout-merge-requests-locally"), target: '_blank', rel: 'noopener noreferrer'
+            = link_to 'following these guidelines', help_page_path('user/project/merge_requests/index.md', anchor: "checkout-merge-requests-locally"), target: '_blank', rel: 'noopener noreferrer'
 
 :javascript
   $(function(){
diff --git a/app/views/projects/merge_requests/show/_mr_box.html.haml b/app/views/projects/merge_requests/show/_mr_box.html.haml
index 683cb8a5a27..8a390cf8700 100644
--- a/app/views/projects/merge_requests/show/_mr_box.html.haml
+++ b/app/views/projects/merge_requests/show/_mr_box.html.haml
@@ -6,8 +6,7 @@
     - if @merge_request.description.present?
       .description{ class: can?(current_user, :update_merge_request, @merge_request) ? 'js-task-list-container' : '' }
         .wiki
-          = preserve do
-            = markdown_field(@merge_request, :description)
+          = markdown_field(@merge_request, :description)
         %textarea.hidden.js-task-list-field
           = @merge_request.description
 
diff --git a/app/views/projects/merge_requests/show/_pipelines.html.haml b/app/views/projects/merge_requests/show/_pipelines.html.haml
index de4aa255bbd..2f1dbe87619 100644
--- a/app/views/projects/merge_requests/show/_pipelines.html.haml
+++ b/app/views/projects/merge_requests/show/_pipelines.html.haml
@@ -1,3 +1,4 @@
 - endpoint_path = local_assigns[:endpoint] || pipelines_namespace_project_merge_request_path(@project.namespace, @project, @merge_request, format: :json)
+- disable_initialization = local_assigns.fetch(:disable_initialization, false)
 
-= render 'projects/commit/pipelines_list', endpoint: endpoint_path
+= render 'projects/commit/pipelines_list', endpoint: endpoint_path, disable_initialization: disable_initialization
diff --git a/app/views/projects/merge_requests/show/_versions.html.haml b/app/views/projects/merge_requests/show/_versions.html.haml
index 74a7b1dc498..37117bc64a3 100644
--- a/app/views/projects/merge_requests/show/_versions.html.haml
+++ b/app/views/projects/merge_requests/show/_versions.html.haml
@@ -20,25 +20,27 @@
               - @merge_request_diffs.each do |merge_request_diff|
                 %li
                   = link_to merge_request_version_path(@project, @merge_request, merge_request_diff, @start_sha), class: ('is-active' if merge_request_diff == @merge_request_diff) do
-                    %strong
-                      - if merge_request_diff.latest?
-                        latest version
-                      - else
-                        version #{version_index(merge_request_diff)}
-                    .monospace= short_sha(merge_request_diff.head_commit_sha)
-                    %small
-                      #{number_with_delimiter(merge_request_diff.commits_count)} #{'commit'.pluralize(merge_request_diff.commits_count)},
-                      = time_ago_with_tooltip(merge_request_diff.created_at)
+                    %div
+                      %strong
+                        - if merge_request_diff.latest?
+                          latest version
+                        - else
+                          version #{version_index(merge_request_diff)}
+                    %div
+                      %small.commit-sha= short_sha(merge_request_diff.head_commit_sha)
+                    %div
+                      %small
+                        #{number_with_delimiter(merge_request_diff.commits_count)} #{'commit'.pluralize(merge_request_diff.commits_count)},
+                        = time_ago_with_tooltip(merge_request_diff.created_at)
 
       - if @merge_request_diff.base_commit_sha
         and
         %span.dropdown.inline.mr-version-compare-dropdown
           %a.btn.btn-default.dropdown-toggle{ data: {toggle: :dropdown} }
-            %span
-              - if @start_sha
-                version #{version_index(@start_version)}
-              - else
-                #{@merge_request.target_branch}
+            - if @start_version
+              version #{version_index(@start_version)}
+            - else
+              %span.ref-name= @merge_request.target_branch
             = icon('caret-down')
           .dropdown-menu.dropdown-select.dropdown-menu-selectable
             .dropdown-title
@@ -50,19 +52,25 @@
                 - @comparable_diffs.each do |merge_request_diff|
                   %li
                     = link_to merge_request_version_path(@project, @merge_request, @merge_request_diff, merge_request_diff.head_commit_sha), class: ('is-active' if merge_request_diff == @start_version) do
-                      %strong
-                        - if merge_request_diff.latest?
-                          latest version
-                        - else
-                          version #{version_index(merge_request_diff)}
-                      .monospace= short_sha(merge_request_diff.head_commit_sha)
-                      %small
-                        = time_ago_with_tooltip(merge_request_diff.created_at)
+                      %div
+                        %strong
+                          - if merge_request_diff.latest?
+                            latest version
+                          - else
+                            version #{version_index(merge_request_diff)}
+                      %div
+                        %small.commit-sha= short_sha(merge_request_diff.head_commit_sha)
+                      %div
+                        %small
+                          = time_ago_with_tooltip(merge_request_diff.created_at)
                 %li
-                  = link_to merge_request_version_path(@project, @merge_request, @merge_request_diff), class: ('is-active' unless @start_sha) do
-                    %strong
-                      #{@merge_request.target_branch} (base)
-                    .monospace= short_sha(@merge_request_diff.base_commit_sha)
+                  = link_to merge_request_version_path(@project, @merge_request, @merge_request_diff), class: ('is-active' unless @start_version) do
+                    %div
+                      %strong
+                        %span.ref-name= @merge_request.target_branch
+                        (base)
+                    %div
+                      %strong.commit-sha= short_sha(@merge_request_diff.base_commit_sha)
 
     - if different_base?(@start_version, @merge_request_diff)
       .content-block
@@ -72,13 +80,18 @@
         = link_to namespace_project_compare_path(@project.namespace, @project, from: @start_version.base_commit_sha, to: @merge_request_diff.base_commit_sha) do
           new commits
         from
-        %code= @merge_request.target_branch
+        = succeed '.' do
+          %code= @merge_request.target_branch
 
-    - unless @merge_request_diff.latest? && !@start_sha
+    - if @start_version || !@merge_request_diff.latest?
       .comments-disabled-notif.content-block
         = icon('info-circle')
-        - if @start_sha
-          Comments are disabled because you're comparing two versions of this merge request.
+        Not all comments are displayed because you're
+        - if @start_version
+          comparing two versions
         - else
-          Comments are disabled because you're viewing an old version of this merge request.
-        = link_to 'Show latest version', diffs_namespace_project_merge_request_path(@project.namespace, @project, @merge_request), class: 'btn btn-sm'
+          viewing an old version
+        of this merge request.
+
+        .pull-right
+          = link_to 'Show latest version', diffs_namespace_project_merge_request_path(@project.namespace, @project, @merge_request), class: 'btn btn-sm'
diff --git a/app/views/projects/merge_requests/widget/_closed.html.haml b/app/views/projects/merge_requests/widget/_closed.html.haml
deleted file mode 100644
index 15f47ecf210..00000000000
--- a/app/views/projects/merge_requests/widget/_closed.html.haml
+++ /dev/null
@@ -1,12 +0,0 @@
-.mr-state-widget
-  = render 'projects/merge_requests/widget/heading'
-  .mr-widget-body
-    %h4
-      Closed
-      - if @merge_request.closed_event
-        by #{link_to_member(@project, @merge_request.closed_event.author, avatar: true)}
-        #{time_ago_with_tooltip(@merge_request.closed_event.created_at)}
-    %p
-      = succeed '.' do
-        The changes were not merged into
-        %span.label-branch= @merge_request.target_branch
diff --git a/app/views/projects/merge_requests/widget/_commit_change_content.html.haml b/app/views/projects/merge_requests/widget/_commit_change_content.html.haml
new file mode 100644
index 00000000000..ad0ce7bf501
--- /dev/null
+++ b/app/views/projects/merge_requests/widget/_commit_change_content.html.haml
@@ -0,0 +1,4 @@
+- if @merge_request.can_be_reverted?(current_user)
+  = render "projects/commit/change", type: 'revert', commit: @merge_request.merge_commit, title: @merge_request.title
+- if @merge_request.can_be_cherry_picked?
+  = render "projects/commit/change", type: 'cherry-pick', commit: @merge_request.merge_commit, title: @merge_request.title
diff --git a/app/views/projects/merge_requests/widget/_heading.html.haml b/app/views/projects/merge_requests/widget/_heading.html.haml
deleted file mode 100644
index 1298376ac25..00000000000
--- a/app/views/projects/merge_requests/widget/_heading.html.haml
+++ /dev/null
@@ -1,50 +0,0 @@
-- if @pipeline
-  .mr-widget-heading
-    - %w[success success_with_warnings skipped manual canceled failed running pending].each do |status|
-      .ci_widget{ class: "ci-#{status}", style: ("display:none" unless @pipeline.status == status) }
-        %div{ class: "ci-status-icon ci-status-icon-#{status}" }
-          = link_to namespace_project_pipeline_path(@pipeline.project.namespace, @pipeline.project, @pipeline.id), class: 'icon-link' do
-            = ci_icon_for_status(status)
-        %span
-          Pipeline
-          = link_to "##{@pipeline.id}", namespace_project_pipeline_path(@pipeline.project.namespace, @pipeline.project, @pipeline.id), class: 'pipeline'
-          = ci_label_for_status(status)
-        - if @pipeline.stages.any?
-          .mr-widget-pipeline-graph
-            = render 'shared/mini_pipeline_graph', pipeline: @pipeline, klass: 'js-pipeline-inline-mr-widget-graph'
-        %span
-          for
-          = succeed "." do
-            = link_to @pipeline.short_sha, namespace_project_commit_path(@merge_request.source_project.namespace, @merge_request.source_project, @pipeline.sha), class: "monospace js-commit-link"
-        %span.ci-coverage
-
-- elsif @merge_request.has_ci?
-  -# Compatibility with old CI integrations (ex jenkins) when you request status from CI server via AJAX
-  -# TODO, remove in later versions when services like Jenkins will set CI status via Commit status API
-  .mr-widget-heading
-    - %w[success skipped canceled failed running pending].each do |status|
-      .ci_widget{ class: "ci-#{status} ci-status-icon-#{status}", style: "display:none" }
-        = ci_icon_for_status(status)
-        %span
-          CI job
-          = ci_label_for_status(status)
-          for
-        - commit = @merge_request.diff_head_commit
-        = succeed "." do
-          = link_to commit.short_id, namespace_project_commit_path(@merge_request.source_project.namespace, @merge_request.source_project, commit), class: "monospace"
-        %span.ci-coverage
-
-    .ci_widget
-      = icon("spinner spin")
-      Checking CI status for #{@merge_request.diff_head_commit.short_id}&hellip;
-
-    .ci_widget.ci-not_found{ style: "display:none" }
-      = icon("times-circle")
-      Could not find CI status for #{@merge_request.diff_head_commit.short_id}.
-
-    .ci_widget.ci-error{ style: "display:none" }
-      = icon("times-circle")
-      Could not connect to the CI server. Please check your settings and try again.
-
-.js-success-icon.hidden
-  = ci_icon_for_status('success')
diff --git a/app/views/projects/merge_requests/widget/_locked.html.haml b/app/views/projects/merge_requests/widget/_locked.html.haml
deleted file mode 100644
index 78d0783cba0..00000000000
--- a/app/views/projects/merge_requests/widget/_locked.html.haml
+++ /dev/null
@@ -1,9 +0,0 @@
-.mr-state-widget
-  = render 'projects/merge_requests/widget/heading'
-  .mr-widget-body
-    %h4
-      = icon("spinner spin")
-      Merge in progress&hellip;
-    %p
-      This merge request is in the process of being merged, during which time it is locked and cannot be closed.
-
diff --git a/app/views/projects/merge_requests/widget/_merged.html.haml b/app/views/projects/merge_requests/widget/_merged.html.haml
deleted file mode 100644
index adc3bbc37f3..00000000000
--- a/app/views/projects/merge_requests/widget/_merged.html.haml
+++ /dev/null
@@ -1,52 +0,0 @@
-.mr-state-widget
-  = render 'projects/merge_requests/widget/heading'
-  .mr-widget-body
-    %h4
-      Merged
-      - if @merge_request.merge_event
-        by #{link_to_member(@project, @merge_request.merge_event.author, avatar: true)}
-        #{time_ago_with_tooltip(@merge_request.merge_event.created_at)}
-    - if !@merge_request.source_branch_exists? || params[:deleted_source_branch]
-      .remove-message-pipes
-        %ul
-          %li
-            %span
-              The changes were merged into
-              #{link_to @merge_request.target_branch, namespace_project_commits_path(@project.namespace, @project, @merge_request.target_branch), class: "label-branch"}.
-          %li
-            %span
-              The source branch has been removed.
-      = render 'projects/merge_requests/widget/merged_buttons'
-    - elsif @merge_request.can_remove_source_branch?(current_user)
-      .remove_source_branch_widget.remove-message-pipes
-        %ul
-          %li
-            %span
-              The changes were merged into
-              #{link_to @merge_request.target_branch, namespace_project_commits_path(@project.namespace, @project, @merge_request.target_branch), class: "label-branch"}.
-          %li
-            %span
-              You can remove the source branch now.
-        = render 'projects/merge_requests/widget/merged_buttons', source_branch_exists: true
-      .remove_source_branch_widget.failed.remove-message-pipes.hide
-        %ul
-          %li
-            %span
-              Failed to remove source branch '#{@merge_request.source_branch}'.
-      .remove_source_branch_in_progress.remove-message-pipes.hide
-        %ul
-          %li
-            %span
-              = icon('spinner spin')
-              Removing source branch '#{@merge_request.source_branch}'.
-          %li
-            %span
-              Please wait, this page will be automatically reloaded.
-    - else
-      .remove-message-pipes
-        %ul
-          %li
-            %span
-              The changes were merged into
-              #{link_to @merge_request.target_branch, namespace_project_commits_path(@project.namespace, @project, @merge_request.target_branch), class: "label-branch"}.
-        = render 'projects/merge_requests/widget/merged_buttons'
diff --git a/app/views/projects/merge_requests/widget/_merged_buttons.haml b/app/views/projects/merge_requests/widget/_merged_buttons.haml
deleted file mode 100644
index caf3bf54eef..00000000000
--- a/app/views/projects/merge_requests/widget/_merged_buttons.haml
+++ /dev/null
@@ -1,14 +0,0 @@
-- can_remove_source_branch = local_assigns.fetch(:source_branch_exists, false) && @merge_request.can_remove_source_branch?(current_user)
-- mr_can_be_reverted = @merge_request.can_be_reverted?(current_user)
-- mr_can_be_cherry_picked = @merge_request.can_be_cherry_picked?
-
-- if can_remove_source_branch || mr_can_be_reverted || mr_can_be_cherry_picked
-  .clearfix.merged-buttons
-    - if can_remove_source_branch
-      = link_to namespace_project_branch_path(@merge_request.source_project.namespace, @merge_request.source_project, @merge_request.source_branch), remote: true, method: :delete, class: "btn btn-default remove_source_branch" do
-        = icon('trash-o')
-        Remove Source Branch
-    - if mr_can_be_reverted
-      = revert_commit_link(@merge_request.merge_commit, namespace_project_merge_request_path(@project.namespace, @project, @merge_request), btn_class: "close")
-    - if mr_can_be_cherry_picked
-      = cherry_pick_commit_link(@merge_request.merge_commit, namespace_project_merge_request_path(@project.namespace, @project, @merge_request), btn_class: "default")
diff --git a/app/views/projects/merge_requests/widget/_open.html.haml b/app/views/projects/merge_requests/widget/_open.html.haml
deleted file mode 100644
index bc426f1dc0c..00000000000
--- a/app/views/projects/merge_requests/widget/_open.html.haml
+++ /dev/null
@@ -1,47 +0,0 @@
-.mr-state-widget
-  = render 'projects/merge_requests/widget/heading'
-  .mr-widget-body
-    -# After conflicts are resolved, the user is redirected back to the MR page.
-    -# There is a short window before background workers run and GitLab processes
-    -# the new push and commits, during which it will think the conflicts still exist.
-    -# We send this param to get the widget to treat the MR as having no more conflicts.
-    - resolved_conflicts = params[:resolved_conflicts]
-
-    - if @project.archived?
-      = render 'projects/merge_requests/widget/open/archived'
-    - elsif @merge_request.branch_missing?
-      = render 'projects/merge_requests/widget/open/missing_branch'
-    - elsif @merge_request.has_no_commits?
-      = render 'projects/merge_requests/widget/open/nothing'
-    - elsif @merge_request.unchecked?
-      = render 'projects/merge_requests/widget/open/check'
-    - elsif @merge_request.cannot_be_merged? && !resolved_conflicts
-      = render 'projects/merge_requests/widget/open/conflicts'
-    - elsif @merge_request.work_in_progress?
-      = render 'projects/merge_requests/widget/open/wip'
-    - elsif @merge_request.merge_when_pipeline_succeeds?
-      = render 'projects/merge_requests/widget/open/merge_when_pipeline_succeeds'
-    - elsif !@merge_request.can_be_merged_by?(current_user)
-      = render 'projects/merge_requests/widget/open/not_allowed'
-    - elsif !@merge_request.mergeable_ci_state? && (@pipeline.failed? || @pipeline.canceled?)
-      = render 'projects/merge_requests/widget/open/build_failed'
-    - elsif !@merge_request.mergeable_discussions_state?
-      = render 'projects/merge_requests/widget/open/unresolved_discussions'
-    - elsif @pipeline&.blocked?
-      = render 'projects/merge_requests/widget/open/manual'
-    - elsif @merge_request.can_be_merged? || resolved_conflicts
-      = render 'projects/merge_requests/widget/open/accept'
-
-  - if mr_closes_issues.present? || mr_issues_mentioned_but_not_closing.present?
-    .mr-widget-footer
-      %span
-        = icon('check')
-        - if mr_closes_issues.present?
-          Accepting this merge request will close #{"issue".pluralize(mr_closes_issues.size)}
-          = succeed '.' do
-            != markdown issues_sentence(mr_closes_issues), pipeline: :gfm, author: @merge_request.author
-          = mr_assign_issues_link
-        - if mr_issues_mentioned_but_not_closing.present?
-          #{"Issue".pluralize(mr_issues_mentioned_but_not_closing.size)}
-          != markdown issues_sentence(mr_issues_mentioned_but_not_closing), pipeline: :gfm, author: @merge_request.author
-          #{mr_issues_mentioned_but_not_closing.size > 1 ? 'are' : 'is'} mentioned but will not be closed.
diff --git a/app/views/projects/merge_requests/widget/_show.html.haml b/app/views/projects/merge_requests/widget/_show.html.haml
deleted file mode 100644
index 0b0fb7854c2..00000000000
--- a/app/views/projects/merge_requests/widget/_show.html.haml
+++ /dev/null
@@ -1,39 +0,0 @@
-- if @merge_request.open?
-  = render 'projects/merge_requests/widget/open'
-- elsif @merge_request.merged?
-  = render 'projects/merge_requests/widget/merged'
-- elsif @merge_request.closed?
-  = render 'projects/merge_requests/widget/closed'
-- elsif @merge_request.locked?
-  = render 'projects/merge_requests/widget/locked'
-
-:javascript
-  var opts = {
-    merge_check_url: "#{merge_check_namespace_project_merge_request_path(@project.namespace, @project, @merge_request)}",
-    check_enable: #{@merge_request.unchecked? ? "true" : "false"},
-    ci_status_url: "#{ci_status_namespace_project_merge_request_path(@project.namespace, @project, @merge_request)}",
-    ci_environments_status_url: "#{ci_environments_status_namespace_project_merge_request_path(@project.namespace, @project, @merge_request)}",
-    gitlab_icon: "#{asset_path 'gitlab_logo.png'}",
-    ci_status: "#{@merge_request.head_pipeline ? @merge_request.head_pipeline.status : ''}",
-    ci_message: {
-      normal: "Pipeline {{status}} for \"{{title}}\"",
-      preparing: "{{status}} pipeline for \"{{title}}\""
-    },
-    ci_enable: #{@project.ci_service ? "true" : "false"},
-    ci_title: {
-      preparing: "{{status}} pipeline",
-      normal: "Pipeline {{status}}"
-    },
-    ci_sha: "#{@merge_request.head_pipeline ? @merge_request.head_pipeline.short_sha : ''}",
-    ci_pipeline: #{@merge_request.head_pipeline.try(:id).to_json},
-    commits_path: "#{project_commits_path(@project)}",
-    pipeline_path: "#{project_pipelines_path(@project)}",
-    pipelines_path: "#{pipelines_namespace_project_merge_request_path(@project.namespace, @project, @merge_request)}"
-  };
-
-  if (typeof merge_request_widget !== 'undefined') {
-    merge_request_widget.cancelPolling();
-    merge_request_widget.clearEventListeners();
-  }
-
-  merge_request_widget = new window.gl.MergeRequestWidget(opts);
diff --git a/app/views/projects/merge_requests/widget/open/_accept.html.haml b/app/views/projects/merge_requests/widget/open/_accept.html.haml
deleted file mode 100644
index e5ec151a61d..00000000000
--- a/app/views/projects/merge_requests/widget/open/_accept.html.haml
+++ /dev/null
@@ -1,50 +0,0 @@
-- content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('merge_request_widget')
-
-= form_for [:merge, @project.namespace.becomes(Namespace), @project, @merge_request], remote: true, method: :post, html: { class: 'accept-mr-form js-quick-submit js-requires-input' } do |f|
-  = hidden_field_tag :authenticity_token, form_authenticity_token
-  = hidden_field_tag :sha, @merge_request.diff_head_sha
-  .accept-merge-holder.clearfix.js-toggle-container
-    .clearfix
-      .accept-action
-        - if @pipeline && @pipeline.active?
-          %span.btn-group
-            = button_tag class: "btn btn-info js-merge-when-pipeline-succeeds-button merge-when-pipeline-succeeds" do
-              Merge When Pipeline Succeeds
-            - unless @project.only_allow_merge_if_pipeline_succeeds?
-              = button_tag class: "btn btn-info dropdown-toggle", 'data-toggle' => 'dropdown' do
-                = icon('caret-down')
-                %span.sr-only
-                  Select Merge Moment
-              %ul.js-merge-dropdown.dropdown-menu.dropdown-menu-right{ role: 'menu' }
-                %li
-                  = link_to "#", class: "merge_when_pipeline_succeeds" do
-                    = icon('check fw')
-                    Merge When Pipeline Succeeds
-                %li
-                  = link_to "#", class: "accept-merge-request" do
-                    = icon('warning fw')
-                    Merge Immediately
-        - else
-          = f.button class: "btn btn-grouped js-merge-button accept-merge-request" do
-            Accept Merge Request
-      - if @merge_request.force_remove_source_branch?
-        .accept-control
-          The source branch will be removed.
-      - elsif @merge_request.can_remove_source_branch?(current_user)
-        .accept-control.checkbox
-          = label_tag :should_remove_source_branch, class: "merge-param-checkbox" do
-            = check_box_tag :should_remove_source_branch
-            Remove source branch
-      .accept-control
-        %button.modify-merge-commit-link.js-toggle-button{ type: "button" }
-          = icon('edit')
-          Modify commit message
-    .js-toggle-content.hide.prepend-top-default
-      = render 'shared/commit_message_container', params: params,
-          message_with_description: @merge_request.merge_commit_message(include_description: true),
-          message_without_description: @merge_request.merge_commit_message,
-          text: @merge_request.merge_commit_message,
-          rows: 14, hint: true
-
-    = hidden_field_tag :merge_when_pipeline_succeeds, "", autocomplete: "off"
diff --git a/app/views/projects/merge_requests/widget/open/_archived.html.haml b/app/views/projects/merge_requests/widget/open/_archived.html.haml
deleted file mode 100644
index 0d61e56d8fb..00000000000
--- a/app/views/projects/merge_requests/widget/open/_archived.html.haml
+++ /dev/null
@@ -1,4 +0,0 @@
-%h4
-  Project is archived
-%p
-  This merge request cannot be merged because archived projects cannot be written to.
diff --git a/app/views/projects/merge_requests/widget/open/_build_failed.html.haml b/app/views/projects/merge_requests/widget/open/_build_failed.html.haml
deleted file mode 100644
index 3979d5fa8ed..00000000000
--- a/app/views/projects/merge_requests/widget/open/_build_failed.html.haml
+++ /dev/null
@@ -1,6 +0,0 @@
-%h4
-  = icon('exclamation-triangle')
-  The pipeline for this merge request failed
-
-%p
-  Please retry the job or push a new commit to fix the failure.
diff --git a/app/views/projects/merge_requests/widget/open/_check.html.haml b/app/views/projects/merge_requests/widget/open/_check.html.haml
deleted file mode 100644
index 909dc52fc06..00000000000
--- a/app/views/projects/merge_requests/widget/open/_check.html.haml
+++ /dev/null
@@ -1,6 +0,0 @@
-- content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('merge_request_widget')
-
-%strong
-  = icon("spinner spin")
-  Checking ability to merge automatically&hellip;
diff --git a/app/views/projects/merge_requests/widget/open/_conflicts.html.haml b/app/views/projects/merge_requests/widget/open/_conflicts.html.haml
deleted file mode 100644
index 621ee313026..00000000000
--- a/app/views/projects/merge_requests/widget/open/_conflicts.html.haml
+++ /dev/null
@@ -1,27 +0,0 @@
-- can_resolve = @merge_request.conflicts_can_be_resolved_by?(current_user)
-- can_resolve_in_ui = @merge_request.conflicts_can_be_resolved_in_ui?
-- can_merge = @merge_request.can_be_merged_via_command_line_by?(current_user)
-
-%h4.has-conflicts
-  %p
-    = icon("exclamation-triangle")
-    This merge request contains merge conflicts
-
-.remove-message-pipes
-  %ul
-    %li
-      %span
-        To merge this request, resolve these conflicts
-        - if can_resolve && !can_resolve_in_ui
-          locally
-        or
-        - unless can_merge
-          ask someone with write access to this repository to
-        merge it locally.
-
-- if (can_resolve && can_resolve_in_ui) || can_merge
-  .merged-buttons.clearfix
-    - if can_resolve && can_resolve_in_ui
-      = link_to "Resolve conflicts", conflicts_namespace_project_merge_request_path(@project.namespace, @project, @merge_request), class: "btn"
-    - if can_merge
-      = link_to "Merge locally", "#modal_merge_info", class: "btn how_to_merge_link vlink", "data-toggle" => "modal"
diff --git a/app/views/projects/merge_requests/widget/open/_error.html.haml b/app/views/projects/merge_requests/widget/open/_error.html.haml
new file mode 100644
index 00000000000..bbdc053609f
--- /dev/null
+++ b/app/views/projects/merge_requests/widget/open/_error.html.haml
@@ -0,0 +1,6 @@
+%h4
+  = icon('exclamation-triangle')
+  This merge request failed to be merged automatically
+
+%p
+  = @merge_request.merge_error
diff --git a/app/views/projects/merge_requests/widget/open/_manual.html.haml b/app/views/projects/merge_requests/widget/open/_manual.html.haml
deleted file mode 100644
index 9078b7e21dd..00000000000
--- a/app/views/projects/merge_requests/widget/open/_manual.html.haml
+++ /dev/null
@@ -1,4 +0,0 @@
-%h4
-  Pipeline blocked
-%p
-  The pipeline for this merge request requires a manual action to proceed.
diff --git a/app/views/projects/merge_requests/widget/open/_merge_when_pipeline_succeeds.html.haml b/app/views/projects/merge_requests/widget/open/_merge_when_pipeline_succeeds.html.haml
deleted file mode 100644
index 5f347acce4d..00000000000
--- a/app/views/projects/merge_requests/widget/open/_merge_when_pipeline_succeeds.html.haml
+++ /dev/null
@@ -1,33 +0,0 @@
-- content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('merge_request_widget')
-
-%h4
-  Set by #{link_to_member(@project, @merge_request.merge_user, avatar: true)}
-  to be merged automatically when the pipeline succeeds.
-.remove-message-pipes
-  %ul
-    %li
-      %span
-        = succeed '.' do
-          The changes will be merged into #{link_to @merge_request.target_branch, namespace_project_commits_path(@project.namespace, @project, @merge_request.target_branch), class: "label-branch"}
-        - if @merge_request.remove_source_branch?
-          %li
-            %span
-              The source branch will be removed.
-        - else
-          %li
-            %span
-              The source branch will not be removed.
-
-  - remove_source_branch_button = !@merge_request.remove_source_branch? && @merge_request.can_remove_source_branch?(current_user) && @merge_request.merge_user == current_user
-  - user_can_cancel_automatic_merge = @merge_request.can_cancel_merge_when_pipeline_succeeds?(current_user)
-  - if remove_source_branch_button || user_can_cancel_automatic_merge
-    .clearfix.prepend-top-10
-      - if remove_source_branch_button
-        = link_to merge_namespace_project_merge_request_path(@merge_request.target_project.namespace, @merge_request.target_project, @merge_request, merge_params(@merge_request)), remote: true, method: :post, class: "btn btn-grouped btn-primary btn-sm remove_source_branch" do
-          = icon('times')
-          Remove Source Branch When Merged
-
-      - if user_can_cancel_automatic_merge
-        = link_to cancel_merge_when_pipeline_succeeds_namespace_project_merge_request_path(@merge_request.target_project.namespace, @merge_request.target_project, @merge_request), remote: true, method: :post, class: "btn btn-grouped btn-sm" do
-          Cancel Automatic Merge
diff --git a/app/views/projects/merge_requests/widget/open/_missing_branch.html.haml b/app/views/projects/merge_requests/widget/open/_missing_branch.html.haml
deleted file mode 100644
index c9f07629493..00000000000
--- a/app/views/projects/merge_requests/widget/open/_missing_branch.html.haml
+++ /dev/null
@@ -1,16 +0,0 @@
-- unless @merge_request.source_branch_exists?
-  %h4
-    = icon("exclamation-triangle")
-    Source branch
-    %span.label-branch= source_branch_with_namespace(@merge_request)
-    does not exist
-  %p
-    Please restore the source branch or close this merge request and open a new merge request with a different source branch.
-- else
-  %h4
-    = icon("exclamation-triangle")
-    Target branch
-    %span.label-branch= @merge_request.target_branch
-    does not exist
-  %p
-    Please restore the target branch or use a different target branch.
diff --git a/app/views/projects/merge_requests/widget/open/_not_allowed.html.haml b/app/views/projects/merge_requests/widget/open/_not_allowed.html.haml
deleted file mode 100644
index 57ce1959021..00000000000
--- a/app/views/projects/merge_requests/widget/open/_not_allowed.html.haml
+++ /dev/null
@@ -1,6 +0,0 @@
-%h4
-  Ready to be merged automatically
-%p
-  Ask someone with write access to this repository to merge this request.
-  - if @merge_request.force_remove_source_branch?
-    The source branch will be removed.
diff --git a/app/views/projects/merge_requests/widget/open/_nothing.html.haml b/app/views/projects/merge_requests/widget/open/_nothing.html.haml
deleted file mode 100644
index 7af8c01c134..00000000000
--- a/app/views/projects/merge_requests/widget/open/_nothing.html.haml
+++ /dev/null
@@ -1,8 +0,0 @@
-%h4
-  = icon("exclamation-triangle")
-  Nothing to merge from
-  %span.label-branch= source_branch_with_namespace(@merge_request)
-  into
-  %span.label-branch= @merge_request.target_branch
-%p
-  Please push new commits to the source branch or use a different target branch.
diff --git a/app/views/projects/merge_requests/widget/open/_reload.html.haml b/app/views/projects/merge_requests/widget/open/_reload.html.haml
deleted file mode 100644
index acfc31725eb..00000000000
--- a/app/views/projects/merge_requests/widget/open/_reload.html.haml
+++ /dev/null
@@ -1,6 +0,0 @@
-%h4
-  = icon("exclamation-triangle")
-  This merge request failed to be merged automatically
-
-%p
-  Please reload the page to find out the reason.
diff --git a/app/views/projects/merge_requests/widget/open/_sha_mismatch.html.haml b/app/views/projects/merge_requests/widget/open/_sha_mismatch.html.haml
deleted file mode 100644
index 499624f8dd8..00000000000
--- a/app/views/projects/merge_requests/widget/open/_sha_mismatch.html.haml
+++ /dev/null
@@ -1,6 +0,0 @@
-%h4
-  = icon("exclamation-triangle")
-  This merge request has received new commits since the page was loaded.
-
-%p
-  Please reload the page to review the new commits before merging.
diff --git a/app/views/projects/merge_requests/widget/open/_unresolved_discussions.html.haml b/app/views/projects/merge_requests/widget/open/_unresolved_discussions.html.haml
deleted file mode 100644
index ec9346ce89b..00000000000
--- a/app/views/projects/merge_requests/widget/open/_unresolved_discussions.html.haml
+++ /dev/null
@@ -1,10 +0,0 @@
-%h4
-  = icon('exclamation-triangle')
-  This merge request has unresolved discussions
-
-%p
-  Please resolve these discussions
-  - if @project.issues_enabled? && can?(current_user, :create_issue, @project)
-    or
-    = link_to "open an issue to resolve them later", new_namespace_project_issue_path(@project.namespace, @project, merge_request_to_resolve_discussions_of: @merge_request.iid)
-  to allow this merge request to be merged.
diff --git a/app/views/projects/merge_requests/widget/open/_wip.html.haml b/app/views/projects/merge_requests/widget/open/_wip.html.haml
deleted file mode 100644
index c296422a9cf..00000000000
--- a/app/views/projects/merge_requests/widget/open/_wip.html.haml
+++ /dev/null
@@ -1,11 +0,0 @@
-%h4
-  This merge request is currently a Work In Progress
-
-- if can?(current_user, :update_merge_request, @merge_request)
-  %p
-    When this merge request is ready,
-    = link_to remove_wip_namespace_project_merge_request_path(@project.namespace, @project, @merge_request), method: :post do
-      remove the
-      %code WIP:
-      prefix from the title
-    to allow it to be merged.
diff --git a/app/views/projects/milestones/_form.html.haml b/app/views/projects/milestones/_form.html.haml
index 0f4a8508751..9a95b2a82ff 100644
--- a/app/views/projects/milestones/_form.html.haml
+++ b/app/views/projects/milestones/_form.html.haml
@@ -9,9 +9,9 @@
       .form-group.milestone-description
         = f.label :description, "Description", class: "control-label"
         .col-sm-10
-          = render layout: 'projects/md_preview', locals: { preview_class: "md-preview" } do
+          = render layout: 'projects/md_preview', locals: { url: preview_markdown_path(@project) } do
             = render 'projects/zen', f: f, attr: :description, classes: 'note-textarea', placeholder: 'Write milestone description...'
-            = render 'projects/notes/hints'
+            = render 'shared/notes/hints'
           .clearfix
           .error-alert
     = render "shared/milestones/form_dates", f: f
diff --git a/app/views/projects/milestones/edit.html.haml b/app/views/projects/milestones/edit.html.haml
index 55b0b837c6d..1e66c6079e3 100644
--- a/app/views/projects/milestones/edit.html.haml
+++ b/app/views/projects/milestones/edit.html.haml
@@ -1,11 +1,11 @@
 - @no_container = true
 - page_title "Edit", @milestone.title, "Milestones"
-= render "projects/issues/head"
+= render "shared/mr_head"
 
 %div{ class: container_class }
 
   %h3.page-title
-    Edit Milestone #{@milestone.to_reference}
+    Edit Milestone
 
   %hr
 
diff --git a/app/views/projects/milestones/index.html.haml b/app/views/projects/milestones/index.html.haml
index b6340a00b29..e1096bd1d67 100644
--- a/app/views/projects/milestones/index.html.haml
+++ b/app/views/projects/milestones/index.html.haml
@@ -1,6 +1,6 @@
 - @no_container = true
 - page_title 'Milestones'
-= render 'projects/issues/head'
+= render "shared/mr_head"
 
 %div{ class: container_class }
   .top-area
@@ -9,8 +9,8 @@
     .nav-controls
       = render 'shared/milestones_sort_dropdown'
       - if can?(current_user, :admin_milestone, @project)
-        = link_to new_namespace_project_milestone_path(@project.namespace, @project), class: 'btn btn-new', title: 'New Milestone' do
-          New Milestone
+        = link_to new_namespace_project_milestone_path(@project.namespace, @project), class: 'btn btn-new', title: 'New milestone' do
+          New milestone
 
   .milestones
     %ul.content-list
diff --git a/app/views/projects/milestones/new.html.haml b/app/views/projects/milestones/new.html.haml
index cda093ade81..586eb909afa 100644
--- a/app/views/projects/milestones/new.html.haml
+++ b/app/views/projects/milestones/new.html.haml
@@ -1,6 +1,6 @@
 - @no_container = true
 - page_title "New Milestone"
-= render "projects/issues/head"
+= render "shared/mr_head"
 
 %div{ class: container_class }
   %h3.page-title
diff --git a/app/views/projects/milestones/show.html.haml b/app/views/projects/milestones/show.html.haml
index f612b5c7d6b..4b692aba11c 100644
--- a/app/views/projects/milestones/show.html.haml
+++ b/app/views/projects/milestones/show.html.haml
@@ -1,10 +1,7 @@
 - @no_container = true
 - page_title       @milestone.title, "Milestones"
 - page_description @milestone.description
-= render "projects/issues/head"
-
-- content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('simulate_drag') if Rails.env.test?
+= render "shared/mr_head"
 
 %div{ class: container_class }
   .detail-page-header.milestone-page-header
@@ -20,15 +17,15 @@
     .header-text-content
       %span.identifier
         %strong
-          Milestone #{@milestone.to_reference}
+          Milestone
       - if @milestone.due_date || @milestone.start_date
         = milestone_date_range(@milestone)
     .milestone-buttons
       - if can?(current_user, :admin_milestone, @project)
         - if @milestone.active?
-          = link_to 'Close Milestone', namespace_project_milestone_path(@project.namespace, @project, @milestone, milestone: {state_event: :close }), method: :put, class: "btn btn-close btn-nr btn-grouped"
+          = link_to 'Close milestone', namespace_project_milestone_path(@project.namespace, @project, @milestone, milestone: {state_event: :close }), method: :put, class: "btn btn-close btn-nr btn-grouped"
         - else
-          = link_to 'Reopen Milestone', namespace_project_milestone_path(@project.namespace, @project, @milestone, milestone: {state_event: :activate }), method: :put, class: "btn btn-reopen btn-nr btn-grouped"
+          = link_to 'Reopen milestone', namespace_project_milestone_path(@project.namespace, @project, @milestone, milestone: {state_event: :activate }), method: :put, class: "btn btn-reopen btn-nr btn-grouped"
 
         = link_to edit_namespace_project_milestone_path(@project.namespace, @project, @milestone), class: "btn btn-grouped btn-nr" do
           Edit
@@ -39,15 +36,14 @@
       %a.btn.btn-default.btn-grouped.pull-right.visible-xs-block.js-sidebar-toggle{ href: "#" }
         = icon('angle-double-left')
 
-  .detail-page-description.milestone-detail{ class: ('hide-bottom-border' unless @milestone.description.present? ) }
+  .detail-page-description.milestone-detail
     %h2.title
       = markdown_field(@milestone, :title)
     %div
       - if @milestone.description.present?
         .description
           .wiki
-            = preserve do
-              = markdown_field(@milestone, :description)
+            = markdown_field(@milestone, :description)
 
   - if can?(current_user, :read_issue, @project) && @milestone.total_items_count(current_user).zero?
     .alert.alert-success.prepend-top-default
diff --git a/app/views/projects/new.html.haml b/app/views/projects/new.html.haml
index 09ac1fd6794..e180cb8bad1 100644
--- a/app/views/projects/new.html.haml
+++ b/app/views/projects/new.html.haml
@@ -30,7 +30,7 @@
                     #{root_url}#{current_user.username}/
                   = f.hidden_field :namespace_id, value: current_user.namespace_id
           .form-group.col-xs-12.col-sm-6.project-path
-            = f.label :namespace_id, class: 'label-light' do
+            = f.label :path, class: 'label-light' do
               %span
                 Project name
             = f.text_field :path, placeholder: "my-awesome-project", class: "form-control", tabindex: 2, autofocus: true, required: true
@@ -78,7 +78,7 @@
                   - if git_import_enabled?
                     %button.btn.js-toggle-button.import_git{ type: "button" }
                       = icon('git', text: 'Repo by URL')
-                .import_gitlab_project
+                .import_gitlab_project.has-tooltip{ data: { container: 'body' } }
                   - if gitlab_project_import_enabled?
                     = link_to new_import_gitlab_project_path, class: 'btn btn_import_gitlab_project project-submit' do
                       = icon('gitlab', text: 'GitLab export')
@@ -109,6 +109,9 @@
     %p Please wait a moment, this page will automatically refresh when ready.
 
 :javascript
+  var importBtnTooltip = "Please enter a valid project name.";
+  var $importBtnWrapper = $('.import_gitlab_project');
+
   $('.how_to_import_link').bind('click', function (e) {
     e.preventDefault();
     var import_modal = $(this).next(".modal").show();
@@ -123,15 +126,8 @@
     $(".btn_import_gitlab_project").attr("href", _href + '?namespace_id=' + $("#project_namespace_id").val() + '&path=' + $("#project_path").val());
   });
 
-  $('.btn_import_gitlab_project').attr('disabled',true)
-  $('.import_gitlab_project').attr('title', 'Project path and name required.');
-
-  $('.import_gitlab_project').click(function( event ) {
-    if($('.btn_import_gitlab_project').attr('disabled')) {
-      event.preventDefault();
-      new Flash("Please enter path and name for the project to be imported to.");
-    }
-  });
+  $('.btn_import_gitlab_project').attr('disabled', $('#project_path').val().trim().length === 0);
+  $importBtnWrapper.attr('title', importBtnTooltip);
 
   $('#new_project').submit(function(){
     var $path = $('#project_path');
@@ -139,17 +135,18 @@
   });
 
   $('#project_path').keyup(function(){
-    if($(this).val().length !=0) {
+    if($(this).val().trim().length !== 0) {
       $('.btn_import_gitlab_project').attr('disabled', false);
-      $('.import_gitlab_project').attr('title','');
-      $(".flash-container").html("")
+      $importBtnWrapper.attr('title','');
+      $importBtnWrapper.removeClass('has-tooltip');
     } else {
       $('.btn_import_gitlab_project').attr('disabled',true);
-      $('.import_gitlab_project').attr('title', 'Project path and name required.');
+      $importBtnWrapper.addClass('has-tooltip');
     }
   });
 
+  $('#project_import_url').disable();
   $('.import_git').click(function( event ) {
-    $projectImportUrl = $('#project_import_url')
-    $projectImportUrl.attr('disabled', !$projectImportUrl.attr('disabled'))
+    $projectImportUrl = $('#project_import_url');
+    $projectImportUrl.attr('disabled', !$projectImportUrl.attr('disabled'));
   });
diff --git a/app/views/projects/notes/_actions.html.haml b/app/views/projects/notes/_actions.html.haml
new file mode 100644
index 00000000000..3e79dbec70c
--- /dev/null
+++ b/app/views/projects/notes/_actions.html.haml
@@ -0,0 +1,44 @@
+- access = note_max_access_for_user(note)
+- if access
+  %span.note-role= access
+
+- if note.resolvable?
+  - can_resolve = can?(current_user, :resolve_note, note)
+  %resolve-btn{ "project-path" => project_path(note.project),
+      "discussion-id" => note.discussion_id(@noteable),
+      ":note-id" => note.id,
+      ":resolved" => note.resolved?,
+      ":can-resolve" => can_resolve,
+      ":author-name" => "'#{j(note.author.name)}'",
+      "author-avatar" => note.author.avatar_url,
+      ":note-truncated" => "'#{j(truncate(note.note, length: 17))}'",
+      ":resolved-by" => "'#{j(note.resolved_by.try(:name))}'",
+      "v-show" => "#{can_resolve || note.resolved?}",
+      "inline-template" => true,
+      "ref" => "note_#{note.id}" }
+
+    %button.note-action-button.line-resolve-btn{ type: "button",
+        class: ("is-disabled" unless can_resolve),
+        ":class" => "{ 'is-active': isResolved }",
+        ":aria-label" => "buttonText",
+        "@click" => "resolve",
+        ":title" => "buttonText",
+        ":ref" => "'button'" }
+
+      = icon('spin spinner', 'v-show' => 'loading', class: 'loading', 'aria-hidden' => 'true', 'aria-label' => 'Loading')
+      %div{ 'v-show' => '!loading' }= render 'shared/icons/icon_status_success.svg'
+
+- if current_user
+  - if note.emoji_awardable?
+    - user_authored = note.user_authored?(current_user)
+    = link_to '#', title: 'Add reaction', class: "note-action-button note-emoji-button js-add-award js-note-emoji #{'js-user-authored' if user_authored} has-tooltip", data: { position: 'right' } do
+      = icon('spinner spin')
+      %span{ class: 'link-highlight award-control-icon-neutral' }= custom_icon('emoji_slightly_smiling_face')
+      %span{ class: 'link-highlight award-control-icon-positive' }= custom_icon('emoji_smiley')
+      %span{ class: 'link-highlight award-control-icon-super-positive' }= custom_icon('emoji_smile')
+
+  - if note_editable
+    = link_to '#', title: 'Edit comment', class: 'note-action-button js-note-edit has-tooltip' do
+      = icon('pencil', class: 'link-highlight')
+    = link_to namespace_project_note_path(note.project.namespace, note.project, note), title: 'Remove comment', method: :delete, data: { confirm: 'Are you sure you want to remove this comment?' }, remote: true, class: 'note-action-button js-note-delete danger has-tooltip' do
+      = icon('trash-o', class: 'danger-highlight')
diff --git a/app/views/projects/notes/_edit_form.html.haml b/app/views/projects/notes/_edit_form.html.haml
deleted file mode 100644
index e8e450742b5..00000000000
--- a/app/views/projects/notes/_edit_form.html.haml
+++ /dev/null
@@ -1,14 +0,0 @@
-.note-edit-form
-  = form_tag '#', method: :put, class: 'edit-note common-note-form js-quick-submit' do
-    = hidden_field_tag :target_id, '', class: 'js-form-target-id'
-    = hidden_field_tag :target_type, '', class: 'js-form-target-type'
-    = render layout: 'projects/md_preview', locals: { preview_class: 'md-preview', referenced_users: true } do
-      = render 'projects/zen', attr: 'note[note]', classes: 'note-textarea js-note-text js-task-list-field', placeholder: "Write a comment or drag your files here..."
-      = render 'projects/notes/hints'
-
-    .note-form-actions.clearfix
-      .settings-message.note-edit-warning.js-edit-warning
-        Finish editing this message first!
-      = submit_tag 'Save Comment', class: 'btn btn-nr btn-save js-comment-button'
-      %button.btn.btn-nr.btn-cancel.note-edit-cancel{ type: 'button' }
-        Cancel
diff --git a/app/views/projects/notes/_form.html.haml b/app/views/projects/notes/_form.html.haml
deleted file mode 100644
index b561052e721..00000000000
--- a/app/views/projects/notes/_form.html.haml
+++ /dev/null
@@ -1,28 +0,0 @@
-- supports_slash_commands = note_supports_slash_commands?(@note)
-
-= form_for [@project.namespace.becomes(Namespace), @project, @note], remote: true, html: { :'data-type' => 'json', multipart: true, id: nil, class: "new-note js-new-note-form js-quick-submit common-note-form", "data-noteable-iid" => @note.noteable.try(:iid), }, authenticity_token: true do |f|
-  = hidden_field_tag :view, diff_view
-  = hidden_field_tag :line_type
-  = hidden_field_tag :merge_request_diff_head_sha, @note.noteable.try(:diff_head_sha)
-  = note_target_fields(@note)
-  = f.hidden_field :commit_id
-  = f.hidden_field :line_code
-  = f.hidden_field :noteable_id
-  = f.hidden_field :noteable_type
-  = f.hidden_field :type
-  = f.hidden_field :position
-
-  = render layout: 'projects/md_preview', locals: { preview_class: "md-preview", referenced_users: true } do
-    = render 'projects/zen', f: f,
-      attr: :note,
-      classes: 'note-textarea js-note-text',
-      placeholder: "Write a comment or drag your files here...",
-      supports_slash_commands: supports_slash_commands
-    = render 'projects/notes/hints', supports_slash_commands: supports_slash_commands
-    .error-alert
-
-  .note-form-actions.clearfix
-    = f.submit 'Comment', class: "btn btn-nr btn-create append-right-10 comment-btn js-comment-button"
-    = yield(:note_actions)
-    %a.btn.btn-cancel.js-note-discard{ role: "button", data: {cancel_text: "Cancel" } }
-      Discard draft
diff --git a/app/views/projects/notes/_hints.html.haml b/app/views/projects/notes/_hints.html.haml
deleted file mode 100644
index 81d97eabe65..00000000000
--- a/app/views/projects/notes/_hints.html.haml
+++ /dev/null
@@ -1,14 +0,0 @@
-- supports_slash_commands = local_assigns.fetch(:supports_slash_commands, false)
-.comment-toolbar.clearfix
-  .toolbar-text
-    = link_to 'Markdown', help_page_path('user/markdown'), target: '_blank', tabindex: -1
-    - if supports_slash_commands
-      and
-      = link_to 'slash commands', help_page_path('user/project/slash_commands'), target: '_blank', tabindex: -1
-      are
-    - else
-      is
-    supported
-  %button.toolbar-button.markdown-selector{ type: 'button', tabindex: '-1' }
-    = icon('file-image-o', class: 'toolbar-button-icon')
-    Attach a file
diff --git a/app/views/projects/notes/_note.html.haml b/app/views/projects/notes/_note.html.haml
deleted file mode 100644
index 6c0e6d48d6c..00000000000
--- a/app/views/projects/notes/_note.html.haml
+++ /dev/null
@@ -1,95 +0,0 @@
-- return unless note.author
-- return if note.cross_reference_not_visible_for?(current_user)
-
-- note_editable = note_editable?(note)
-%li.timeline-entry{ id: dom_id(note), class: ["note", "note-row-#{note.id}", ('system-note' if note.system)], data: {author_id: note.author.id, editable: note_editable, note_id: note.id} }
-  .timeline-entry-inner
-    .timeline-icon
-      %a{ href: user_path(note.author) }
-        = image_tag avatar_icon(note.author), alt: '', class: 'avatar s40'
-    .timeline-content
-      .note-header
-        %a.visible-xs{ href: user_path(note.author) }
-          = note.author.to_reference
-        = link_to_member(note.project, note.author, avatar: false, extra_class: 'hidden-xs')
-        .note-headline-light
-          %span.hidden-xs
-            = note.author.to_reference
-          - unless note.system
-            commented
-          - if note.system
-            %span.system-note-message
-              = note.redacted_note_html
-          %a{ href: "##{dom_id(note)}" }
-            = time_ago_with_tooltip(note.created_at, placement: 'bottom', html_class: 'note-created-ago')
-        - unless note.system?
-          .note-actions
-            - access = note_max_access_for_user(note)
-            - if access
-              %span.note-role= access
-
-            - if note.resolvable?
-              - can_resolve = can?(current_user, :resolve_note, note)
-              %resolve-btn{ "project-path" => project_path(note.project),
-                  "discussion-id" => note.discussion_id,
-                  ":note-id" => note.id,
-                  ":resolved" => note.resolved?,
-                  ":can-resolve" => can_resolve,
-                  ":author-name" => "'#{j(note.author.name)}'",
-                  "author-avatar" => note.author.avatar_url,
-                  ":note-truncated" => "'#{j(truncate(note.note, length: 17))}'",
-                  ":resolved-by" => "'#{j(note.resolved_by.try(:name))}'",
-                  "v-show" => "#{can_resolve || note.resolved?}",
-                  "inline-template" => true,
-                  "ref" => "note_#{note.id}" }
-
-                %button.note-action-button.line-resolve-btn{ type: "button",
-                    class: ("is-disabled" unless can_resolve),
-                    ":class" => "{ 'is-active': isResolved }",
-                    ":aria-label" => "buttonText",
-                    "@click" => "resolve",
-                    ":title" => "buttonText",
-                    "v-show" => "!loading",
-                    ":ref" => "'button'" }
-                  = icon("spin spinner", "v-show" => "loading")
-
-                  = render "shared/icons/icon_status_success.svg"
-
-            - if current_user
-              - if note.emoji_awardable?
-                = link_to '#', title: 'Award Emoji', class: 'note-action-button note-emoji-button js-add-award js-note-emoji', data: { position: 'right' } do
-                  = icon('spinner spin')
-                  = icon('smile-o', class: 'link-highlight')
-
-              - if note_editable
-                = link_to '#', title: 'Edit comment', class: 'note-action-button js-note-edit' do
-                  = icon('pencil', class: 'link-highlight')
-                = link_to namespace_project_note_path(note.project.namespace, note.project, note), title: 'Remove comment', method: :delete, data: { confirm: 'Are you sure you want to remove this comment?' }, remote: true, class: 'note-action-button js-note-delete danger' do
-                  = icon('trash-o', class: 'danger-highlight')
-      .note-body{ class: note_editable ? 'js-task-list-container' : '' }
-        .note-text.md
-          = preserve do
-            = note.redacted_note_html
-        = edited_time_ago_with_tooltip(note, placement: 'bottom', html_class: 'note_edited_ago', include_author: true)
-        - if note_editable
-          .original-note-content.hidden{ data: { post_url: namespace_project_note_path(@project.namespace, @project, note), target_id: note.noteable.id, target_type: note.noteable.class.name.underscore } }
-            #{note.note}
-          %textarea.hidden.js-task-list-field.original-task-list{ data: {update_url: namespace_project_note_path(@project.namespace, @project, note) } }= note.note
-        .note-awards
-          = render 'award_emoji/awards_block', awardable: note, inline: false
-        - if note.system
-          .system-note-commit-list-toggler
-            Toggle commit list
-            %i.fa.fa-angle-down
-      - if note.attachment.url
-        .note-attachment
-          - if note.attachment.image?
-            = link_to note.attachment.url, target: '_blank' do
-              = image_tag note.attachment.url, class: 'note-image-attach'
-          .attachment
-            = link_to note.attachment.url, target: '_blank' do
-              = icon('paperclip')
-              = note.attachment_identifier
-              = link_to delete_attachment_namespace_project_note_path(note.project.namespace, note.project, note),
-                title: 'Delete this attachment', method: :delete, remote: true, data: { confirm: 'Are you sure you want to remove the attachment?' }, class: 'danger js-note-attachment-delete' do
-                = icon('trash-o', class: 'cred')
diff --git a/app/views/projects/notes/_notes.html.haml b/app/views/projects/notes/_notes.html.haml
deleted file mode 100644
index 022578bd6db..00000000000
--- a/app/views/projects/notes/_notes.html.haml
+++ /dev/null
@@ -1,8 +0,0 @@
-- if @discussions.present?
-  - @discussions.each do |discussion|
-    - if discussion.for_target?(@noteable)
-      = render partial: "projects/notes/note", object: discussion.first_note, as: :note
-    - else
-      = render 'discussions/discussion', discussion: discussion
-- else
-  = render partial: "projects/notes/note", collection: @notes, as: :note
diff --git a/app/views/projects/notes/_notes_with_form.html.haml b/app/views/projects/notes/_notes_with_form.html.haml
deleted file mode 100644
index 90a150aa74c..00000000000
--- a/app/views/projects/notes/_notes_with_form.html.haml
+++ /dev/null
@@ -1,26 +0,0 @@
-%ul#notes-list.notes.main-notes-list.timeline
-  = render "projects/notes/notes"
-
-= render 'projects/notes/edit_form'
-
-%ul.notes.notes-form.timeline
-  %li.timeline-entry
-    .flash-container.timeline-content
-
-    - if can? current_user, :create_note, @project
-      .timeline-icon.hidden-xs.hidden-sm
-        %a.author_link{ href: user_path(current_user) }
-          = image_tag avatar_icon(current_user), alt: current_user.to_reference, class: 'avatar s40'
-      .timeline-content.timeline-content-form
-        = render "projects/notes/form", view: diff_view
-    - elsif !current_user
-      .disabled-comment.text-center
-        .disabled-comment-text.inline
-          Please
-          = link_to "register", new_session_path(:user, redirect_to_referer: 'yes')
-          or
-          = link_to "sign in", new_session_path(:user, redirect_to_referer: 'yes')
-          to post a comment
-
-:javascript
-  var notes = new Notes("#{namespace_project_noteable_notes_path(namespace_id: @project.namespace, project_id: @project, target_id: @noteable.id, target_type: @noteable.class.name.underscore)}", #{@notes.map(&:id).to_json}, #{Time.now.to_i}, "#{diff_view}")
diff --git a/app/views/projects/pages/_disabled.html.haml b/app/views/projects/pages/_disabled.html.haml
deleted file mode 100644
index ad51fbc6cab..00000000000
--- a/app/views/projects/pages/_disabled.html.haml
+++ /dev/null
@@ -1,4 +0,0 @@
-.panel.panel-default
-  .nothing-here-block
-    GitLab Pages are disabled.
-    Ask your system's administrator to enable it.
diff --git a/app/views/projects/pages/show.html.haml b/app/views/projects/pages/show.html.haml
index 259d5bd63d6..b22a54d75c8 100644
--- a/app/views/projects/pages/show.html.haml
+++ b/app/views/projects/pages/show.html.haml
@@ -16,13 +16,10 @@
 
 %hr.clearfix
 
-- if Gitlab.config.pages.enabled
-  = render 'access'
-  = render 'use'
-  - if Gitlab.config.pages.external_http || Gitlab.config.pages.external_https
-    = render 'list'
-  - else
-    = render 'no_domains'
-  = render 'destroy'
+= render 'access'
+= render 'use'
+- if Gitlab.config.pages.external_http || Gitlab.config.pages.external_https
+  = render 'list'
 - else
-  = render 'disabled'
+  = render 'no_domains'
+= render 'destroy'
diff --git a/app/views/projects/pipeline_schedules/_form.html.haml b/app/views/projects/pipeline_schedules/_form.html.haml
new file mode 100644
index 00000000000..bbed10039af
--- /dev/null
+++ b/app/views/projects/pipeline_schedules/_form.html.haml
@@ -0,0 +1,33 @@
+- content_for :page_specific_javascripts do
+  = webpack_bundle_tag 'common_vue'
+  = webpack_bundle_tag 'schedule_form'
+
+= form_for [@project.namespace.becomes(Namespace), @project, @schedule], as: :schedule, html: { id: "new-pipeline-schedule-form", class: "form-horizontal js-pipeline-schedule-form" } do |f|
+  = form_errors(@schedule)
+  .form-group
+    .col-md-9
+      = f.label :description, 'Description', class: 'label-light'
+      = f.text_field :description, class: 'form-control', required: true, autofocus: true, placeholder: 'Provide a short description for this pipeline'
+  .form-group
+    .col-md-9
+      = f.label :cron, 'Interval Pattern', class: 'label-light'
+      #interval-pattern-input{ data: { initial_interval: @schedule.cron } }
+  .form-group
+    .col-md-9
+      = f.label :cron_timezone, 'Cron Timezone', class: 'label-light'
+      = dropdown_tag("Select a timezone", options: { toggle_class: 'btn js-timezone-dropdown', title: "Select a timezone", filter: true, placeholder: "Filter", data: { data: timezone_data } } )
+      = f.text_field :cron_timezone, value: @schedule.cron_timezone, id: 'schedule_cron_timezone', class: 'hidden', name: 'schedule[cron_timezone]', required: true
+  .form-group
+    .col-md-9
+      = f.label :ref, 'Target Branch', class: 'label-light'
+      = dropdown_tag("Select target branch", options: { toggle_class: 'btn js-target-branch-dropdown git-revision-dropdown-toggle', dropdown_class: 'git-revision-dropdown', title: "Select target branch", filter: true, placeholder: "Filter", data: { data: @project.repository.branch_names, default_branch: @project.default_branch } } )
+      = f.text_field :ref, value: @schedule.ref, id: 'schedule_ref', class: 'hidden', name: 'schedule[ref]', required: true
+  .form-group
+    .col-md-9
+      = f.label  :active, 'Activated', class: 'label-light'
+      %div
+        = f.check_box :active, required: false, value: @schedule.active?
+        Active
+  .footer-block.row-content-block
+    = f.submit 'Save pipeline schedule', class: 'btn btn-create', tabindex: 3
+    = link_to 'Cancel', pipeline_schedules_path(@project), class: 'btn btn-cancel'
diff --git a/app/views/projects/pipeline_schedules/_pipeline_schedule.html.haml b/app/views/projects/pipeline_schedules/_pipeline_schedule.html.haml
new file mode 100644
index 00000000000..2cd82e1b661
--- /dev/null
+++ b/app/views/projects/pipeline_schedules/_pipeline_schedule.html.haml
@@ -0,0 +1,36 @@
+- if pipeline_schedule
+  %tr.pipeline-schedule-table-row
+    %td
+      = pipeline_schedule.description
+    %td.branch-name-cell
+      = icon('code-fork')
+      = link_to pipeline_schedule.ref, project_ref_path(@project, pipeline_schedule.ref), class: "ref-name"
+    %td
+      - if pipeline_schedule.last_pipeline
+        .status-icon-container{ class: "ci-status-icon-#{pipeline_schedule.last_pipeline.status}" }
+          = link_to namespace_project_pipeline_path(@project.namespace, @project, pipeline_schedule.last_pipeline.id) do
+            = ci_icon_for_status(pipeline_schedule.last_pipeline.status)
+            %span ##{pipeline_schedule.last_pipeline.id}
+      - else
+        None
+    %td.next-run-cell
+      - if pipeline_schedule.active?
+        = time_ago_with_tooltip(pipeline_schedule.next_run_at)
+      - else
+        Inactive
+    %td
+      - if pipeline_schedule.owner
+        = image_tag avatar_icon(pipeline_schedule.owner, 20), class: "avatar s20"
+        = link_to user_path(pipeline_schedule.owner) do
+          = pipeline_schedule.owner&.name
+    %td
+      .pull-right.btn-group
+        - if can?(current_user, :update_pipeline_schedule, @project) && !pipeline_schedule.owned_by?(current_user)
+          = link_to take_ownership_pipeline_schedule_path(pipeline_schedule), method: :post, title: 'Take Ownership', class: 'btn' do
+            Take ownership
+        - if can?(current_user, :update_pipeline_schedule, pipeline_schedule)
+          = link_to edit_pipeline_schedule_path(pipeline_schedule), title: 'Edit', class: 'btn' do
+            = icon('pencil')
+        - if can?(current_user, :admin_pipeline_schedule, pipeline_schedule)
+          = link_to pipeline_schedule_path(pipeline_schedule), title: 'Delete', method: :delete, class: 'btn btn-remove', data: { confirm: "Are you sure you want to cancel this pipeline?" } do
+            = icon('trash')
diff --git a/app/views/projects/pipeline_schedules/_table.html.haml b/app/views/projects/pipeline_schedules/_table.html.haml
new file mode 100644
index 00000000000..25c7604eb24
--- /dev/null
+++ b/app/views/projects/pipeline_schedules/_table.html.haml
@@ -0,0 +1,12 @@
+.table-holder
+  %table.table.ci-table
+    %thead
+      %tr
+        %th Description
+        %th Target
+        %th Last Pipeline
+        %th Next Run
+        %th Owner
+        %th
+
+    = render partial: "pipeline_schedule", collection: @schedules
diff --git a/app/views/projects/pipeline_schedules/_tabs.html.haml b/app/views/projects/pipeline_schedules/_tabs.html.haml
new file mode 100644
index 00000000000..2a1fb16876a
--- /dev/null
+++ b/app/views/projects/pipeline_schedules/_tabs.html.haml
@@ -0,0 +1,18 @@
+%ul.nav-links
+  %li{ class: active_when(scope.nil?) }>
+    = link_to schedule_path_proc.call(nil) do
+      All
+      %span.badge.js-totalbuilds-count
+        = number_with_delimiter(all_schedules.count(:id))
+
+  %li{ class: active_when(scope == 'active') }>
+    = link_to schedule_path_proc.call('active') do
+      Active
+      %span.badge
+        = number_with_delimiter(all_schedules.active.count(:id))
+
+  %li{ class: active_when(scope == 'inactive') }>
+    = link_to schedule_path_proc.call('inactive') do
+      Inactive
+      %span.badge
+        = number_with_delimiter(all_schedules.inactive.count(:id))
diff --git a/app/views/projects/pipeline_schedules/edit.html.haml b/app/views/projects/pipeline_schedules/edit.html.haml
new file mode 100644
index 00000000000..e16fe0b7a98
--- /dev/null
+++ b/app/views/projects/pipeline_schedules/edit.html.haml
@@ -0,0 +1,7 @@
+- page_title "Edit", @schedule.description, "Pipeline Schedule"
+
+%h3.page-title
+  Edit Pipeline Schedule #{@schedule.id}
+%hr
+
+= render "form"
diff --git a/app/views/projects/pipeline_schedules/index.html.haml b/app/views/projects/pipeline_schedules/index.html.haml
new file mode 100644
index 00000000000..6751efaaf2f
--- /dev/null
+++ b/app/views/projects/pipeline_schedules/index.html.haml
@@ -0,0 +1,24 @@
+- content_for :page_specific_javascripts do
+  = webpack_bundle_tag 'common_vue'
+  = webpack_bundle_tag 'schedules_index'
+
+- @no_container = true
+- page_title "Pipeline Schedules"
+= render "projects/pipelines/head"
+
+%div{ class: container_class }
+  #pipeline-schedules-callout{ data: { docs_url: help_page_path('user/project/pipelines/schedules') } }
+  .top-area
+    - schedule_path_proc = ->(scope) { pipeline_schedules_path(@project, scope: scope) }
+    = render "tabs", schedule_path_proc: schedule_path_proc, all_schedules: @all_schedules, scope: @scope
+
+    .nav-controls
+      = link_to new_namespace_project_pipeline_schedule_path(@project.namespace, @project), class: 'btn btn-create' do
+        %span New schedule
+
+  - if @schedules.present?
+    %ul.content-list
+      = render partial: "table"
+  - else
+    .light-well
+      .nothing-here-block No schedules
diff --git a/app/views/projects/pipeline_schedules/new.html.haml b/app/views/projects/pipeline_schedules/new.html.haml
new file mode 100644
index 00000000000..b89e170ad3c
--- /dev/null
+++ b/app/views/projects/pipeline_schedules/new.html.haml
@@ -0,0 +1,7 @@
+- page_title "New Pipeline Schedule"
+
+%h3.page-title
+  Schedule a new pipeline
+%hr
+
+= render "form"
diff --git a/app/views/projects/pipelines/_graph.html.haml b/app/views/projects/pipelines/_graph.html.haml
deleted file mode 100644
index 0202833c0bf..00000000000
--- a/app/views/projects/pipelines/_graph.html.haml
+++ /dev/null
@@ -1,4 +0,0 @@
-- pipeline = local_assigns.fetch(:pipeline)
-.pipeline-visualization.pipeline-graph
-  %ul.stage-column-list
-    = render partial: "projects/stage/graph", collection: pipeline.stages, as: :stage
diff --git a/app/views/projects/pipelines/_head.html.haml b/app/views/projects/pipelines/_head.html.haml
index bc57f7f1c46..db9d77dba16 100644
--- a/app/views/projects/pipelines/_head.html.haml
+++ b/app/views/projects/pipelines/_head.html.haml
@@ -4,17 +4,23 @@
     .nav-links.sub-nav.scrolling-tabs
       %ul{ class: (container_class) }
         - if project_nav_tab? :pipelines
-          = nav_link(path: 'pipelines#index', controller: :pipelines) do
+          = nav_link(path: ['pipelines#index', 'pipelines#show']) do
             = link_to project_pipelines_path(@project), title: 'Pipelines', class: 'shortcuts-pipelines' do
               %span
                 Pipelines
 
         - if project_nav_tab? :builds
-          = nav_link(controller: :builds) do
+          = nav_link(controller: [:builds, :artifacts]) do
             = link_to project_builds_path(@project), title: 'Jobs', class: 'shortcuts-builds' do
               %span
                 Jobs
 
+        - if project_nav_tab? :pipelines
+          = nav_link(controller: :pipeline_schedules) do
+            = link_to pipeline_schedules_path(@project), title: 'Schedules', class: 'shortcuts-builds' do
+              %span
+                Schedules
+
         - if project_nav_tab? :environments
           = nav_link(controller: :environments) do
             = link_to project_environments_path(@project), title: 'Environments', class: 'shortcuts-environments' do
diff --git a/app/views/projects/pipelines/_info.html.haml b/app/views/projects/pipelines/_info.html.haml
index 4be9a1371ec..8607da8fcdd 100644
--- a/app/views/projects/pipelines/_info.html.haml
+++ b/app/views/projects/pipelines/_info.html.haml
@@ -1,6 +1,6 @@
 .page-content-header
   .header-main-content
-    = render 'ci/status/badge', status: @pipeline.detailed_status(current_user)
+    = render 'ci/status/badge', status: @pipeline.detailed_status(current_user), title: @pipeline.status_title
     %strong Pipeline ##{@pipeline.id}
     triggered #{time_ago_with_tooltip(@pipeline.created_at)}
     - if @pipeline.user
@@ -30,7 +30,7 @@
       = pluralize @pipeline.statuses.count(:id), "job"
       - if @pipeline.ref
         from
-        = link_to @pipeline.ref, namespace_project_commits_path(@project.namespace, @project, @pipeline.ref), class: "monospace"
+        = link_to @pipeline.ref, project_ref_path(@project, @pipeline.ref), class: "ref-name"
       - if @pipeline.duration
         in
         = time_interval_in_words(@pipeline.duration)
@@ -40,10 +40,10 @@
   .well-segment.branch-info
     .icon-container.commit-icon
       = custom_icon("icon_commit")
-    = link_to @commit.short_id, namespace_project_commit_path(@project.namespace, @project, @pipeline.sha), class: "monospace js-details-short"
+    = link_to @commit.short_id, namespace_project_commit_path(@project.namespace, @project, @pipeline.sha), class: "commit-sha js-details-short"
     = link_to("#", class: "js-details-expand hidden-xs hidden-sm") do
       %span.text-expander
         \...
     %span.js-details-content.hide
-      = link_to @pipeline.sha, namespace_project_commit_path(@project.namespace, @project, @pipeline.sha), class: "monospace commit-hash-full"
-    = clipboard_button(clipboard_text: @pipeline.sha, title: "Copy commit SHA to clipboard")
+      = link_to @pipeline.sha, namespace_project_commit_path(@project.namespace, @project, @pipeline.sha), class: "commit-sha commit-hash-full"
+    = clipboard_button(text: @pipeline.sha, title: "Copy commit SHA to clipboard")
diff --git a/app/views/projects/pipelines/_with_tabs.html.haml b/app/views/projects/pipelines/_with_tabs.html.haml
index 53067cdcba4..075ddc0025c 100644
--- a/app/views/projects/pipelines/_with_tabs.html.haml
+++ b/app/views/projects/pipelines/_with_tabs.html.haml
@@ -1,3 +1,9 @@
+- failed_builds = @pipeline.statuses.latest.failed
+
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
+  = page_specific_javascript_bundle_tag('pipelines_graph')
+
 .tabs-holder
   %ul.pipelines-tabs.nav-links.no-top.no-bottom
     %li.js-pipeline-tab-link
@@ -7,13 +13,15 @@
       = link_to builds_namespace_project_pipeline_path(@project.namespace, @project, @pipeline), data: {target: 'div#js-tab-builds', action: 'builds', toggle: 'tab' }, class: 'builds-tab' do
         Jobs
         %span.badge.js-builds-counter= pipeline.statuses.count
-
-
+    - if failed_builds.present?
+      %li.js-failures-tab-link
+        = link_to failures_namespace_project_pipeline_path(@project.namespace, @project, @pipeline), data: {target: 'div#js-tab-failures', action: 'failures', toggle: 'tab' }, class: 'failures-tab' do
+          Failed Jobs
+          %span.badge.js-failures-counter= failed_builds.count
 
 .tab-content
   #js-tab-pipeline.tab-pane
-    .build-content.middle-block.js-pipeline-graph
-      = render "projects/pipelines/graph", pipeline: pipeline
+    #js-pipeline-graph-vue{ data: { endpoint: namespace_project_pipeline_path(@project.namespace, @project, @pipeline, format: :json) } }
 
   #js-tab-builds.tab-pane
     - if pipeline.yaml_errors.present?
@@ -36,7 +44,16 @@
             %th Job ID
             %th Name
             %th
-            - if pipeline.project.build_coverage_enabled?
-              %th Coverage
+            %th Coverage
             %th
         = render partial: "projects/stage/stage", collection: pipeline.stages, as: :stage
+  - if failed_builds.present?
+    #js-tab-failures.build-failures.tab-pane
+      - failed_builds.each_with_index do |build, index|
+        .build-state
+          %span.ci-status-icon-failed= custom_icon('icon_status_failed')
+          %span.stage
+            = build.stage.titleize
+          %span.build-name
+            = link_to build.name, pipeline_build_url(pipeline, build)
+        %pre.build-log= build_summary(build, skip: index >= 10)
diff --git a/app/views/projects/pipelines/index.html.haml b/app/views/projects/pipelines/index.html.haml
index 3d73284699f..38237d2d97d 100644
--- a/app/views/projects/pipelines/index.html.haml
+++ b/app/views/projects/pipelines/index.html.haml
@@ -17,4 +17,4 @@
   "ci-lint-path" => ci_lint_path } }
 
 = page_specific_javascript_bundle_tag('common_vue')
-= page_specific_javascript_bundle_tag('vue_pipelines')
+= page_specific_javascript_bundle_tag('pipelines')
diff --git a/app/views/projects/pipelines/new.html.haml b/app/views/projects/pipelines/new.html.haml
index 14a270a3039..71a8e490c3e 100644
--- a/app/views/projects/pipelines/new.html.haml
+++ b/app/views/projects/pipelines/new.html.haml
@@ -11,8 +11,8 @@
     .col-sm-10
       = hidden_field_tag 'pipeline[ref]', params[:ref] || @project.default_branch
       = dropdown_tag(params[:ref] || @project.default_branch,
-                     options: { toggle_class: 'js-branch-select wide',
-                                filter: true, dropdown_class: "dropdown-menu-selectable", placeholder: "Search branches",
+                     options: { toggle_class: 'js-branch-select wide git-revision-dropdown-toggle',
+                                filter: true, dropdown_class: "dropdown-menu-selectable git-revision-dropdown", placeholder: "Search branches",
                                 data: { selected: params[:ref] || @project.default_branch, field_name: 'pipeline[ref]' } })
       .help-block Existing branch name, tag
   .form-actions
diff --git a/app/views/projects/pipelines_settings/_show.html.haml b/app/views/projects/pipelines_settings/_show.html.haml
index 132f6372e40..1b1910b5c0f 100644
--- a/app/views/projects/pipelines_settings/_show.html.haml
+++ b/app/views/projects/pipelines_settings/_show.html.haml
@@ -1,14 +1,14 @@
 .row.prepend-top-default
   .col-lg-3.profile-settings-sidebar
     %h4.prepend-top-0
-      CI/CD Pipelines
+      Pipelines
   .col-lg-9
     = form_for @project, url: namespace_project_pipelines_settings_path(@project.namespace.becomes(Namespace), @project) do |f|
       %fieldset.builds-feature
         - unless @repository.gitlab_ci_yml
           .form-group
             %p Pipelines need to be configured before you can begin using Continuous Integration.
-            = link_to 'Get started with CI/CD Pipelines', help_page_path('ci/quick_start/README'), class: 'btn btn-info'
+            = link_to 'Get started with Pipelines', help_page_path('ci/quick_start/README'), class: 'btn btn-info'
             %hr
         .form-group.append-bottom-default
           = f.label :runners_token, "Runner token", class: 'label-light'
@@ -21,7 +21,7 @@
             Git strategy for pipelines
           %p
             Choose between <code>clone</code> or <code>fetch</code> to get the recent application code
-            = link_to icon('question-circle'), help_page_path('user/project/pipelines/settings', anchor: 'git-strategy')
+            = link_to icon('question-circle'), help_page_path('user/project/pipelines/settings', anchor: 'git-strategy'), target: '_blank'
           .radio
             = f.label :build_allow_git_fetch_false do
               = f.radio_button :build_allow_git_fetch, 'false'
@@ -43,7 +43,7 @@
           = f.number_field :build_timeout_in_minutes, class: 'form-control', min: '0'
           %p.help-block
             Per job in minutes. If a job passes this threshold, it will be marked as failed.
-            = link_to icon('question-circle'), help_page_path('user/project/pipelines/settings', anchor: 'timeout')
+            = link_to icon('question-circle'), help_page_path('user/project/pipelines/settings', anchor: 'timeout'), target: '_blank'
 
         %hr
         .form-group
@@ -53,7 +53,16 @@
               %strong Public pipelines
             .help-block
               Allow everyone to access pipelines for public and internal projects
-              = link_to icon('question-circle'), help_page_path('user/project/pipelines/settings', anchor: 'visibility-of-pipelines')
+              = link_to icon('question-circle'), help_page_path('user/project/pipelines/settings', anchor: 'visibility-of-pipelines'), target: '_blank'
+        %hr
+        .form-group
+          .checkbox
+            = f.label :auto_cancel_pending_pipelines do
+              = f.check_box :auto_cancel_pending_pipelines, {}, 'enabled', 'disabled'
+              %strong Auto-cancel redundant, pending pipelines
+            .help-block
+              New pipelines will cancel older, pending pipelines on the same branch
+              = link_to icon('question-circle'), help_page_path('user/project/pipelines/settings', anchor: 'auto-cancel-pending-pipelines'), target: '_blank'
 
         %hr
         .form-group
@@ -65,7 +74,7 @@
           %p.help-block
             A regular expression that will be used to find the test coverage
             output in the job trace. Leave blank to disable
-            = link_to icon('question-circle'), help_page_path('user/project/pipelines/settings', anchor: 'test-coverage-parsing')
+            = link_to icon('question-circle'), help_page_path('user/project/pipelines/settings', anchor: 'test-coverage-parsing'), target: '_blank'
           .bs-callout.bs-callout-info
             %p Below are examples of regex for existing tools:
             %ul
diff --git a/app/views/projects/project_members/_index.html.haml b/app/views/projects/project_members/_index.html.haml
index ab0771b5751..d080b6c83d4 100644
--- a/app/views/projects/project_members/_index.html.haml
+++ b/app/views/projects/project_members/_index.html.haml
@@ -6,13 +6,19 @@
       %p
         Add a new member to
         %strong= @project.name
+    - else
+      %p
+        Members can be added by project
+        %i Masters
+        or
+        %i Owners
   .col-lg-9
     .light.prepend-top-default
       - if can?(current_user, :admin_project_member, @project)
         = render "projects/project_members/new_project_member"
 
         = render 'shared/members/requests', membership_source: @project, requesters: @requesters
-        .append-bottom-default.clearfix
+        .clearfix
           %h5.member.existing-title
             Existing members and groups
         - if @group_links.any?
diff --git a/app/views/projects/project_members/_team.html.haml b/app/views/projects/project_members/_team.html.haml
index 81d57c77edf..7b1a26043e1 100644
--- a/app/views/projects/project_members/_team.html.haml
+++ b/app/views/projects/project_members/_team.html.haml
@@ -1,9 +1,11 @@
 .panel.panel-default
-  .panel-heading
-    Members with access to
-    %strong= @project.name
+  .panel-heading.flex-project-members-panel
+    %span.flex-project-title
+      Members of
+      %strong
+        #{@project.name}
     %span.badge= @project_members.total_count
-    = form_tag namespace_project_settings_members_path(@project.namespace, @project), method: :get, class: 'form-inline member-search-form'  do
+    = form_tag namespace_project_settings_members_path(@project.namespace, @project), method: :get, class: 'form-inline member-search-form flex-project-members-form'  do
       .form-group
         = search_field_tag :search, params[:search], { placeholder: 'Find existing members by name', class: 'form-control', spellcheck: false }
         %button.member-search-btn{ type: "submit", "aria-label" => "Submit search" }
diff --git a/app/views/projects/protected_branches/_create_protected_branch.html.haml b/app/views/projects/protected_branches/_create_protected_branch.html.haml
index b8e885b4d9a..99bc2516366 100644
--- a/app/views/projects/protected_branches/_create_protected_branch.html.haml
+++ b/app/views/projects/protected_branches/_create_protected_branch.html.haml
@@ -25,7 +25,7 @@
             .merge_access_levels-container
               = dropdown_tag('Select',
                              options: { toggle_class: 'js-allowed-to-merge wide',
-                             dropdown_class: 'dropdown-menu-selectable',
+                             dropdown_class: 'dropdown-menu-selectable capitalize-header',
                              data: { field_name: 'protected_branch[merge_access_levels_attributes][0][access_level]', input_id: 'merge_access_levels_attributes' }})
         .form-group
           %label.col-md-2.text-right{ for: 'push_access_levels_attributes' }
@@ -34,7 +34,7 @@
             .push_access_levels-container
               = dropdown_tag('Select',
                              options: { toggle_class: 'js-allowed-to-push wide',
-                             dropdown_class: 'dropdown-menu-selectable',
+                             dropdown_class: 'dropdown-menu-selectable capitalize-header',
                              data: { field_name: 'protected_branch[push_access_levels_attributes][0][access_level]', input_id: 'push_access_levels_attributes' }})
 
     .panel-footer
diff --git a/app/views/projects/protected_branches/_dropdown.html.haml b/app/views/projects/protected_branches/_dropdown.html.haml
index 5af0cc7a2f3..6e9c473494e 100644
--- a/app/views/projects/protected_branches/_dropdown.html.haml
+++ b/app/views/projects/protected_branches/_dropdown.html.haml
@@ -1,8 +1,8 @@
 = f.hidden_field(:name)
 
 = dropdown_tag('Select branch or create wildcard',
-               options: { toggle_class: 'js-protected-branch-select js-filter-submit wide',
-                          filter: true, dropdown_class: "dropdown-menu-selectable", placeholder: "Search protected branches",
+               options: { toggle_class: 'js-protected-branch-select js-filter-submit wide git-revision-dropdown-toggle',
+                          filter: true, dropdown_class: "dropdown-menu-selectable git-revision-dropdown", placeholder: "Search protected branches",
                           footer_content: true,
                           data: { show_no: true, show_any: true, show_upcoming: true,
                                   selected: params[:protected_branch_name],
diff --git a/app/views/projects/protected_branches/_matching_branch.html.haml b/app/views/projects/protected_branches/_matching_branch.html.haml
index 8a5332ca5bb..27896272733 100644
--- a/app/views/projects/protected_branches/_matching_branch.html.haml
+++ b/app/views/projects/protected_branches/_matching_branch.html.haml
@@ -1,9 +1,10 @@
 %tr
   %td
-    = link_to matching_branch.name, namespace_project_tree_path(@project.namespace, @project, matching_branch.name)
+    = link_to matching_branch.name, project_ref_path(@project, matching_branch.name), class: 'ref-name'
+
     - if @project.root_ref?(matching_branch.name)
       %span.label.label-info.prepend-left-5 default
   %td
     - commit = @project.commit(matching_branch.name)
-    = link_to(commit.short_id, namespace_project_commit_path(@project.namespace, @project, commit.id), class: 'commit_short_id')
+    = link_to(commit.short_id, namespace_project_commit_path(@project.namespace, @project, commit.id), class: 'commit-sha')
     = time_ago_with_tooltip(commit.committed_date)
diff --git a/app/views/projects/protected_branches/_protected_branch.html.haml b/app/views/projects/protected_branches/_protected_branch.html.haml
index b2a6b8469a3..0f80de94392 100644
--- a/app/views/projects/protected_branches/_protected_branch.html.haml
+++ b/app/views/projects/protected_branches/_protected_branch.html.haml
@@ -1,6 +1,7 @@
 %tr.js-protected-branch-edit-form{ data: { url: namespace_project_protected_branch_path(@project.namespace, @project, protected_branch) } }
   %td
-    = protected_branch.name
+    %span.ref-name= protected_branch.name
+
     - if @project.root_ref?(protected_branch.name)
       %span.label.label-info.prepend-left-5 default
   %td
@@ -9,7 +10,7 @@
       = link_to pluralize(matching_branches.count, "matching branch"), namespace_project_protected_branch_path(@project.namespace, @project, protected_branch)
     - else
       - if commit = protected_branch.commit
-        = link_to(commit.short_id, namespace_project_commit_path(@project.namespace, @project, commit.id), class: 'commit_short_id')
+        = link_to(commit.short_id, namespace_project_commit_path(@project.namespace, @project, commit.id), class: 'commit-sha')
         = time_ago_with_tooltip(commit.committed_date)
       - else
         (branch was removed from repository)
diff --git a/app/views/projects/protected_branches/_update_protected_branch.html.haml b/app/views/projects/protected_branches/_update_protected_branch.html.haml
index d6044aacaec..c61b2951e1e 100644
--- a/app/views/projects/protected_branches/_update_protected_branch.html.haml
+++ b/app/views/projects/protected_branches/_update_protected_branch.html.haml
@@ -1,10 +1,10 @@
 %td
   = hidden_field_tag "allowed_to_merge_#{protected_branch.id}", protected_branch.merge_access_levels.first.access_level
   = dropdown_tag( (protected_branch.merge_access_levels.first.humanize || 'Select') ,
-                 options: { toggle_class: 'js-allowed-to-merge', dropdown_class: 'dropdown-menu-selectable js-allowed-to-merge-container',
+                 options: { toggle_class: 'js-allowed-to-merge', dropdown_class: 'dropdown-menu-selectable js-allowed-to-merge-container capitalize-header',
                  data: { field_name: "allowed_to_merge_#{protected_branch.id}", access_level_id: protected_branch.merge_access_levels.first.id }})
 %td
   = hidden_field_tag "allowed_to_push_#{protected_branch.id}", protected_branch.push_access_levels.first.access_level
   = dropdown_tag( (protected_branch.push_access_levels.first.humanize || 'Select') ,
-                 options: { toggle_class: 'js-allowed-to-push', dropdown_class: 'dropdown-menu-selectable js-allowed-to-push-container',
+                 options: { toggle_class: 'js-allowed-to-push', dropdown_class: 'dropdown-menu-selectable js-allowed-to-push-container capitalize-header',
                  data: { field_name: "allowed_to_push_#{protected_branch.id}", access_level_id: protected_branch.push_access_levels.first.id }})
diff --git a/app/views/projects/protected_branches/show.html.haml b/app/views/projects/protected_branches/show.html.haml
index 4d8169815b3..a806a0756ec 100644
--- a/app/views/projects/protected_branches/show.html.haml
+++ b/app/views/projects/protected_branches/show.html.haml
@@ -1,13 +1,13 @@
-- page_title @protected_branch.name, "Protected Branches"
+- page_title @protected_ref.name, "Protected Branches"
 
 .row.prepend-top-default.append-bottom-default
   .col-lg-3
-    %h4.prepend-top-0
-      = @protected_branch.name
+    %h4.prepend-top-0.ref-name
+      = @protected_ref.name
 
   .col-lg-9
     %h5 Matching Branches
-    - if @matching_branches.present?
+    - if @matching_refs.present?
       .table-responsive
         %table.table.protected-branches-list
           %colgroup
@@ -18,7 +18,7 @@
               %th Branch
               %th Last commit
           %tbody
-            - @matching_branches.each do |matching_branch|
+            - @matching_refs.each do |matching_branch|
               = render partial: "matching_branch", object: matching_branch
     - else
       %p.settings-message.text-center
diff --git a/app/views/projects/protected_tags/_create_protected_tag.html.haml b/app/views/projects/protected_tags/_create_protected_tag.html.haml
new file mode 100644
index 00000000000..af9a080f0a2
--- /dev/null
+++ b/app/views/projects/protected_tags/_create_protected_tag.html.haml
@@ -0,0 +1,32 @@
+= form_for [@project.namespace.becomes(Namespace), @project, @protected_tag], html: { class: 'js-new-protected-tag' } do |f|
+  .panel.panel-default
+    .panel-heading
+      %h3.panel-title
+        Protect a tag
+    .panel-body
+      .form-horizontal
+        = form_errors(@protected_tag)
+        .form-group
+          = f.label :name, class: 'col-md-2 text-right' do
+            Tag:
+          .col-md-10.protected-tags-dropdown
+            = render partial: "projects/protected_tags/dropdown", locals: { f: f }
+            .help-block
+              = link_to 'Wildcards', help_page_path('user/project/protected_tags', anchor: 'wildcard-protected-tags')
+              such as
+              %code v*
+              or
+              %code *-release
+              are supported
+        .form-group
+          %label.col-md-2.text-right{ for: 'create_access_levels_attributes' }
+            Allowed to create:
+          .col-md-10
+            .create_access_levels-container
+              = dropdown_tag('Select',
+                             options: { toggle_class: 'js-allowed-to-create wide',
+                             dropdown_class: 'dropdown-menu-selectable',
+                             data: { field_name: 'protected_tag[create_access_levels_attributes][0][access_level]', input_id: 'create_access_levels_attributes' }})
+
+    .panel-footer
+      = f.submit 'Protect', class: 'btn-create btn', disabled: true
diff --git a/app/views/projects/protected_tags/_dropdown.html.haml b/app/views/projects/protected_tags/_dropdown.html.haml
new file mode 100644
index 00000000000..c8531f96f97
--- /dev/null
+++ b/app/views/projects/protected_tags/_dropdown.html.haml
@@ -0,0 +1,15 @@
+= f.hidden_field(:name)
+
+= dropdown_tag('Select tag or create wildcard',
+               options: { toggle_class: 'js-protected-tag-select js-filter-submit wide git-revision-dropdown-toggle',
+                          filter: true, dropdown_class: "dropdown-menu-selectable capitalize-header git-revision-dropdown", placeholder: "Search protected tag",
+                          footer_content: true,
+                          data: { show_no: true, show_any: true, show_upcoming: true,
+                                  selected: params[:protected_tag_name],
+                                  project_id: @project.try(:id) } }) do
+
+  %ul.dropdown-footer-list
+    %li
+      = link_to '#', title: "New Protected Tag", class: "create-new-protected-tag" do
+        Create wildcard
+        %code
diff --git a/app/views/projects/protected_tags/_index.html.haml b/app/views/projects/protected_tags/_index.html.haml
new file mode 100644
index 00000000000..0bfb1ad191d
--- /dev/null
+++ b/app/views/projects/protected_tags/_index.html.haml
@@ -0,0 +1,18 @@
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('protected_tags')
+
+.row.prepend-top-default.append-bottom-default
+  .col-lg-3
+    %h4.prepend-top-0
+      Protected tags
+    %p.prepend-top-20
+      By default, Protected tags are designed to:
+      %ul
+        %li Prevent tag creation by everybody except Masters
+        %li Prevent <strong>anyone</strong> from updating the tag
+        %li Prevent <strong>anyone</strong> from deleting the tag
+  .col-lg-9
+    - if can? current_user, :admin_project, @project
+      = render 'projects/protected_tags/create_protected_tag'
+
+    = render "projects/protected_tags/tags_list"
diff --git a/app/views/projects/protected_tags/_matching_tag.html.haml b/app/views/projects/protected_tags/_matching_tag.html.haml
new file mode 100644
index 00000000000..f17353df122
--- /dev/null
+++ b/app/views/projects/protected_tags/_matching_tag.html.haml
@@ -0,0 +1,10 @@
+%tr
+  %td
+    = link_to matching_tag.name, project_ref_path(@project, matching_tag.name), class: 'ref-name'
+
+    - if @project.root_ref?(matching_tag.name)
+      %span.label.label-info.prepend-left-5 default
+  %td
+    - commit = @project.commit(matching_tag.name)
+    = link_to(commit.short_id, namespace_project_commit_path(@project.namespace, @project, commit.id), class: 'commit-sha')
+    = time_ago_with_tooltip(commit.committed_date)
diff --git a/app/views/projects/protected_tags/_protected_tag.html.haml b/app/views/projects/protected_tags/_protected_tag.html.haml
new file mode 100644
index 00000000000..54249ec0db1
--- /dev/null
+++ b/app/views/projects/protected_tags/_protected_tag.html.haml
@@ -0,0 +1,22 @@
+%tr.js-protected-tag-edit-form{ data: { url: namespace_project_protected_tag_path(@project.namespace, @project, protected_tag) } }
+  %td
+    %span.ref-name= protected_tag.name
+
+    - if @project.root_ref?(protected_tag.name)
+      %span.label.label-info.prepend-left-5 default
+  %td
+    - if protected_tag.wildcard?
+      - matching_tags = protected_tag.matching(repository.tags)
+      = link_to pluralize(matching_tags.count, "matching tag"), namespace_project_protected_tag_path(@project.namespace, @project, protected_tag)
+    - else
+      - if commit = protected_tag.commit
+        = link_to(commit.short_id, namespace_project_commit_path(@project.namespace, @project, commit.id), class: 'commit-sha')
+        = time_ago_with_tooltip(commit.committed_date)
+      - else
+        (tag was removed from repository)
+
+  = render partial: 'projects/protected_tags/update_protected_tag', locals: { protected_tag: protected_tag }
+
+  - if can_admin_project
+    %td
+      = link_to 'Unprotect', [@project.namespace.becomes(Namespace), @project, protected_tag], data: { confirm: 'tag will be writable for developers. Are you sure?' }, method: :delete, class: 'btn btn-warning'
diff --git a/app/views/projects/protected_tags/_tags_list.html.haml b/app/views/projects/protected_tags/_tags_list.html.haml
new file mode 100644
index 00000000000..728afd75b50
--- /dev/null
+++ b/app/views/projects/protected_tags/_tags_list.html.haml
@@ -0,0 +1,28 @@
+.panel.panel-default.protected-tags-list.js-protected-tags-list
+  - if @protected_tags.empty?
+    .panel-heading
+      %h3.panel-title
+        Protected tag (#{@protected_tags.size})
+    %p.settings-message.text-center
+      There are currently no protected tags, protect a tag with the form above.
+  - else
+    - can_admin_project = can?(current_user, :admin_project, @project)
+
+    %table.table.table-bordered
+      %colgroup
+        %col{ width: "25%" }
+        %col{ width: "25%" }
+        %col{ width: "50%" }
+      %thead
+        %tr
+          %th Protected tag (#{@protected_tags.size})
+          %th Last commit
+          %th Allowed to create
+          - if can_admin_project
+            %th
+      %tbody
+        %tr
+          %td.flash-container{ colspan: 4 }
+        = render partial: 'projects/protected_tags/protected_tag', collection: @protected_tags, locals: { can_admin_project: can_admin_project}
+
+    = paginate @protected_tags, theme: 'gitlab'
diff --git a/app/views/projects/protected_tags/_update_protected_tag.haml b/app/views/projects/protected_tags/_update_protected_tag.haml
new file mode 100644
index 00000000000..cc80bd04dd0
--- /dev/null
+++ b/app/views/projects/protected_tags/_update_protected_tag.haml
@@ -0,0 +1,5 @@
+%td
+  = hidden_field_tag "allowed_to_create_#{protected_tag.id}", protected_tag.create_access_levels.first.access_level
+  = dropdown_tag( (protected_tag.create_access_levels.first.humanize || 'Select') ,
+                 options: { toggle_class: 'js-allowed-to-create', dropdown_class: 'dropdown-menu-selectable capitalize-header js-allowed-to-create-container',
+                 data: { field_name: "allowed_to_create_#{protected_tag.id}", access_level_id: protected_tag.create_access_levels.first.id }})
diff --git a/app/views/projects/protected_tags/show.html.haml b/app/views/projects/protected_tags/show.html.haml
new file mode 100644
index 00000000000..94c3612a449
--- /dev/null
+++ b/app/views/projects/protected_tags/show.html.haml
@@ -0,0 +1,25 @@
+- page_title @protected_ref.name, "Protected Tags"
+
+.row.prepend-top-default.append-bottom-default
+  .col-lg-3
+    %h4.prepend-top-0.ref-name
+      = @protected_ref.name
+
+  .col-lg-9
+    %h5 Matching Tags
+    - if @matching_refs.present?
+      .table-responsive
+        %table.table.protected-tags-list
+          %colgroup
+            %col{ width: "30%" }
+            %col{ width: "30%" }
+          %thead
+            %tr
+              %th Tag
+              %th Last commit
+          %tbody
+            - @matching_refs.each do |matching_tag|
+              = render partial: "matching_tag", object: matching_tag
+    - else
+      %p.settings-message.text-center
+        Couldn't find any matching tags.
diff --git a/app/views/projects/registry/repositories/_image.html.haml b/app/views/projects/registry/repositories/_image.html.haml
new file mode 100644
index 00000000000..8bc78f8d018
--- /dev/null
+++ b/app/views/projects/registry/repositories/_image.html.haml
@@ -0,0 +1,32 @@
+.container-image.js-toggle-container
+  .container-image-head
+    = link_to "#", class: "js-toggle-button" do
+      = icon('chevron-down', 'aria-hidden': 'true')
+      = escape_once(image.path)
+
+    = clipboard_button(clipboard_text: "docker pull #{image.location}")
+
+    .controls.hidden-xs.pull-right
+      = link_to namespace_project_container_registry_path(@project.namespace, @project, image),
+                class: 'btn btn-remove has-tooltip',
+                title: 'Remove repository',
+                data: { confirm: 'Are you sure?' },
+                method: :delete do
+        = icon('trash cred', 'aria-hidden': 'true')
+
+  .container-image-tags.js-toggle-content.hide
+    - if image.has_tags?
+      .table-holder
+        %table.table.tags
+          %thead
+            %tr
+              %th Tag
+              %th Tag ID
+              %th Size
+              %th Created
+              - if can?(current_user, :update_container_image, @project)
+                %th
+          = render partial: 'tag', collection: image.tags
+    - else
+      .nothing-here-block No tags in Container Registry for this container image.
+
diff --git a/app/views/projects/container_registry/_tag.html.haml b/app/views/projects/registry/repositories/_tag.html.haml
index 10822b6184c..378a23f07e6 100644
--- a/app/views/projects/container_registry/_tag.html.haml
+++ b/app/views/projects/registry/repositories/_tag.html.haml
@@ -1,7 +1,7 @@
 %tr.tag
   %td
     = escape_once(tag.name)
-    = clipboard_button(clipboard_text: "docker pull #{tag.path}")
+    = clipboard_button(text: "docker pull #{tag.location}")
   %td
     - if tag.revision
       %span.has-tooltip{ title: "#{tag.revision}" }
@@ -25,5 +25,9 @@
   - if can?(current_user, :update_container_image, @project)
     %td.content
       .controls.hidden-xs.pull-right
-        = link_to namespace_project_container_registry_path(@project.namespace, @project, tag.name), class: 'btn btn-remove has-tooltip', title: "Remove", data: { confirm: "Are you sure?" }, method: :delete do
-          = icon("trash cred")
+        = link_to namespace_project_registry_repository_tag_path(@project.namespace, @project, tag.repository, tag.name),
+                  method: :delete,
+                  class: 'btn btn-remove has-tooltip',
+                  title: 'Remove tag',
+                  data: { confirm: 'Are you sure you want to delete this tag?' } do
+          = icon('trash cred')
diff --git a/app/views/projects/container_registry/index.html.haml b/app/views/projects/registry/repositories/index.html.haml
index 993da27310f..be128e92fa7 100644
--- a/app/views/projects/container_registry/index.html.haml
+++ b/app/views/projects/registry/repositories/index.html.haml
@@ -15,25 +15,12 @@
       %br
       Then you are free to create and upload a container image with build and push commands:
       %pre
-        docker build -t #{escape_once(@project.container_registry_repository_url)} .
+        docker build -t #{escape_once(@project.container_registry_url)}/image .
         %br
-        docker push #{escape_once(@project.container_registry_repository_url)}
+        docker push #{escape_once(@project.container_registry_url)}/image
 
-  - if @tags.blank?
-    %li
-      .nothing-here-block No images in Container Registry for this project.
+  - if @images.blank?
+    .nothing-here-block No container image repositories in Container Registry for this project.
 
   - else
-    .table-holder
-      %table.table.tags
-        %thead
-          %tr
-            %th Name
-            %th Image ID
-            %th Size
-            %th Created
-            - if can?(current_user, :update_container_image, @project)
-              %th
-
-        - @tags.each do |tag|
-          = render 'tag', tag: tag
+    = render partial: 'image', collection: @images
diff --git a/app/views/projects/releases/edit.html.haml b/app/views/projects/releases/edit.html.haml
index 79d8d721aa9..93ee9382a6e 100644
--- a/app/views/projects/releases/edit.html.haml
+++ b/app/views/projects/releases/edit.html.haml
@@ -11,9 +11,9 @@
 
 
   = form_for(@release, method: :put, url: namespace_project_tag_release_path(@project.namespace, @project, @tag.name), html: { class: 'form-horizontal common-note-form release-form js-quick-submit' }) do |f|
-    = render layout: 'projects/md_preview', locals: { preview_class: "md-preview", referenced_users: true } do
+    = render layout: 'projects/md_preview', locals: { url: preview_markdown_path(@project), referenced_users: true } do
       = render 'projects/zen', f: f, attr: :description, classes: 'note-textarea', placeholder: "Write your release notes or drag files here..."
-      = render 'projects/notes/hints'
+      = render 'shared/notes/hints'
     .error-alert
     .prepend-top-default
       = f.submit 'Save changes', class: 'btn btn-save'
diff --git a/app/views/projects/runners/_runner.html.haml b/app/views/projects/runners/_runner.html.haml
index deeadb609f6..674f87e8220 100644
--- a/app/views/projects/runners/_runner.html.haml
+++ b/app/views/projects/runners/_runner.html.haml
@@ -1,15 +1,18 @@
 %li.runner{ id: dom_id(runner) }
   %h4
     = runner_status_icon(runner)
-    %span.monospace
-      - if @project_runners.include?(runner)
-        = link_to runner.short_sha, runner_path(runner)
-        - if runner.locked?
-          = icon('lock', class: 'has-tooltip', title: 'Locked to current projects')
-        %small
-          = link_to edit_namespace_project_runner_path(@project.namespace, @project, runner) do
-            %i.fa.fa-edit.btn
-      - else
+
+    - if @project_runners.include?(runner)
+      = link_to runner.short_sha, runner_path(runner), class: 'commit-sha'
+
+      - if runner.locked?
+        = icon('lock', class: 'has-tooltip', title: 'Locked to current projects')
+
+      %small
+        = link_to edit_namespace_project_runner_path(@project.namespace, @project, runner) do
+          %i.fa.fa-edit.btn
+    - else
+      %span.commit-sha
         = runner.short_sha
 
     .pull-right
diff --git a/app/views/projects/runners/_specific_runners.html.haml b/app/views/projects/runners/_specific_runners.html.haml
index 6b8e6bd4fee..f8835454140 100644
--- a/app/views/projects/runners/_specific_runners.html.haml
+++ b/app/views/projects/runners/_specific_runners.html.haml
@@ -9,7 +9,7 @@
       (checkout the #{link_to 'GitLab Runner section', 'https://about.gitlab.com/gitlab-ci/#gitlab-runner', target: '_blank'} for information on how to install it).
     %li
       Specify the following URL during the Runner setup:
-      %code= ci_root_url(only_path: false)
+      %code= root_url(only_path: false)
     %li
       Use the following registration token during setup:
       %code= @project.runners_token
diff --git a/app/views/projects/services/edit.html.haml b/app/views/projects/services/edit.html.haml
index 50ed78286d2..0f1a76a104a 100644
--- a/app/views/projects/services/edit.html.haml
+++ b/app/views/projects/services/edit.html.haml
@@ -1,2 +1,3 @@
 - page_title @service.title, "Services"
+= render "projects/settings/head"
 = render 'form'
diff --git a/app/views/projects/services/mattermost_slash_commands/_detailed_help.html.haml b/app/views/projects/services/mattermost_slash_commands/_detailed_help.html.haml
index 2fb88297fb3..ef3599460f1 100644
--- a/app/views/projects/services/mattermost_slash_commands/_detailed_help.html.haml
+++ b/app/views/projects/services/mattermost_slash_commands/_detailed_help.html.haml
@@ -22,14 +22,14 @@
     .col-sm-10.col-xs-12.input-group
       = text_field_tag :display_name, "GitLab / #{@project.name_with_namespace}", class: 'form-control input-sm', readonly: 'readonly'
       .input-group-btn
-        = clipboard_button(clipboard_target: '#display_name')
+        = clipboard_button(target: '#display_name')
 
   .form-group
     = label_tag :description, 'Description', class: 'col-sm-2 col-xs-12 control-label'
     .col-sm-10.col-xs-12.input-group
       = text_field_tag :description, run_actions_text, class: 'form-control input-sm', readonly: 'readonly'
       .input-group-btn
-        = clipboard_button(clipboard_target: '#description')
+        = clipboard_button(target: '#description')
 
   .form-group
     = label_tag nil, 'Command trigger word', class: 'col-sm-2 col-xs-12 control-label'
@@ -46,7 +46,7 @@
     .col-sm-10.col-xs-12.input-group
       = text_field_tag :request_url, service_trigger_url(subject), class: 'form-control input-sm', readonly: 'readonly'
       .input-group-btn
-        = clipboard_button(clipboard_target: '#request_url')
+        = clipboard_button(target: '#request_url')
 
   .form-group
     = label_tag nil, 'Request method', class: 'col-sm-2 col-xs-12 control-label'
@@ -57,14 +57,14 @@
     .col-sm-10.col-xs-12.input-group
       = text_field_tag :response_username, 'GitLab', class: 'form-control input-sm', readonly: 'readonly'
       .input-group-btn
-        = clipboard_button(clipboard_target: '#response_username')
+        = clipboard_button(target: '#response_username')
 
   .form-group
     = label_tag :response_icon, 'Response icon', class: 'col-sm-2 col-xs-12 control-label'
     .col-sm-10.col-xs-12.input-group
       = text_field_tag :response_icon, asset_url('gitlab_logo.png'), class: 'form-control input-sm', readonly: 'readonly'
       .input-group-btn
-        = clipboard_button(clipboard_target: '#response_icon')
+        = clipboard_button(target: '#response_icon')
 
   .form-group
     = label_tag nil, 'Autocomplete', class: 'col-sm-2 col-xs-12 control-label'
@@ -75,14 +75,14 @@
     .col-sm-10.col-xs-12.input-group
       = text_field_tag :autocomplete_hint, '[help]', class: 'form-control input-sm', readonly: 'readonly'
       .input-group-btn
-        = clipboard_button(clipboard_target: '#autocomplete_hint')
+        = clipboard_button(target: '#autocomplete_hint')
 
   .form-group
     = label_tag :autocomplete_description, 'Autocomplete description', class: 'col-sm-2 col-xs-12 control-label'
     .col-sm-10.col-xs-12.input-group
       = text_field_tag :autocomplete_description, run_actions_text, class: 'form-control input-sm', readonly: 'readonly'
       .input-group-btn
-        = clipboard_button(clipboard_target: '#autocomplete_description')
+        = clipboard_button(target: '#autocomplete_description')
 
 %hr
 
diff --git a/app/views/projects/services/slack_slash_commands/_help.html.haml b/app/views/projects/services/slack_slash_commands/_help.html.haml
index 078b7be6865..73b99453a4b 100644
--- a/app/views/projects/services/slack_slash_commands/_help.html.haml
+++ b/app/views/projects/services/slack_slash_commands/_help.html.haml
@@ -40,7 +40,7 @@
         .col-sm-10.col-xs-12.input-group
           = text_field_tag :url, service_trigger_url(subject), class: 'form-control input-sm', readonly: 'readonly'
           .input-group-btn
-            = clipboard_button(clipboard_target: '#url')
+            = clipboard_button(target: '#url')
 
       .form-group
         = label_tag nil, 'Method', class: 'col-sm-2 col-xs-12 control-label'
@@ -51,7 +51,7 @@
         .col-sm-10.col-xs-12.input-group
           = text_field_tag :customize_name, 'GitLab', class: 'form-control input-sm', readonly: 'readonly'
           .input-group-btn
-            = clipboard_button(clipboard_target: '#customize_name')
+            = clipboard_button(target: '#customize_name')
 
       .form-group
         = label_tag nil, 'Customize icon', class: 'col-sm-2 col-xs-12 control-label'
@@ -68,21 +68,21 @@
         .col-sm-10.col-xs-12.input-group
           = text_field_tag :autocomplete_description, run_actions_text, class: 'form-control input-sm', readonly: 'readonly'
           .input-group-btn
-            = clipboard_button(clipboard_target: '#autocomplete_description')
+            = clipboard_button(target: '#autocomplete_description')
 
       .form-group
         = label_tag :autocomplete_usage_hint, 'Autocomplete usage hint', class: 'col-sm-2 col-xs-12 control-label'
         .col-sm-10.col-xs-12.input-group
           = text_field_tag :autocomplete_usage_hint, '[help]', class: 'form-control input-sm', readonly: 'readonly'
           .input-group-btn
-            = clipboard_button(clipboard_target: '#autocomplete_usage_hint')
+            = clipboard_button(target: '#autocomplete_usage_hint')
 
       .form-group
         = label_tag :descriptive_label, 'Descriptive label', class: 'col-sm-2 col-xs-12 control-label'
         .col-sm-10.col-xs-12.input-group
           = text_field_tag :descriptive_label, 'Perform common operations on GitLab project', class: 'form-control input-sm', readonly: 'readonly'
           .input-group-btn
-            = clipboard_button(clipboard_target: '#descriptive_label')
+            = clipboard_button(target: '#descriptive_label')
 
     %hr
 
diff --git a/app/views/projects/settings/_head.html.haml b/app/views/projects/settings/_head.html.haml
index 88bcb541dac..faed65d6588 100644
--- a/app/views/projects/settings/_head.html.haml
+++ b/app/views/projects/settings/_head.html.haml
@@ -14,7 +14,7 @@
             %span
               Members
         - if can_edit
-          = nav_link(controller: :integrations) do
+          = nav_link(controller: [:integrations, :services, :hooks]) do
             = link_to project_settings_integrations_path(@project), title: 'Integrations' do
               %span
                 Integrations
@@ -24,10 +24,11 @@
                 Repository
           - if @project.feature_available?(:builds, current_user)
             = nav_link(controller: :ci_cd) do
-              = link_to namespace_project_settings_ci_cd_path(@project.namespace, @project), title: 'CI/CD Pipelines' do
+              = link_to namespace_project_settings_ci_cd_path(@project.namespace, @project), title: 'Pipelines' do
                 %span
-                  CI/CD Pipelines
-          = nav_link(controller: :pages) do
-            = link_to namespace_project_pages_path(@project.namespace, @project), title: 'Pages' do
-              %span
-                Pages
+                  Pipelines
+          - if Gitlab.config.pages.enabled
+            = nav_link(controller: :pages) do
+              = link_to namespace_project_pages_path(@project.namespace, @project), title: 'Pages' do
+                %span
+                  Pages
diff --git a/app/views/projects/settings/ci_cd/show.html.haml b/app/views/projects/settings/ci_cd/show.html.haml
index e2603096014..e8d2e91bd76 100644
--- a/app/views/projects/settings/ci_cd/show.html.haml
+++ b/app/views/projects/settings/ci_cd/show.html.haml
@@ -1,4 +1,4 @@
-- page_title "CI/CD Pipelines"
+- page_title "Pipelines"
 = render "projects/settings/head"
 
 = render 'projects/runners/index'
diff --git a/app/views/projects/settings/integrations/_project_hook.html.haml b/app/views/projects/settings/integrations/_project_hook.html.haml
index ceabe2eab3d..a6640592dba 100644
--- a/app/views/projects/settings/integrations/_project_hook.html.haml
+++ b/app/views/projects/settings/integrations/_project_hook.html.haml
@@ -3,12 +3,13 @@
     .col-md-8.col-lg-7
       %strong.light-header= hook.url
       %div
-        - %w(push_events tag_push_events issues_events confidential_issues_events note_events merge_requests_events build_events pipeline_events wiki_page_events).each do |trigger|
+        - %w(push_events tag_push_events issues_events confidential_issues_events note_events merge_requests_events job_events pipeline_events wiki_page_events).each do |trigger|
           - if hook.send(trigger)
             %span.label.label-gray.deploy-project-label= trigger.titleize
     .col-md-4.col-lg-5.text-right-lg.prepend-top-5
       %span.append-right-10.inline
         SSL Verification: #{hook.enable_ssl_verification ? "enabled" : "disabled"}
+      = link_to "Edit", edit_namespace_project_hook_path(@project.namespace, @project, hook), class: "btn btn-sm"
       = link_to "Test", test_namespace_project_hook_path(@project.namespace, @project, hook), class: "btn btn-sm"
       = link_to namespace_project_hook_path(@project.namespace, @project, hook), data: { confirm: 'Are you sure?'}, method: :delete, class: "btn btn-transparent" do
         %span.sr-only Remove
diff --git a/app/views/projects/settings/repository/show.html.haml b/app/views/projects/settings/repository/show.html.haml
index 4c02302e161..4e59033c4a3 100644
--- a/app/views/projects/settings/repository/show.html.haml
+++ b/app/views/projects/settings/repository/show.html.haml
@@ -1,5 +1,10 @@
 - page_title "Repository"
 = render "projects/settings/head"
 
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
+  = page_specific_javascript_bundle_tag('deploy_keys')
+
 = render @deploy_keys
 = render "projects/protected_branches/index"
+= render "projects/protected_tags/index"
diff --git a/app/views/projects/show.html.haml b/app/views/projects/show.html.haml
index de1229d58aa..1ca464696ed 100644
--- a/app/views/projects/show.html.haml
+++ b/app/views/projects/show.html.haml
@@ -12,7 +12,7 @@
 = render "projects/last_push"
 = render "home_panel"
 
-- if current_user && can?(current_user, :download_code, @project)
+- if can?(current_user, :download_code, @project)
   %nav.project-stats{ class: container_class }
     %ul.nav
       %li
@@ -70,14 +70,9 @@
             = link_to 'Set up Koding', add_koding_stack_path(@project)
         - if @repository.gitlab_ci_yml.blank? && @project.deployment_service.present?
           %li.missing
-            = link_to add_special_file_path(@project, file_name: '.gitlab-ci.yml', commit_message: 'Set up auto deploy', target_branch: 'auto-deploy', context: 'autodeploy') do
+            = link_to add_special_file_path(@project, file_name: '.gitlab-ci.yml', commit_message: 'Set up auto deploy', branch_name: 'auto-deploy', context: 'autodeploy') do
               Set up auto deploy
 
-  - if @repository.commit
-    %div{ class: container_class }
-      .project-last-commit
-        = render 'projects/last_commit', commit: @repository.commit, ref: current_ref, project: @project
-
 %div{ class: container_class }
   - if @project.archived?
     .text-warning.center.prepend-top-20
diff --git a/app/views/projects/snippets/edit.html.haml b/app/views/projects/snippets/edit.html.haml
index fb39028529d..24b92094b7d 100644
--- a/app/views/projects/snippets/edit.html.haml
+++ b/app/views/projects/snippets/edit.html.haml
@@ -1,4 +1,4 @@
-- page_title "Edit", @snippet.title, "Snippets"
+- page_title "Edit", "#{@snippet.title} (#{@snippet.to_reference})", "Snippets"
 
 %h3.page-title
   Edit Snippet
diff --git a/app/views/projects/snippets/show.html.haml b/app/views/projects/snippets/show.html.haml
index e35385f4cab..aab1c043e66 100644
--- a/app/views/projects/snippets/show.html.haml
+++ b/app/views/projects/snippets/show.html.haml
@@ -1,12 +1,12 @@
-- page_title @snippet.title, "Snippets"
+- page_title "#{@snippet.title} (#{@snippet.to_reference})", "Snippets"
 
 = render 'shared/snippets/header'
 
 .project-snippets
   %article.file-holder.snippet-file-content
-    = render 'shared/snippets/blob', raw_path: raw_namespace_project_snippet_path(@project.namespace, @project, @snippet)
+    = render 'shared/snippets/blob'
 
   .row-content-block.top-block.content-component-block
     = render 'award_emoji/awards_block', awardable: @snippet, inline: true
 
-  #notes= render "projects/notes/notes_with_form"
+  #notes= render "shared/notes/notes_with_form"
diff --git a/app/views/projects/stage/_graph.html.haml b/app/views/projects/stage/_graph.html.haml
deleted file mode 100644
index 4ee30b023ac..00000000000
--- a/app/views/projects/stage/_graph.html.haml
+++ /dev/null
@@ -1,19 +0,0 @@
-- stage = local_assigns.fetch(:stage)
-- statuses = stage.statuses.latest
-- status_groups = statuses.sort_by(&:sortable_name).group_by(&:group_name)
-%li.stage-column
-  .stage-name
-    %a{ name: stage.name }
-    = stage.name.titleize
-  .builds-container
-    %ul
-      - status_groups.each do |group_name, grouped_statuses|
-        - if grouped_statuses.one?
-          - status = grouped_statuses.first
-          %li.build{ 'id' => "ci-badge-#{group_name}" }
-            .curve
-            = render 'ci/status/graph_badge', subject: status
-        - else
-          %li.build{ 'id' => "ci-badge-#{group_name}" }
-            .curve
-            = render 'projects/stage/in_stage_group', name: group_name, subject: grouped_statuses
diff --git a/app/views/projects/stage/_in_stage_group.html.haml b/app/views/projects/stage/_in_stage_group.html.haml
deleted file mode 100644
index 671a3ef481c..00000000000
--- a/app/views/projects/stage/_in_stage_group.html.haml
+++ /dev/null
@@ -1,14 +0,0 @@
-- group_status = CommitStatus.where(id: subject).status
-%button.dropdown-menu-toggle.build-content.has-tooltip{ type: 'button', data: { toggle: 'dropdown',  title: "#{name} - #{group_status}", container: 'body' } }
-  %span{ class: "ci-status-icon ci-status-icon-#{group_status}" }
-    = ci_icon_for_status(group_status)
-  %span.ci-status-text
-    = name
-  %span.dropdown-counter-badge= subject.size
-
-%ul.dropdown-menu.big-pipeline-graph-dropdown-menu.js-grouped-pipeline-dropdown
-  .arrow
-  .scrollable-menu
-    - subject.each do |status|
-      %li
-        = render 'ci/status/dropdown_graph_badge', subject: status
diff --git a/app/views/projects/stage/_stage.html.haml b/app/views/projects/stage/_stage.html.haml
index 28e1c060875..f93994bebe3 100644
--- a/app/views/projects/stage/_stage.html.haml
+++ b/app/views/projects/stage/_stage.html.haml
@@ -6,8 +6,8 @@
         = ci_icon_for_status(stage.status)
       &nbsp;
       = stage.name.titleize
-= render stage.statuses.latest_ordered, coverage: @project.build_coverage_enabled?, stage: false, ref: false, pipeline_link: false, allow_retry: true
-= render stage.statuses.retried_ordered, coverage: @project.build_coverage_enabled?, stage: false, ref: false, pipeline_link: false, retried: true
+= render stage.statuses.latest_ordered, stage: false, ref: false, pipeline_link: false, allow_retry: true
+= render stage.statuses.retried_ordered, stage: false, ref: false, pipeline_link: false, retried: true
 %tr
   %td{ colspan: 10 }
     &nbsp;
diff --git a/app/views/projects/tags/_tag.html.haml b/app/views/projects/tags/_tag.html.haml
index dffe908e85a..44cb734d7b9 100644
--- a/app/views/projects/tags/_tag.html.haml
+++ b/app/views/projects/tags/_tag.html.haml
@@ -2,10 +2,14 @@
 - release = @releases.find { |release| release.tag == tag.name }
 %li.flex-row
   .row-main-content.str-truncated
-    = link_to namespace_project_tag_path(@project.namespace, @project, tag.name) do
-      %span.item-title
-        = icon('tag')
-        = tag.name
+    = link_to namespace_project_tag_path(@project.namespace, @project, tag.name), class: 'item-title ref-name' do
+      = icon('tag')
+      = tag.name
+
+    - if protected_tag?(@project, tag)
+      %span.label.label-success
+        protected
+
     - if tag.message.present?
       &nbsp;
       = strip_gpg_signature(tag.message)
@@ -19,8 +23,7 @@
     - if release && release.description.present?
       .description.prepend-top-default
         .wiki
-          = preserve do
-            = markdown_field(release, :description)
+          = markdown_field(release, :description)
 
   .row-fixed-content.controls
     = render 'projects/buttons/download', project: @project, ref: tag.name, pipeline: @tags_pipelines[tag.name]
@@ -30,5 +33,5 @@
         = icon("pencil")
 
     - if can?(current_user, :admin_project, @project)
-      = link_to namespace_project_tag_path(@project.namespace, @project, tag.name), class: 'btn btn-remove remove-row has-tooltip', title: "Delete tag", method: :delete, data: { confirm: "Deleting the '#{tag.name}' tag cannot be undone. Are you sure?", container: 'body' }, remote: true do
+      = link_to namespace_project_tag_path(@project.namespace, @project, tag.name), class: "btn btn-remove remove-row has-tooltip #{protected_tag?(@project, tag) ? 'disabled' : ''}", title: "Delete tag", method: :delete, data: { confirm: "Deleting the '#{tag.name}' tag cannot be undone. Are you sure?", container: 'body' }, remote: true do
         = icon("trash-o")
diff --git a/app/views/projects/tags/index.html.haml b/app/views/projects/tags/index.html.haml
index 7f9a44e565f..56656ea3d86 100644
--- a/app/views/projects/tags/index.html.haml
+++ b/app/views/projects/tags/index.html.haml
@@ -1,4 +1,5 @@
 - @no_container = true
+- @sort ||= sort_value_recently_updated
 - page_title "Tags"
 = render "projects/commits/head"
 
@@ -14,16 +15,14 @@
       .dropdown
         %button.dropdown-toggle{ type: 'button', data: { toggle: 'dropdown'} }
           %span.light
-            = projects_sort_options_hash[@sort]
+            = tags_sort_options_hash[@sort]
           = icon('chevron-down')
-        %ul.dropdown-menu.dropdown-menu-align-right
-          %li
-            = link_to filter_tags_path(sort: sort_value_name) do
-              = sort_title_name
-            = link_to filter_tags_path(sort: sort_value_recently_updated) do
-              = sort_title_recently_updated
-            = link_to filter_tags_path(sort: sort_value_oldest_updated) do
-              = sort_title_oldest_updated
+        %ul.dropdown-menu.dropdown-menu-align-right.dropdown-menu-selectable
+          %li.dropdown-header
+            Sort by
+          - tags_sort_options_hash.each do |value, title|
+            %li
+              = link_to title, filter_tags_path(sort: value), class: ("is-active" if @sort == value)
       - if can?(current_user, :push_code, @project)
         = link_to new_namespace_project_tag_path(@project.namespace, @project), class: 'btn btn-create new-tag-btn' do
           New tag
diff --git a/app/views/projects/tags/new.html.haml b/app/views/projects/tags/new.html.haml
index 160d4c7a223..52af295bddd 100644
--- a/app/views/projects/tags/new.html.haml
+++ b/app/views/projects/tags/new.html.haml
@@ -1,4 +1,5 @@
 - page_title "New Tag"
+- default_ref = params[:ref] || @project.default_branch
 
 - if @error
   .alert.alert-danger
@@ -16,30 +17,30 @@
       = text_field_tag :tag_name, params[:tag_name], required: true, tabindex: 1, autofocus: true, class: 'form-control'
   .form-group
     = label_tag :ref, 'Create from', class: 'control-label'
-    .col-sm-10
-      = text_field_tag :ref, params[:ref] || @project.default_branch, required: true, tabindex: 2, class: 'form-control'
-      .help-block  Branch name or commit SHA
+    .col-sm-10.create-from
+      .dropdown
+        = hidden_field_tag :ref, default_ref
+        = button_tag type: 'button', title: default_ref, class: 'dropdown-menu-toggle wide form-control js-branch-select', required: true, data: { toggle: 'dropdown', selected: default_ref, field_name: 'ref' } do
+          .text-left.dropdown-toggle-text= default_ref
+        = render 'shared/ref_dropdown', dropdown_class: 'wide'
+      .help-block Existing branch name, tag, or commit SHA
   .form-group
     = label_tag :message, nil, class: 'control-label'
     .col-sm-10
-      = text_area_tag :message, nil, required: false, tabindex: 3, class: 'form-control', rows: 5
+      = text_area_tag :message, @message, required: false, tabindex: 3, class: 'form-control', rows: 5
       .help-block Optionally, add a message to the tag.
   %hr
   .form-group
     = label_tag :release_description, 'Release notes', class: 'control-label'
     .col-sm-10
-      = render layout: 'projects/md_preview', locals: { preview_class: "md-preview", referenced_users: true } do
-        = render 'projects/zen', attr: :release_description, classes: 'note-textarea', placeholder: "Write your release notes or drag files here..."
-        = render 'projects/notes/hints'
+      = render layout: 'projects/md_preview', locals: { url: preview_markdown_path(@project), referenced_users: true } do
+        = render 'projects/zen', attr: :release_description, classes: 'note-textarea', placeholder: "Write your release notes or drag files here...", current_text: @release_description
+        = render 'shared/notes/hints'
       .help-block Optionally, add release notes to the tag. They will be stored in the GitLab database and displayed on the tags page.
   .form-actions
     = button_tag 'Create tag', class: 'btn btn-create', tabindex: 3
     = link_to 'Cancel', namespace_project_tags_path(@project.namespace, @project), class: 'btn btn-cancel'
 
 :javascript
-  var availableRefs = #{@project.repository.ref_names.to_json};
-
-  $("#ref").autocomplete({
-    source: availableRefs,
-    minLength: 1
-  });
+  window.gl = window.gl || { };
+  window.gl.availableRefs = #{@project.repository.ref_names.to_json};
diff --git a/app/views/projects/tags/show.html.haml b/app/views/projects/tags/show.html.haml
index fad3c5c2173..2b81ce4b9fa 100644
--- a/app/views/projects/tags/show.html.haml
+++ b/app/views/projects/tags/show.html.haml
@@ -6,7 +6,12 @@
   .top-area.multi-line
     .nav-text
       .title
-        %span.item-title= @tag.name
+        %span.item-title.ref-name
+          = icon('tag')
+          = @tag.name
+        - if protected_tag?(@project, @tag)
+          %span.label.label-success
+            protected
       - if @commit
         = render 'projects/branches/commit', commit: @commit, project: @project
       - else
@@ -24,7 +29,7 @@
         = render 'projects/buttons/download', project: @project, ref: @tag.name
       - if can?(current_user, :admin_project, @project)
         .btn-container.controls-item-full
-          = link_to namespace_project_tag_path(@project.namespace, @project, @tag.name), class: 'btn btn-remove remove-row has-tooltip', title: "Delete tag", method: :delete, data: { confirm: "Deleting the '#{@tag.name}' tag cannot be undone. Are you sure?" } do
+          = link_to namespace_project_tag_path(@project.namespace, @project, @tag.name), class: "btn btn-remove remove-row has-tooltip #{protected_tag?(@project, @tag) ? 'disabled' : ''}", title: "Delete tag", method: :delete, data: { confirm: "Deleting the '#{@tag.name}' tag cannot be undone. Are you sure?" } do
             %i.fa.fa-trash-o
 
     - if @tag.message.present?
@@ -35,7 +40,6 @@
     - if @release.description.present?
       .description
         .wiki
-          = preserve do
-            = markdown_field(@release, :description)
+          = markdown_field(@release, :description)
     - else
       This tag has no release notes.
diff --git a/app/views/projects/tree/_readme.html.haml b/app/views/projects/tree/_readme.html.haml
index bdcc160a067..de57cd4ba00 100644
--- a/app/views/projects/tree/_readme.html.haml
+++ b/app/views/projects/tree/_readme.html.haml
@@ -1,8 +1,9 @@
-%article.file-holder.readme-holder
-  .js-file-title.file-title
-    = blob_icon readme.mode, readme.name
-    = link_to namespace_project_blob_path(@project.namespace, @project, tree_join(@ref, @path, readme.name)) do
-      %strong
-        = readme.name
-  .file-content.wiki
-    = render_readme(readme)
+- if readme.rich_viewer
+  %article.file-holder.readme-holder
+    .js-file-title.file-title
+      = blob_icon readme.mode, readme.name
+      = link_to namespace_project_blob_path(@project.namespace, @project, tree_join(@ref, readme.path)) do
+        %strong
+          = readme.name
+
+    = render 'projects/blob/viewer', viewer: readme.rich_viewer, viewer_url: namespace_project_blob_path(@project.namespace, @project, tree_join(@ref, readme.path), viewer: :rich, format: :json)
diff --git a/app/views/projects/tree/_tree_content.html.haml b/app/views/projects/tree/_tree_content.html.haml
index 6855c463c6d..2e34803b143 100644
--- a/app/views/projects/tree/_tree_content.html.haml
+++ b/app/views/projects/tree/_tree_content.html.haml
@@ -6,16 +6,6 @@
           %th Name
           %th.hidden-xs
             .pull-left Last commit
-            .last-commit.hidden-sm.pull-left
-              %i.fa.fa-angle-right
-              %small.light
-                = link_to @commit.short_id, namespace_project_commit_path(@project.namespace, @project, @commit), class: "monospace"
-                = clipboard_button(clipboard_text: @commit.id, title: "Copy commit SHA to clipboard")
-                = time_ago_with_tooltip(@commit.committed_date)
-                \-
-                = @commit.full_title
-            %small.commit-history-link-spacer &#124;
-            = link_to 'History', namespace_project_commits_path(@project.namespace, @project, @id), class: 'commit-history-link'
           %th.text-right Last Update
       - if @path.present?
         %tr.tree-item
diff --git a/app/views/projects/tree/_tree_header.html.haml b/app/views/projects/tree/_tree_header.html.haml
index 259207a6dfd..e4d9e24f56e 100644
--- a/app/views/projects/tree/_tree_header.html.haml
+++ b/app/views/projects/tree/_tree_header.html.haml
@@ -1,3 +1,10 @@
+.tree-controls
+  = render 'projects/find_file_link'
+
+  = link_to 'History', namespace_project_commits_path(@project.namespace, @project, @id), class: 'btn btn-grouped'
+
+  = render 'projects/buttons/download', project: @project, ref: @ref
+
 .tree-ref-holder
   = render 'shared/ref_switcher', destination: 'tree', path: @path
 
@@ -5,12 +12,9 @@
   %li
     = link_to namespace_project_tree_path(@project.namespace, @project, @ref) do
       = @project.path
-  - tree_breadcrumbs(tree, 6) do |title, path|
+  - path_breadcrumbs do |title, path|
     %li
-      - if path
-        = link_to truncate(title, length: 40), namespace_project_tree_path(@project.namespace, @project, path)
-      - else
-        = link_to title, '#'
+      = link_to truncate(title, length: 40), namespace_project_tree_path(@project.namespace, @project, tree_join(@ref, path))
 
   - if current_user
     %li
diff --git a/app/views/projects/tree/show.html.haml b/app/views/projects/tree/show.html.haml
index a2a26039220..b51955010ce 100644
--- a/app/views/projects/tree/show.html.haml
+++ b/app/views/projects/tree/show.html.haml
@@ -7,12 +7,4 @@
 = render 'projects/last_push'
 
 %div{ class: container_class }
-  .tree-controls
-    = render 'projects/find_file_link'
-    = render 'projects/buttons/download', project: @project, ref: @ref
-
-  #tree-holder.tree-holder.clearfix
-    .nav-block
-      = render 'projects/tree/tree_header', tree: @tree
-
-    = render 'projects/tree/tree_content', tree: @tree
+  = render 'projects/files', commit: @last_commit, project: @project, ref: @ref
diff --git a/app/views/projects/triggers/_trigger.html.haml b/app/views/projects/triggers/_trigger.html.haml
index ed68e0ed56d..9b5f63ae81a 100644
--- a/app/views/projects/triggers/_trigger.html.haml
+++ b/app/views/projects/triggers/_trigger.html.haml
@@ -2,7 +2,7 @@
   %td
     - if can?(current_user, :admin_trigger, trigger)
       %span= trigger.token
-      = clipboard_button(clipboard_text: trigger.token, title: "Copy trigger token to clipboard")
+      = clipboard_button(text: trigger.token, title: "Copy trigger token to clipboard")
     - else
       %span= trigger.short_token
 
diff --git a/app/views/projects/variables/_table.html.haml b/app/views/projects/variables/_table.html.haml
index c7cebf45160..0ce597dcf21 100644
--- a/app/views/projects/variables/_table.html.haml
+++ b/app/views/projects/variables/_table.html.haml
@@ -14,7 +14,7 @@
           %tr
             %td.variable-key= variable.key
             %td.variable-value{ "data-value" => variable.value }******
-            %td
+            %td.variable-menu
               = link_to namespace_project_variable_path(@project.namespace, @project, variable), class: "btn btn-transparent btn-variable-edit" do
                 %span.sr-only
                   Update
diff --git a/app/views/projects/wikis/_form.html.haml b/app/views/projects/wikis/_form.html.haml
index c52527332bc..6cb7c1e9c4d 100644
--- a/app/views/projects/wikis/_form.html.haml
+++ b/app/views/projects/wikis/_form.html.haml
@@ -1,3 +1,5 @@
+- commit_message = @page.persisted? ? "Update #{@page.title}" : "Create #{@page.title}"
+
 = form_for [@project.namespace.becomes(Namespace), @project, @page], method: @page.persisted? ? :put : :post, html: { class: 'form-horizontal wiki-form common-note-form prepend-top-default js-quick-submit' } do |f|
   = form_errors(@page)
 
@@ -10,9 +12,9 @@
   .form-group
     = f.label :content, class: 'control-label'
     .col-sm-10
-      = render layout: 'projects/md_preview', locals: { preview_class: "md-preview" } do
+      = render layout: 'projects/md_preview', locals: { url: namespace_project_wiki_preview_markdown_path(@project.namespace, @project, @page.slug) } do
         = render 'projects/zen', f: f, attr: :content, classes: 'note-textarea', placeholder: 'Write your content or drag files here...'
-        = render 'projects/notes/hints'
+        = render 'shared/notes/hints'
 
       .clearfix
       .error-alert
@@ -28,7 +30,7 @@
 
   .form-group
     = f.label :commit_message, class: 'control-label'
-    .col-sm-10= f.text_field :message, class: 'form-control', rows: 18
+    .col-sm-10= f.text_field :message, class: 'form-control', rows: 18, value: commit_message
 
   .form-actions
     - if @page && @page.persisted?
diff --git a/app/views/projects/wikis/_main_links.html.haml b/app/views/projects/wikis/_main_links.html.haml
index 5211ade1a5f..6a578dbf640 100644
--- a/app/views/projects/wikis/_main_links.html.haml
+++ b/app/views/projects/wikis/_main_links.html.haml
@@ -1,9 +1,9 @@
 - if (@page && @page.persisted?)
   - if can?(current_user, :create_wiki, @project)
     = link_to '#modal-new-wiki', class: "add-new-wiki btn btn-new", "data-toggle" => "modal" do
-      New Page
+      New page
   = link_to namespace_project_wiki_history_path(@project.namespace, @project, @page), class: "btn" do
-    Page History
+    Page history
   - if can?(current_user, :create_wiki, @project) && @page.latest?
-    = link_to namespace_project_wiki_edit_path(@project.namespace, @project, @page), class: "btn" do
+    = link_to namespace_project_wiki_edit_path(@project.namespace, @project, @page), class: "btn js-wiki-edit" do
       Edit
diff --git a/app/views/projects/wikis/_new.html.haml b/app/views/projects/wikis/_new.html.haml
index 3d33679f07d..ba47574563d 100644
--- a/app/views/projects/wikis/_new.html.haml
+++ b/app/views/projects/wikis/_new.html.haml
@@ -18,4 +18,4 @@
                 Tip: You can specify the full path for the new file.
                 We will automatically create any missing directories.
             .form-actions
-              = button_tag 'Create Page', class: 'build-new-wiki btn btn-create'
+              = button_tag 'Create page', class: 'build-new-wiki btn btn-create'
diff --git a/app/views/projects/wikis/_sidebar.html.haml b/app/views/projects/wikis/_sidebar.html.haml
index 713b758727e..c2f9e65015d 100644
--- a/app/views/projects/wikis/_sidebar.html.haml
+++ b/app/views/projects/wikis/_sidebar.html.haml
@@ -1,4 +1,4 @@
-%aside.right-sidebar.right-sidebar-expanded.wiki-sidebar.js-wiki-sidebar.js-right-sidebar{ data: { "offset-top" => "102", "spy" => "affix" } }
+%aside.right-sidebar.right-sidebar-expanded.wiki-sidebar.js-wiki-sidebar.js-right-sidebar{ data: { "offset-top" => "50", "spy" => "affix" } }
   .block.wiki-sidebar-header.append-bottom-default
     %a.gutter-toggle.pull-right.visible-xs-block.visible-sm-block.js-sidebar-wiki-toggle{ href: "#" }
       = icon('angle-double-right')
diff --git a/app/views/projects/wikis/edit.html.haml b/app/views/projects/wikis/edit.html.haml
index 8cf018da1b7..b995d08cd02 100644
--- a/app/views/projects/wikis/edit.html.haml
+++ b/app/views/projects/wikis/edit.html.haml
@@ -22,10 +22,10 @@
     .nav-controls
       - if can?(current_user, :create_wiki, @project)
         = link_to '#modal-new-wiki', class: "add-new-wiki btn btn-new", "data-toggle" => "modal" do
-          New Page
+          New page
       - if @page.persisted?
         = link_to namespace_project_wiki_history_path(@project.namespace, @project, @page), class: "btn" do
-          Page History
+          Page history
         - if can?(current_user, :admin_wiki, @project)
           = link_to namespace_project_wiki_path(@project.namespace, @project, @page), data: { confirm: "Are you sure you want to delete this page?"}, method: :delete, class: "btn btn-danger" do
             Delete
diff --git a/app/views/projects/wikis/git_access.html.haml b/app/views/projects/wikis/git_access.html.haml
index fb0efd85dcd..68862206248 100644
--- a/app/views/projects/wikis/git_access.html.haml
+++ b/app/views/projects/wikis/git_access.html.haml
@@ -28,7 +28,7 @@
     %h3 Clone your wiki
     %pre.dark
       :preserve
-        git clone #{ content_tag(:span, default_url_to_repo(@project_wiki), class: 'clone')}
+        git clone #{ content_tag(:span, h(default_url_to_repo(@project_wiki)), class: 'clone')}
         cd #{h @project_wiki.path}
 
     %h3 Start Gollum and edit locally
diff --git a/app/views/projects/wikis/show.html.haml b/app/views/projects/wikis/show.html.haml
index 3609461b721..c00967546aa 100644
--- a/app/views/projects/wikis/show.html.haml
+++ b/app/views/projects/wikis/show.html.haml
@@ -27,7 +27,6 @@
 
   .wiki-holder.prepend-top-default.append-bottom-default
     .wiki
-      = preserve do
-        = render_wiki_content(@page)
+      = render_wiki_content(@page)
 
 = render 'sidebar'