Add latest changes from gitlab-org/gitlab@13-9-stable-eev13.9.0-rc41

92 files changed, 392 insertions, 468 deletions

diff --git a/app/views/projects/_activity.html.haml b/app/views/projects/_activity.html.haml
index c47ca81c431..db0f13843dd 100644
--- a/app/views/projects/_activity.html.haml
+++ b/app/views/projects/_activity.html.haml
@@ -1,15 +1,14 @@
 - is_project_overview = local_assigns.fetch(:is_project_overview, false)
 
-%div{ class: container_class }
-  .nav-block.d-none.d-sm-flex.activities.gl-static
-    = render 'shared/event_filter'
-    .controls.gl-display-flex
-      = link_to project_path(@project, rss_url_options), title: s_("ProjectActivityRSS|Subscribe"), class: 'btn gl-button btn-default btn-icon d-none d-sm-inline-flex has-tooltip' do
-        = sprite_icon('rss', css_class: 'qa-rss-icon gl-icon')
-      - if is_project_overview && can?(current_user, :download_code, @project)
-        .project-clone-holder.d-none.d-md-inline-flex.gl-ml-2
-          = render "projects/buttons/clone", dropdown_class: 'dropdown-menu-right'
+.nav-block.d-none.d-sm-flex.activities.gl-static
+  = render 'shared/event_filter'
+  .controls.gl-display-flex
+    = link_to project_path(@project, rss_url_options), title: s_("ProjectActivityRSS|Subscribe"), class: 'btn gl-button btn-default btn-icon d-none d-sm-inline-flex has-tooltip' do
+      = sprite_icon('rss', css_class: 'qa-rss-icon gl-icon')
+    - if is_project_overview && can?(current_user, :download_code, @project)
+      .project-clone-holder.d-none.d-md-inline-flex.gl-ml-2
+        = render "projects/buttons/clone", dropdown_class: 'dropdown-menu-right'
 
-  .content_list.project-activity{ :"data-href" => activity_project_path(@project) }
-  .loading
-    .spinner.spinner-md
+.content_list.project-activity{ :"data-href" => activity_project_path(@project) }
+.loading
+  .spinner.spinner-md
diff --git a/app/views/projects/_export.html.haml b/app/views/projects/_export.html.haml
index 86dfcda6d1b..f095f96779d 100644
--- a/app/views/projects/_export.html.haml
+++ b/app/views/projects/_export.html.haml
@@ -4,22 +4,20 @@
 
 .sub-section{ data: { qa_selector: 'export_project_content' } }
   %h4= _('Export project')
-  %p= _('Export this project with all its related data in order to move your project to a new GitLab instance. Once the export is finished, you can import the file from the "New Project" page.')
-
-  .bs-callout.bs-callout-info
-    %p.gl-mb-0
-      %p= _('The following items will be exported:')
-      %ul
-        - project_export_descriptions.each do |desc|
-          %li= desc
-      %p= _('The following items will NOT be exported:')
-      %ul
-        %li= _('Job logs and artifacts')
-        %li= _('Container registry images')
-        %li= _('CI variables')
-        %li= _('Webhooks')
-        %li= _('Any encrypted tokens')
-  %p= _('Once the exported file is ready, you will receive a notification email with a download link, or you can download it from this page.')
+  - link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path('user/project/settings/import_export') }
+  %p= _('Export this project with all its related data in order to move it to a new GitLab instance. When the exported file is ready, you can download it from this page or from the download link in the email notification you will receive. You can then import it when creating a new project. %{link_start}Learn more.%{link_end}').html_safe % { link_start: link_start, link_end: '</a>'.html_safe }
+  %p.gl-mb-0
+    %p= _('The following items will be exported:')
+    %ul
+      - project_export_descriptions.each do |desc|
+        %li= desc
+    %p= _('The following items will NOT be exported:')
+    %ul
+      %li= _('Job logs and artifacts')
+      %li= _('Container registry images')
+      %li= _('CI variables')
+      %li= _('Webhooks')
+      %li= _('Any encrypted tokens')
   - if project.export_status == :finished
     = link_to _('Download export'), download_export_project_path(project),
             rel: 'nofollow', download: '', method: :get, class: "btn btn-default", data: { qa_selector: 'download_export_link' }
diff --git a/app/views/projects/_files.html.haml b/app/views/projects/_files.html.haml
index 88dcc74a465..30d885964b5 100644
--- a/app/views/projects/_files.html.haml
+++ b/app/views/projects/_files.html.haml
@@ -11,7 +11,7 @@
     = render 'projects/tree/tree_header', tree: @tree
 
   #js-last-commit
-    .info-well.gl-display-none.gl-display-sm-flex.project-last-commit
+    .info-well.gl-display-none.gl-sm-display-flex.project-last-commit
       .gl-spinner-container.m-auto
         = loading_icon(size: 'md', color: 'dark', css_class: 'align-text-bottom')
 
diff --git a/app/views/projects/_find_file_link.html.haml b/app/views/projects/_find_file_link.html.haml
index c3b4a61c28a..a4bf72edf12 100644
--- a/app/views/projects/_find_file_link.html.haml
+++ b/app/views/projects/_find_file_link.html.haml
@@ -1,2 +1,2 @@
-= link_to project_find_file_path(@project, @ref), class: 'gl-button btn shortcuts-find-file', rel: 'nofollow' do
+= link_to project_find_file_path(@project, @ref), class: 'gl-button btn btn-default shortcuts-find-file', rel: 'nofollow' do
   = _('Find file')
diff --git a/app/views/projects/_home_panel.html.haml b/app/views/projects/_home_panel.html.haml
index 3e1d08e646e..9414e9b32d5 100644
--- a/app/views/projects/_home_panel.html.haml
+++ b/app/views/projects/_home_panel.html.haml
@@ -3,7 +3,7 @@
 - max_project_topic_length = 15
 - emails_disabled = @project.emails_disabled?
 
-= render_if_exists 'projects/invite_members_modal', project: @project
+= render 'projects/invite_members_modal', project: @project
 
 .project-home-panel.js-show-on-project-root.gl-my-5{ class: [("empty-project" if empty_repo)] }
   .row.gl-mb-3
@@ -46,7 +46,11 @@
     .project-repo-buttons.col-md-12.col-lg-6.d-inline-flex.flex-wrap.justify-content-lg-end
       - if current_user
         .d-inline-flex
-          = render 'shared/notifications/new_button', notification_setting: @notification_setting, btn_class: 'btn-xs', dropdown_container_class: 'gl-mr-3', emails_disabled: emails_disabled
+          - if Feature.enabled?(:vue_notification_dropdown, @project, default_enabled: :yaml)
+            - if @notification_setting
+              .js-vue-notification-dropdown{ data: { button_size: "small", disabled: emails_disabled, dropdown_items: notification_dropdown_items(@notification_setting).to_json, notification_level: @notification_setting.level, help_page_path: help_page_path('user/profile/notifications'), project_id: @project.id, container_class: 'gl-mr-3 gl-mt-5 gl-vertical-align-top' } }
+          - else
+            = render 'shared/notifications/new_button', notification_setting: @notification_setting, btn_class: 'btn-xs', dropdown_container_class: 'gl-mr-3', emails_disabled: emails_disabled
 
       .count-buttons.d-inline-flex
         = render 'projects/buttons/star'
diff --git a/app/views/projects/_invite_members_link.html.haml b/app/views/projects/_invite_members_link.html.haml
new file mode 100644
index 00000000000..95cfc75d955
--- /dev/null
+++ b/app/views/projects/_invite_members_link.html.haml
@@ -0,0 +1,4 @@
+- return unless can_invite_members_for_project?(@project)
+
+%li
+  .js-invite-members-trigger{ data: { icon: 'plus', classes: 'gl-text-decoration-none! gl-shadow-none!', display_text: _('Invite team members') } }
diff --git a/app/views/projects/_invite_members_modal.html.haml b/app/views/projects/_invite_members_modal.html.haml
index e8f61336882..b1bba5b59ca 100644
--- a/app/views/projects/_invite_members_modal.html.haml
+++ b/app/views/projects/_invite_members_modal.html.haml
@@ -1,4 +1,4 @@
-- if invite_members_allowed?(project.group)
+- if can_invite_members_for_project?(project)
   .js-invite-members-modal{ data: { id: project.id,
     name: project.name,
     is_project: 'true',
diff --git a/app/views/projects/_invite_members_side_nav_link.html.haml b/app/views/projects/_invite_members_side_nav_link.html.haml
deleted file mode 100644
index 15e0b75cf57..00000000000
--- a/app/views/projects/_invite_members_side_nav_link.html.haml
+++ /dev/null
@@ -1,3 +0,0 @@
-- if invite_members_allowed?(project.group) && body_data_page == 'projects:show'
-  %li
-    .js-invite-members-trigger{ data: { icon: 'plus', display_text: _('Invite team members') } }
diff --git a/app/views/projects/_merge_request_merge_options_settings.html.haml b/app/views/projects/_merge_request_merge_options_settings.html.haml
index 8951f2ed22f..80dabeceeb0 100644
--- a/app/views/projects/_merge_request_merge_options_settings.html.haml
+++ b/app/views/projects/_merge_request_merge_options_settings.html.haml
@@ -1,6 +1,6 @@
 - form = local_assigns.fetch(:form)
 
-.form-group
+.form-group#project-merge-options{ data: { project_full_path: @project.full_path } }
   %b= s_('ProjectSettings|Merge options')
   %p.text-secondary= s_('ProjectSettings|Additional merge request capabilities that influence how and when merges will be performed')
   = render_if_exists 'projects/merge_pipelines_settings', form: form
diff --git a/app/views/projects/_merge_request_merge_suggestions_settings.html.haml b/app/views/projects/_merge_request_merge_suggestions_settings.html.haml
index 258cf86ab05..31a85a204be 100644
--- a/app/views/projects/_merge_request_merge_suggestions_settings.html.haml
+++ b/app/views/projects/_merge_request_merge_suggestions_settings.html.haml
@@ -9,7 +9,7 @@
       anchor: 'configure-the-commit-message-for-applied-suggestions'),
       target: '_blank'
   .mb-2
-    = form.text_field :suggestion_commit_message, class: 'form-control mb-2', placeholder: Gitlab::Suggestions::CommitMessage::DEFAULT_SUGGESTION_COMMIT_MESSAGE
+    = form.text_field :suggestion_commit_message, class: 'form-control gl-form-input mb-2', placeholder: Gitlab::Suggestions::CommitMessage::DEFAULT_SUGGESTION_COMMIT_MESSAGE
     %p.form-text.text-muted
       = s_('ProjectSettings|The variables GitLab supports:')
       - Gitlab::Suggestions::CommitMessage::PLACEHOLDERS.keys.each do |placeholder|
diff --git a/app/views/projects/_merge_request_settings.html.haml b/app/views/projects/_merge_request_settings.html.haml
index e69972e8163..a54eb2dddac 100644
--- a/app/views/projects/_merge_request_settings.html.haml
+++ b/app/views/projects/_merge_request_settings.html.haml
@@ -4,8 +4,7 @@
 
 = render 'projects/merge_request_merge_options_settings', project: @project, form: form
 
-- if Feature.enabled?(:squash_options, @project, default_enabled: true)
-  = render 'projects/merge_request_squash_options_settings', form: form
+= render 'projects/merge_request_squash_options_settings', form: form
 
 = render 'projects/merge_request_merge_checks_settings', project: @project, form: form
 
diff --git a/app/views/projects/_remove.html.haml b/app/views/projects/_remove.html.haml
index c246c45d0f7..e991a9b0ec7 100644
--- a/app/views/projects/_remove.html.haml
+++ b/app/views/projects/_remove.html.haml
@@ -3,7 +3,8 @@
 .sub-section
   %h4.danger-title= _('Delete project')
   %p
-    %strong= _('Deleting the project will delete its repository and all related resources including issues, merge requests etc.')
+    %strong= _('Deleting the project will delete its repository and all related resources including issues, merge requests, etc.')
+    = link_to _('Learn more.'), help_page_path('user/project/settings/index', anchor: 'removing-a-fork-relationship'), target: '_blank', rel: 'noopener noreferrer'
   %p
     %strong= _('Deleted projects cannot be restored!')
   #js-project-delete-button{ data: { form_path: project_path(project), confirm_phrase: project.path } }
diff --git a/app/views/projects/_remove_fork.html.haml b/app/views/projects/_remove_fork.html.haml
index 2a7453902a8..8fa21966683 100644
--- a/app/views/projects/_remove_fork.html.haml
+++ b/app/views/projects/_remove_fork.html.haml
@@ -7,4 +7,5 @@
   = form_for @project, url: remove_fork_project_path(@project), method: :delete, remote: true, html: { class: 'transfer-project' } do |f|
     %p
       %strong= _('Once removed, the fork relationship cannot be restored. This project will no longer be able to receive or send merge requests to the source project or other forks.')
+      = link_to _('Learn more.'), help_page_path('user/project/settings/index', anchor: 'removing-a-fork-relationship'), target: '_blank', rel: 'noopener noreferrer'
     = button_to _('Remove fork relationship'), '#', class: "gl-button btn btn-danger js-confirm-danger", data: { "confirm-danger-message" => remove_fork_project_warning_message(@project) }
diff --git a/app/views/projects/_transfer.html.haml b/app/views/projects/_transfer.html.haml
index eb7feb7bd3b..ee717c2deca 100644
--- a/app/views/projects/_transfer.html.haml
+++ b/app/views/projects/_transfer.html.haml
@@ -4,13 +4,14 @@
   %h4.danger-title= _('Transfer project')
   = form_for @project, url: transfer_project_path(@project), method: :put, remote: true, html: { class: 'js-project-transfer-form' } do |f|
     .form-group
-      = label_tag :new_namespace_id, nil, class: 'label-bold' do
-        %span= _('Select a new namespace')
-      .form-group
-        = select_tag :new_namespace_id, namespaces_options(nil), include_blank: true, class: 'select2'
+      - link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path('user/project/settings/index', anchor: 'transferring-an-existing-project-into-another-namespace') }
+      %p= _("Transfer your project into another namespace. %{link_start}Learn more.%{link_end}").html_safe % { link_start: link_start, link_end: '</a>'.html_safe }
       %ul
         %li= _("Be careful. Changing the project's namespace can have unintended side effects.")
         %li= _('You can only transfer the project to namespaces you manage.')
         %li= _('You will need to update your local repositories to point to the new location.')
         %li= _('Project visibility level will be changed to match namespace rules when transferring to a group.')
+      = label_tag :new_namespace_id, _('Select a new namespace'), class: 'gl-font-weight-bold'
+      .form-group
+        = select_tag :new_namespace_id, namespaces_options(nil), include_blank: true, class: 'select2'
     = f.submit 'Transfer project', class: "gl-button btn btn-danger js-confirm-danger qa-transfer-button", data: { "confirm-danger-message" => transfer_project_message(@project) }
diff --git a/app/views/projects/artifacts/_artifact.html.haml b/app/views/projects/artifacts/_artifact.html.haml
index 233a41a37b5..6c9b6ec164e 100644
--- a/app/views/projects/artifacts/_artifact.html.haml
+++ b/app/views/projects/artifacts/_artifact.html.haml
@@ -50,10 +50,10 @@
     .table-action-buttons
       .btn-group
         - if can?(current_user, :read_build, @project)
-          = link_to download_project_job_artifacts_path(@project, artifact.job), rel: 'nofollow', download: '', title: _('Download artifacts'), data: { placement: 'top', container: 'body' }, ref: 'tooltip', aria: { label: _('Download artifacts') }, class: 'gl-button btn btn-build has-tooltip ml-0' do
+          = link_to download_project_job_artifacts_path(@project, artifact.job), rel: 'nofollow', download: '', title: _('Download artifacts'), data: { placement: 'top', container: 'body' }, ref: 'tooltip', aria: { label: _('Download artifacts') }, class: 'gl-button btn btn-default btn-build has-tooltip ml-0' do
             = sprite_icon('download')
 
-          = link_to browse_project_job_artifacts_path(@project, artifact.job), rel: 'nofollow', title: _('Browse artifacts'), data: { placement: 'top', container: 'body' }, ref: 'tooltip', aria: { label: _('Browse artifacts') }, class: 'gl-button btn btn-build has-tooltip' do
+          = link_to browse_project_job_artifacts_path(@project, artifact.job), rel: 'nofollow', title: _('Browse artifacts'), data: { placement: 'top', container: 'body' }, ref: 'tooltip', aria: { label: _('Browse artifacts') }, class: 'gl-button btn btn-default btn-build has-tooltip' do
             = sprite_icon('folder-open')
 
         - if can?(current_user, :destroy_artifacts, @project)
diff --git a/app/views/projects/blob/_breadcrumb.html.haml b/app/views/projects/blob/_breadcrumb.html.haml
index 710417f90e3..e666bb237bd 100644
--- a/app/views/projects/blob/_breadcrumb.html.haml
+++ b/app/views/projects/blob/_breadcrumb.html.haml
@@ -23,13 +23,13 @@
     - if blob.readable_text?
       - if blame
         = link_to 'Normal view', project_blob_path(@project, @id),
-            class: 'gl-button btn'
+            class: 'gl-button btn btn-default'
       - else
         = link_to 'Blame', project_blame_path(@project, @id),
-            class: 'gl-button btn js-blob-blame-link' unless blob.empty?
+            class: 'gl-button btn btn-default js-blob-blame-link' unless blob.empty?
 
     = link_to 'History', project_commits_path(@project, @id),
-        class: 'gl-button btn'
+        class: 'gl-button btn btn-default'
 
     = link_to 'Permalink', project_blob_path(@project,
-        tree_join(@commit.sha, @path)), class: 'gl-button btn js-data-file-blob-permalink-url'
+        tree_join(@commit.sha, @path)), class: 'gl-button btn btn-default js-data-file-blob-permalink-url'
diff --git a/app/views/projects/blob/_editor.html.haml b/app/views/projects/blob/_editor.html.haml
index b0317d84cdc..f9d11ec33d2 100644
--- a/app/views/projects/blob/_editor.html.haml
+++ b/app/views/projects/blob/_editor.html.haml
@@ -10,14 +10,14 @@
     - if current_action?(:edit) || current_action?(:update)
       %span.float-left.gl-mr-3
       = text_field_tag 'file_path', (params[:file_path] || @path),
-        class: 'form-control new-file-path js-file-path-name-input'
+        class: 'form-control gl-form-input new-file-path js-file-path-name-input'
       = render 'template_selectors'
 
     - if current_action?(:new) || current_action?(:create)
       %span.float-left.gl-mr-3
         \/
       = text_field_tag 'file_name', params[:file_name], placeholder: "File name",
-        required: true, class: 'form-control new-file-name js-file-path-name-input', value: params[:file_name] || (should_suggest_gitlab_ci_yml? ? '.gitlab-ci.yml' : '')
+        required: true, class: 'form-control gl-form-input new-file-name js-file-path-name-input', value: params[:file_name] || (should_suggest_gitlab_ci_yml? ? '.gitlab-ci.yml' : '')
       = render 'template_selectors'
       - if should_suggest_gitlab_ci_yml?
         .js-suggest-gitlab-ci-yml{ data: { target: '#gitlab-ci-yml-selector',
diff --git a/app/views/projects/branches/_branch.html.haml b/app/views/projects/branches/_branch.html.haml
index dc4172e2f09..fcf073e1e09 100644
--- a/app/views/projects/branches/_branch.html.haml
+++ b/app/views/projects/branches/_branch.html.haml
@@ -8,13 +8,13 @@
       = link_to project_tree_path(@project, branch.name), class: 'item-title str-truncated-100 ref-name gl-ml-3 qa-branch-name' do
         = branch.name
       - if branch.name == @repository.root_ref
-        %span.badge.badge-primary.gl-ml-2 default
+        %span.badge.gl-badge.sm.badge-pill.badge-primary.gl-ml-2 default
       - elsif merged
-        %span.badge.badge-info.has-tooltip.gl-ml-2{ title: s_('Branches|Merged into %{default_branch}') % { default_branch: @repository.root_ref } }
+        %span.badge.gl-badge.sm.badge-pill.badge-info.has-tooltip.gl-ml-2{ title: s_('Branches|Merged into %{default_branch}') % { default_branch: @repository.root_ref } }
           = s_('Branches|merged')
 
       - if protected_branch?(@project, branch)
-        %span.badge.badge-success.gl-ml-2
+        %span.badge.gl-badge.sm.badge-pill.badge-success.gl-ml-2
           = s_('Branches|protected')
 
       = render_if_exists 'projects/branches/diverged_from_upstream', branch: branch
@@ -50,10 +50,10 @@
 
     - if can?(current_user, :push_code, @project)
       - if branch.name == @project.repository.root_ref
-        %button{ class: "gl-button btn btn-danger remove-row has-tooltip disabled",
-          disabled: true,
-          title: s_('Branches|The default branch cannot be deleted') }
-          = sprite_icon("remove")
+        - delete_default_branch_tooltip = s_('Branches|The default branch cannot be deleted')
+        %span.has-tooltip{ title: delete_default_branch_tooltip }
+          %button{ class: "gl-button btn btn-danger remove-row disabled", disabled: true, 'aria-label' => delete_default_branch_tooltip }
+            = sprite_icon("remove")
       - elsif protected_branch?(@project, branch)
         - if can?(current_user, :push_to_delete_protected_branch, @project)
           %button{ class: "gl-button btn btn-danger remove-row has-tooltip",
@@ -65,10 +65,10 @@
               is_merged: ("true" if merged) } }
             = sprite_icon("remove")
         - else
-          %button{ class: "gl-button btn btn-danger remove-row has-tooltip disabled",
-            disabled: true,
-            title: s_('Branches|Only a project maintainer or owner can delete a protected branch') }
-            = sprite_icon("remove")
+          - delete_protected_branch_tooltip = s_('Branches|Only a project maintainer or owner can delete a protected branch')
+          %span.has-tooltip{ title: delete_protected_branch_tooltip }
+            %button{ class: "gl-button btn btn-danger remove-row  disabled", disabled: true, 'aria-label' => delete_protected_branch_tooltip }
+              = sprite_icon("remove")
       - else
         = link_to project_branch_path(@project, branch.name),
           class: "gl-button btn btn-danger remove-row qa-remove-btn js-ajax-loading-spinner has-tooltip",
diff --git a/app/views/projects/branches/index.html.haml b/app/views/projects/branches/index.html.haml
index 46cce59f67a..78f7d1af60f 100644
--- a/app/views/projects/branches/index.html.haml
+++ b/app/views/projects/branches/index.html.haml
@@ -60,7 +60,10 @@
   %ul.content-list.all-branches
     - @branches.each do |branch|
       = render "projects/branches/branch", branch: branch, merged: @merged_branch_names.include?(branch.name), commit_status: @branch_pipeline_statuses[branch.name], show_commit_status: @branch_pipeline_statuses.any?
-  = paginate @branches, theme: 'gitlab'
+  - if Feature.enabled?(:branches_pagination_without_count, @project, default_enabled: true)
+    = paginate_without_count @branches
+  - else
+    = paginate @branches, theme: 'gitlab'
 - else
   .nothing-here-block
     = s_('Branches|No branches to show')
diff --git a/app/views/projects/buttons/_download.html.haml b/app/views/projects/buttons/_download.html.haml
index 0fcbf2ca1eb..3071e5ea5f8 100644
--- a/app/views/projects/buttons/_download.html.haml
+++ b/app/views/projects/buttons/_download.html.haml
@@ -3,7 +3,7 @@
 - if !project.empty_repo? && can?(current_user, :download_code, project)
   - archive_prefix = "#{project.path}-#{ref.tr('/', '-')}"
   .project-action-button.dropdown.inline>
-    %button.gl-button.btn.has-tooltip{ title: s_('DownloadSource|Download'), 'data-toggle' => 'dropdown', 'aria-label' => s_('DownloadSource|Download'), 'data-display' => 'static', data: { qa_selector: 'download_source_code_button' } }
+    %button.gl-button.btn.btn-default.has-tooltip{ title: s_('DownloadSource|Download'), 'data-toggle' => 'dropdown', 'aria-label' => s_('DownloadSource|Download'), 'data-display' => 'static', data: { qa_selector: 'download_source_code_button' } }
       = sprite_icon('download')
       %span.sr-only=  _('Select Archive Format')
       = sprite_icon("chevron-down")
diff --git a/app/views/projects/buttons/_download_links.html.haml b/app/views/projects/buttons/_download_links.html.haml
index c997df578c0..f6084cfcde8 100644
--- a/app/views/projects/buttons/_download_links.html.haml
+++ b/app/views/projects/buttons/_download_links.html.haml
@@ -1,4 +1,4 @@
 .btn-group.ml-0.w-100
   - Gitlab::Workhorse::ARCHIVE_FORMATS.each_with_index do |fmt, index|
     - archive_path = project_archive_path(project, id: tree_join(ref, archive_prefix), path: path, format: fmt)
-    = link_to fmt, external_storage_url_or_path(archive_path), rel: 'nofollow', download: '', class: "gl-button btn btn-xs #{"btn-primary" if index == 0}"
+    = link_to fmt, external_storage_url_or_path(archive_path), rel: 'nofollow', download: '', class: "gl-button btn btn-sm #{index == 0 ? "btn-confirm" : "btn-default"}"
diff --git a/app/views/projects/buttons/_fork.html.haml b/app/views/projects/buttons/_fork.html.haml
index dbe0bf35b98..fad168da71e 100644
--- a/app/views/projects/buttons/_fork.html.haml
+++ b/app/views/projects/buttons/_fork.html.haml
@@ -7,11 +7,11 @@
           %span= s_('ProjectOverview|Fork')
       - else
         - can_create_fork = current_user.can?(:create_fork)
-        = link_to new_project_fork_path(@project),
-            class: "btn btn-default btn-xs has-tooltip count-badge-button d-flex align-items-center fork-btn #{'has-tooltip disabled' unless can_create_fork}",
-            title: (s_('ProjectOverview|You have reached your project limit') unless can_create_fork) do
-          = sprite_icon('fork', css_class: 'icon')
-          %span= s_('ProjectOverview|Fork')
+        - disabled_fork_tooltip = s_('ProjectOverview|You have reached your project limit')
+        %span.has-tooltip{ title: (disabled_fork_tooltip unless can_create_fork) }
+          = link_to new_project_fork_path(@project), class: "btn btn-default btn-xs count-badge-button d-flex align-items-center fork-btn #{' disabled' unless can_create_fork }", 'aria-label' => (disabled_fork_tooltip unless can_create_fork) do
+            = sprite_icon('fork', css_class: 'icon')
+            %span= s_('ProjectOverview|Fork')
       %span.fork-count.count-badge-count.d-flex.align-items-center
         = link_to project_forks_path(@project), title: n_(s_('ProjectOverview|Fork'), s_('ProjectOverview|Forks'), @project.forks_count), class: 'count' do
           = @project.forks_count
diff --git a/app/views/projects/buttons/_remove_tag.html.haml b/app/views/projects/buttons/_remove_tag.html.haml
index ae776e93203..68a9d715674 100644
--- a/app/views/projects/buttons/_remove_tag.html.haml
+++ b/app/views/projects/buttons/_remove_tag.html.haml
@@ -2,5 +2,5 @@
 - tag = local_assigns.fetch(:tag, nil)
 - return unless project && tag
 
-%button{ type: "button", class: "js-remove-tag js-confirm-modal-button gl-button btn btn-danger remove-row has-tooltip gl-ml-3 #{protected_tag?(project, tag) ? 'disabled' : ''}", title: s_('TagsPage|Delete tag'), data: { container: 'body', path: project_tag_path(@project, tag.name), modal_attributes: delete_tag_modal_attributes(tag.name) } }
+%button{ type: "button", class: "js-remove-tag js-confirm-modal-button gl-button btn btn-danger btn-icon remove-row has-tooltip gl-ml-3 #{protected_tag?(project, tag) ? 'disabled' : ''}", title: s_('TagsPage|Delete tag'), data: { container: 'body', path: project_tag_path(@project, tag.name), modal_attributes: delete_tag_modal_attributes(tag.name) } }
   = sprite_icon("remove")
diff --git a/app/views/projects/ci/builds/_build.html.haml b/app/views/projects/ci/builds/_build.html.haml
index 017c804ced0..b7a265c0b17 100644
--- a/app/views/projects/ci/builds/_build.html.haml
+++ b/app/views/projects/ci/builds/_build.html.haml
@@ -99,11 +99,11 @@
   %td
     .gl-display-flex
       - if can?(current_user, :read_job_artifacts, job) && job.artifacts?
-        = link_to download_project_job_artifacts_path(job.project, job), rel: 'nofollow', download: '', title: _('Download artifacts'), class: 'btn btn-build gl-button btn-icon btn-svg' do
+        = link_to download_project_job_artifacts_path(job.project, job), rel: 'nofollow', download: '', title: _('Download artifacts'), class: 'btn btn-build btn-default gl-button btn-icon btn-svg' do
           = sprite_icon('download')
       - if can?(current_user, :update_build, job)
         - if job.active?
-          = link_to cancel_project_job_path(job.project, job, continue: { to: request.fullpath }), method: :post, title: _('Cancel'), class: 'btn gl-button btn-build' do
+          = link_to cancel_project_job_path(job.project, job, continue: { to: request.fullpath }), method: :post, title: _('Cancel'), class: 'btn gl-button btn-build btn-default' do
             = sprite_icon('close')
         - elsif job.scheduled?
           .btn-group
@@ -125,7 +125,7 @@
               = sprite_icon('time-out')
         - elsif allow_retry
           - if job.playable? && !admin && can?(current_user, :update_build, job)
-            = link_to play_project_job_path(job.project, job, return_to: request.original_url), method: :post, title: _('Play'), class: 'btn gl-button btn-build' do
+            = link_to play_project_job_path(job.project, job, return_to: request.original_url), method: :post, title: _('Play'), class: 'btn gl-button btn-build btn-default' do
               = custom_icon('icon_play')
           - elsif job.retryable?
             = link_to retry_project_job_path(job.project, job, return_to: request.original_url), method: :post, title: _('Retry'), class: 'btn btn-build gl-button btn-icon btn-default' do
diff --git a/app/views/projects/cleanup/_show.html.haml b/app/views/projects/cleanup/_show.html.haml
index 37ec63cc871..e693082461f 100644
--- a/app/views/projects/cleanup/_show.html.haml
+++ b/app/views/projects/cleanup/_show.html.haml
@@ -6,7 +6,10 @@
     %button.btn.js-settings-toggle
       = expanded ? _('Collapse') : _('Expand')
     %p
-      = _("Clean up after running %{filter_repo} on the repository" % { filter_repo: link_to_filter_repo }).html_safe
+      - link_url = 'https://github.com/newren/git-filter-repo'
+      - link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: link_url }
+      - link_end = '</a>'.html_safe
+      = _("Clean up after running %{link_start}git filter-repo%{link_end} on the repository.").html_safe % { link_start: link_start, link_end: link_end }
       = link_to sprite_icon('question-o'),
           help_page_path('user/project/repository/reducing_the_repo_size_using_git.md'),
           target: '_blank', rel: 'noopener noreferrer'
@@ -24,6 +27,6 @@
             = _("No file selected")
           = f.file_field :bfg_object_map, class: "hidden js-object-map-input", required: true
         .form-text.text-muted
-          = _("The maximum file size allowed is %{size}.") % { size: number_to_human_size(Gitlab::CurrentSettings.max_attachment_size.megabytes) }
+          = _("The maximum file size is %{size}.") % { size: number_to_human_size(Gitlab::CurrentSettings.max_attachment_size.megabytes) }
 
       = f.submit _('Start cleanup'), class: 'gl-button btn btn-success'
diff --git a/app/views/projects/commit/_change.html.haml b/app/views/projects/commit/_change.html.haml
index 69b20fbc6d0..3c5f291b157 100644
--- a/app/views/projects/commit/_change.html.haml
+++ b/app/views/projects/commit/_change.html.haml
@@ -22,4 +22,14 @@
   - label = s_('ChangeTypeAction|Cherry-pick')
   - branch_label = s_('ChangeTypeActionLabel|Pick into branch')
   - title = commit.merged_merge_request(current_user) ? _('Cherry-pick this merge request') : _('Cherry-pick this commit')
-  = render "projects/commit/commit_modal", title: title, type: type, commit: commit, branch_label: branch_label, description: description, label: label
+
+  - if defined?(pajamas)
+    .js-cherry-pick-commit-modal{ data: { title: title,
+      endpoint: cherry_pick_namespace_project_commit_path(commit, namespace_id: @project.namespace.full_path, project_id: @project),
+      branch: @project.default_branch,
+      push_code: can?(current_user, :push_code, @project).to_s,
+      branch_collaboration: @project.branch_allows_collaboration?(current_user, selected_branch).to_s,
+      existing_branch: ERB::Util.html_escape(selected_branch),
+      branches_endpoint: project_branches_path(@project) } }
+  - else
+    = render "projects/commit/commit_modal", title: title, type: type, commit: commit, branch_label: branch_label, description: description, label: label
diff --git a/app/views/projects/commit/_commit_box.html.haml b/app/views/projects/commit/_commit_box.html.haml
index e8d524daced..ad6a8c10f6d 100644
--- a/app/views/projects/commit/_commit_box.html.haml
+++ b/app/views/projects/commit/_commit_box.html.haml
@@ -37,10 +37,10 @@
             #{ _('Browse Files') }
         - if can_collaborate && !@commit.has_been_reverted?(current_user)
           %li.clearfix
-            = revert_commit_link(@commit, project_commit_path(@project, @commit.id), pajamas: true)
+            = revert_commit_link
         - if can_collaborate
           %li.clearfix
-            = cherry_pick_commit_link(@commit, project_commit_path(@project, @commit.id), has_tooltip: false)
+            = cherry_pick_commit_link
         - if can?(current_user, :push_code, @project)
           %li.clearfix
             = link_to s_('CreateTag|Tag'), new_project_tag_path(@project, ref: @commit)
@@ -48,8 +48,8 @@
         %li.dropdown-header
           #{ _('Download') }
         - unless @commit.parents.length > 1
-          %li= link_to s_('DownloadCommit|Email Patches'), project_commit_path(@project, @commit, format: :patch), class: "qa-email-patches"
-        %li= link_to s_('DownloadCommit|Plain Diff'), project_commit_path(@project, @commit, format: :diff), class: "qa-plain-diff"
+          %li= link_to s_('DownloadCommit|Email Patches'), project_commit_path(@project, @commit, format: :patch), class: "qa-email-patches", rel: 'nofollow', download: ''
+        %li= link_to s_('DownloadCommit|Plain Diff'), project_commit_path(@project, @commit, format: :diff), class: "qa-plain-diff", rel: 'nofollow', download: ''
 
 .commit-box{ data: { project_path: project_path(@project) } }
   %h3.commit-title
diff --git a/app/views/projects/commit/pipelines.html.haml b/app/views/projects/commit/pipelines.html.haml
index 0dbd6e53212..b4c59c73e3b 100644
--- a/app/views/projects/commit/pipelines.html.haml
+++ b/app/views/projects/commit/pipelines.html.haml
@@ -4,3 +4,7 @@
 = render 'commit_box'
 = render 'ci_menu'
 = render 'projects/commit/pipelines_list', endpoint: pipelines_project_commit_path(@project, @commit.id)
+
+- if can_collaborate_with_project?(@project)
+  = render "projects/commit/change", type: 'revert', commit: @commit, pajamas: true
+  = render "projects/commit/change", type: 'cherry-pick', commit: @commit, pajamas: true
diff --git a/app/views/projects/commit/show.html.haml b/app/views/projects/commit/show.html.haml
index e7b2e757ce4..5e3bc270d5f 100644
--- a/app/views/projects/commit/show.html.haml
+++ b/app/views/projects/commit/show.html.haml
@@ -18,4 +18,4 @@
     = render "shared/notes/notes_with_form", :autocomplete => true
     - if can_collaborate_with_project?(@project)
       = render "projects/commit/change", type: 'revert', commit: @commit, pajamas: true
-      = render "projects/commit/change", type: 'cherry-pick', commit: @commit, title: @commit.title
+      = render "projects/commit/change", type: 'cherry-pick', commit: @commit, pajamas: true
diff --git a/app/views/projects/commits/show.html.haml b/app/views/projects/commits/show.html.haml
index a14f75259ec..802df664241 100644
--- a/app/views/projects/commits/show.html.haml
+++ b/app/views/projects/commits/show.html.haml
@@ -24,9 +24,9 @@
 
         .control
           = form_tag(project_commits_path(@project, @id), method: :get, class: 'commits-search-form js-signature-container', data: { 'signatures-path' => namespace_project_signatures_path }) do
-            = search_field_tag :search, params[:search], { placeholder: _('Search by message'), id: 'commits-search', class: 'form-control gl-form-input input-short gl-mt-3 gl-sm-mt-0 gl-min-w-full gl-inset-border-1-gray-200!', spellcheck: false }
+            = search_field_tag :search, params[:search], { placeholder: _('Search by message'), id: 'commits-search', class: 'form-control gl-form-input input-short gl-mt-3 gl-sm-mt-0 gl-min-w-full', spellcheck: false }
         .control.d-none.d-md-block
-          = link_to project_commits_path(@project, @ref, rss_url_options), title: _("Commits feed"), class: 'btn gl-button btn-svg' do
+          = link_to project_commits_path(@project, @ref, rss_url_options), title: _("Commits feed"), class: 'btn gl-button btn-default btn-icon' do
             = sprite_icon('rss', css_class: 'qa-rss-icon')
 
   = render_if_exists 'projects/commits/mirror_status'
diff --git a/app/views/projects/compare/_form.html.haml b/app/views/projects/compare/_form.html.haml
index 0c0530110c5..17134613b17 100644
--- a/app/views/projects/compare/_form.html.haml
+++ b/app/views/projects/compare/_form.html.haml
@@ -1,7 +1,4 @@
 = form_tag project_compare_index_path(@project), method: :post, class: 'form-inline js-requires-input js-signature-container', data: { 'signatures-path' => signatures_namespace_project_compare_index_path } do
-  - if params[:to] && params[:from]
-    .compare-switch-container
-      = link_to sprite_icon('substitute'), { from: params[:to], to: params[:from] }, class: 'commits-compare-switch has-tooltip btn gl-button btn-white', title: 'Swap revisions'
   .form-group.dropdown.compare-form-group.to.js-compare-to-dropdown
     .input-group.inline-input-group
       %span.input-group-prepend
diff --git a/app/views/projects/compare/index.html.haml b/app/views/projects/compare/index.html.haml
index e45ea209e8c..3f9aa24a569 100644
--- a/app/views/projects/compare/index.html.haml
+++ b/app/views/projects/compare/index.html.haml
@@ -13,4 +13,8 @@
   = html_escape(_("Changes are shown as if the %{b_open}source%{b_close} revision was being merged into the %{b_open}target%{b_close} revision.")) % { b_open: '<b>'.html_safe, b_close: '</b>'.html_safe }
 
 .prepend-top-20
-  = render "form"
+  #js-compare-selector{ data: { project_compare_index_path: project_compare_index_path(@project),
+    refs_project_path: refs_project_path(@project),
+    params_from: params[:from], params_to: params[:to],
+    project_merge_request_path: @merge_request.present? ? project_merge_request_path(@project, @merge_request) : '',
+    create_mr_path: create_mr_button? ? create_mr_path : '' } }
diff --git a/app/views/projects/default_branch/_show.html.haml b/app/views/projects/default_branch/_show.html.haml
index a1c7f5027c5..4e504f4c319 100644
--- a/app/views/projects/default_branch/_show.html.haml
+++ b/app/views/projects/default_branch/_show.html.haml
@@ -6,7 +6,7 @@
     %button.btn.js-settings-toggle
       = expanded ? _('Collapse') : _('Expand')
     %p
-      = _('Select the branch you want to set as the default for this project. All merge requests and commits will automatically be made against this branch unless you specify a different one.')
+      = _('Set the default branch for this project. All merge requests and commits are made against this branch unless you specify a different one.')
 
   .settings-content
     = form_for @project, remote: true, html: { multipart: true, anchor: 'default-branch-settings' }, authenticity_token: true do |f|
@@ -25,7 +25,7 @@
             = f.label :autoclose_referenced_issues, class: 'form-check-label' do
               %strong= _("Auto-close referenced issues on default branch")
             .form-text.text-muted
-              = _("Issues referenced by merge requests and commits within the default branch will be closed automatically")
+              = _("When merge requests and commits in the default branch close, any issues they reference also close.")
               = link_to sprite_icon('question-o'), help_page_path('user/project/issues/managing_issues.md', anchor: 'disabling-automatic-issue-closing'), target: '_blank'
 
       = f.submit _('Save changes'), class: "gl-button btn btn-success"
diff --git a/app/views/projects/diffs/viewers/_collapsed.html.haml b/app/views/projects/diffs/viewers/_collapsed.html.haml
index 94dcda38bd6..02f499144c0 100644
--- a/app/views/projects/diffs/viewers/_collapsed.html.haml
+++ b/app/views/projects/diffs/viewers/_collapsed.html.haml
@@ -1,5 +1,3 @@
-- diff_file = viewer.diff_file
-- url = url_for(safe_params.merge(action: :diff_for_path, old_path: diff_file.old_path, new_path: diff_file.new_path, file_identifier: diff_file.file_identifier))
-.nothing-here-block.diff-collapsed{ data: { diff_for_path: url } }
+.nothing-here-block.diff-collapsed{ data: { diff_for_path: collapsed_diff_url(viewer.diff_file) } }
   = _("This diff is collapsed.")
   %button.click-to-expand.btn.btn-link= _("Click to expand it.")
diff --git a/app/views/projects/edit.html.haml b/app/views/projects/edit.html.haml
index cde8a5f69dd..962e1158118 100644
--- a/app/views/projects/edit.html.haml
+++ b/app/views/projects/edit.html.haml
@@ -3,7 +3,7 @@
 - @content_class = "limit-container-width" unless fluid_layout
 - expanded = expanded_by_default?
 
-= render "shared/search_settings"
+- enable_search_settings
 
 %section.settings.general-settings.no-animate.expanded#js-general-settings
   .settings-header
@@ -16,7 +16,7 @@
   .settings-header
     %h4.settings-title.js-settings-toggle.js-settings-toggle-trigger-only= _('Visibility, project features, permissions')
     %button.gl-button.btn.btn-default.js-settings-toggle{ type: 'button' }= expanded ? _('Collapse') : _('Expand')
-    %p= _('Choose visibility level, enable/disable project features (issues, repository, wiki, snippets) and set permissions.')
+    %p= _('Choose visibility level, enable/disable project features and their permissions, disable email notifications, and show default award emoji.')
 
   .settings-content
     = form_for @project, remote: true, html: { multipart: true, class: "sharing-permissions-form" }, authenticity_token: true do |f|
@@ -25,7 +25,7 @@
       .js-project-permissions-form
       - if show_visibility_confirm_modal?(@project)
         = render "visibility_modal"
-      = f.submit _('Save changes'), class: "btn btn-success #{('js-confirm-danger' if show_visibility_confirm_modal?(@project))}", data: { qa_selector: 'visibility_features_permissions_save_button', check_field_name: ("project[visibility_level]" if show_visibility_confirm_modal?(@project)), check_compare_value: @project.visibility_level }
+      = f.submit _('Save changes'), class: "gl-button gl-button btn btn-success #{('js-confirm-danger' if show_visibility_confirm_modal?(@project))}", data: { qa_selector: 'visibility_features_permissions_save_button', check_field_name: ("project[visibility_level]" if show_visibility_confirm_modal?(@project)), check_compare_value: @project.visibility_level }
 
 %section.qa-merge-request-settings.rspec-merge-request-settings.settings.merge-requests-feature.no-animate#js-merge-request-settings{ class: [('expanded' if expanded), ('hidden' if @project.project_feature.send(:merge_requests_access_level) == 0)] }
   .settings-header
@@ -39,7 +39,7 @@
     = form_for @project, remote: true, html: { multipart: true, class: "merge-request-settings-form js-mr-settings-form" }, authenticity_token: true do |f|
       %input{ name: 'update_section', type: 'hidden', value: 'js-merge-request-settings' }
       = render 'projects/merge_request_settings', form: f
-      = f.submit _('Save changes'), class: "btn btn-succes qa-save-merge-request-changes rspec-save-merge-request-changes"
+      = f.submit _('Save changes'), class: "gl-button btn btn-succes qa-save-merge-request-changes rspec-save-merge-request-changes"
 
 = render_if_exists 'projects/merge_request_approvals_settings', expanded: expanded
 
@@ -68,9 +68,11 @@
   .settings-content
     .sub-section
       %h4= _('Housekeeping')
-      %p= _('Runs a number of housekeeping tasks within the current repository, such as compressing file revisions and removing unreachable objects.')
+      %p
+        = _('Runs a number of housekeeping tasks within the current repository, such as compressing file revisions and removing unreachable objects.')
+        = link_to _('Learn more.'), help_page_path('administration/housekeeping'), target: '_blank', rel: 'noopener noreferrer'
       = link_to _('Run housekeeping'), housekeeping_project_path(@project),
-        method: :post, class: "btn btn-default"
+        method: :post, class: "gl-button btn btn-default"
 
     = render 'export', project: @project
 
@@ -80,6 +82,13 @@
       = render 'projects/errors'
       = form_for @project do |f|
         .form-group
+          - link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path('user/project/settings/index', anchor: 'renaming-a-repository') }
+          %p= _("A project’s repository name defines its URL (the one you use to access the project via a browser) and its place on the file disk where GitLab is installed. %{link_start}Learn more.%{link_end}").html_safe % { link_start: link_start, link_end: '</a>'.html_safe }
+          %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_platform.present?
+              %li= _('Your deployment services will be broken, you will need to manually fix the services after renaming.')
           = f.label :path, _('Path'), class: 'label-bold'
           .form-group
             .input-group
@@ -87,12 +96,7 @@
                 .input-group-text
                   #{Gitlab::Utils.append_path(root_url, @project.namespace.full_path)}/
               = f.text_field :path, class: 'form-control qa-project-path-field h-auto'
-          %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_platform.present?
-              %li= _('Your deployment services will be broken, you will need to manually fix the services after renaming.')
-        = f.submit _('Change path'), class: "btn btn-warning qa-change-path-button"
+        = f.submit _('Change path'), class: "gl-button btn btn-warning qa-change-path-button"
 
     = render 'transfer', project: @project
 
diff --git a/app/views/projects/empty.html.haml b/app/views/projects/empty.html.haml
index 2936eff45df..2c245c1a914 100644
--- a/app/views/projects/empty.html.haml
+++ b/app/views/projects/empty.html.haml
@@ -2,6 +2,9 @@
 - default_branch_name = @project.default_branch || "master"
 - @skip_current_level_breadcrumb = true
 
+= content_for :invite_members_sidebar do
+  = render partial: 'projects/invite_members_link'
+
 = render partial: 'flash_messages', locals: { project: @project }
 
 = render "home_panel"
diff --git a/app/views/projects/environments/index.html.haml b/app/views/projects/environments/index.html.haml
index 067c987e721..5da9c25b780 100644
--- a/app/views/projects/environments/index.html.haml
+++ b/app/views/projects/environments/index.html.haml
@@ -6,5 +6,4 @@
   "can-create-environment" => can?(current_user, :create_environment, @project).to_s,
   "new-environment-path" => new_project_environment_path(@project),
   "help-page-path" => help_page_path("ci/environments/index.md"),
-  "deploy-boards-help-path" => help_page_path("user/project/deploy_boards", anchor: "enabling-deploy-boards"),
   "project-path" => @project.full_path } }
diff --git a/app/views/projects/graphs/charts.html.haml b/app/views/projects/graphs/charts.html.haml
index a92b02701c5..40280e0787f 100644
--- a/app/views/projects/graphs/charts.html.haml
+++ b/app/views/projects/graphs/charts.html.haml
@@ -22,10 +22,10 @@
           #{@daily_coverage_options[:base_params][:start_date].strftime('%b %d')}
         - end_date = capture do
           #{@daily_coverage_options[:base_params][:end_date].strftime('%b %d')}
-        = (_("Code coverage statistics for master %{start_date} - %{end_date}") % {start_date: start_date, end_date: end_date})
+        = (_("Code coverage statistics for %{ref} %{start_date} - %{end_date}") % { ref: "<strong>#{h @ref}</strong>", start_date: start_date, end_date: end_date }).html_safe
       - download_path = capture do
         #{@daily_coverage_options[:download_path]}
-      %a.btn.gl-button.btn-sm{ href: "#{download_path}?#{@daily_coverage_options[:base_params].to_query}" }
+      %a.btn.gl-button.btn-default.btn-sm{ href: "#{download_path}?#{@daily_coverage_options[:base_params].to_query}" }
         %small
           = _("Download raw data (.csv)")
     #js-code-coverage-chart{ data: { graph_endpoint: "#{@daily_coverage_options[:graph_api_path]}?#{@daily_coverage_options[:base_params].to_query}" } }
diff --git a/app/views/projects/graphs/show.html.haml b/app/views/projects/graphs/show.html.haml
index c7508ef4d47..c62d4a35973 100644
--- a/app/views/projects/graphs/show.html.haml
+++ b/app/views/projects/graphs/show.html.haml
@@ -3,6 +3,6 @@
 .sub-header-block.bg-gray-light.gl-p-5
   .tree-ref-holder.inline.vertical-align-middle
     = render 'shared/ref_switcher', destination: 'graphs'
-  = link_to s_('Commits|History'), project_commits_path(@project, current_ref), class: 'btn gl-button'
+  = link_to s_('Commits|History'), project_commits_path(@project, current_ref), class: 'btn gl-button btn-default'
 
 .js-contributors-graph{ class: container_class, 'data-project-graph-path': project_graph_path(@project, current_ref, format: :json),'data-project-branch': current_ref }
diff --git a/app/views/projects/merge_requests/_close_reopen_draft_report_toggle.html.haml b/app/views/projects/merge_requests/_close_reopen_draft_report_toggle.html.haml
index 3a8629b3b6e..5fa8f908122 100644
--- a/app/views/projects/merge_requests/_close_reopen_draft_report_toggle.html.haml
+++ b/app/views/projects/merge_requests/_close_reopen_draft_report_toggle.html.haml
@@ -3,7 +3,7 @@
 - button_class = "btn gl-button #{!@merge_request.closed? && 'js-draft-toggle-button'}"
 - toggle_class = "btn gl-button dropdown-toggle"
 
-.float-left.btn-group.gl-ml-3.gl-display-none.gl-display-md-flex
+.float-left.btn-group.gl-ml-3.gl-display-none.gl-md-display-flex
   = link_to @merge_request.closed? ? reopen_issuable_path(@merge_request) : toggle_draft_merge_request_path(@merge_request), method: :put, class: "#{button_class} #{button_action_class}" do
     - if @merge_request.closed?
       = _('Reopen')
diff --git a/app/views/projects/merge_requests/_commits.html.haml b/app/views/projects/merge_requests/_commits.html.haml
index 178e57b08b3..ecf5df5d3b4 100644
--- a/app/views/projects/merge_requests/_commits.html.haml
+++ b/app/views/projects/merge_requests/_commits.html.haml
@@ -8,7 +8,7 @@
     - if @project&.context_commits_enabled? && can_update_merge_request
       %p
         = _('Push commits to the source branch or add previously merged commits to review them.')
-      %button.btn.btn-primary.add-review-item-modal-trigger{ type: "button", data: { commits_empty: 'true', context_commits_empty: 'true' } }
+      %button.btn.gl-button.btn-confirm.add-review-item-modal-trigger{ type: "button", data: { commits_empty: 'true', context_commits_empty: 'true' } }
         = _('Add previously merged commits')
 - else
   %ol#commits-list.list-unstyled
diff --git a/app/views/projects/merge_requests/_mr_title.html.haml b/app/views/projects/merge_requests/_mr_title.html.haml
index 6a42f33db7d..61747fe2c8d 100644
--- a/app/views/projects/merge_requests/_mr_title.html.haml
+++ b/app/views/projects/merge_requests/_mr_title.html.haml
@@ -13,8 +13,8 @@
 .detail-page-header.border-bottom-0.pt-0.pb-0
   .detail-page-header-body
     .issuable-status-box.status-box.js-mr-status-box{ class: status_box_class(@merge_request), data: { state: @merge_request.state } }
-      = sprite_icon(state_icon_name, css_class: 'gl-display-block gl-display-sm-none!')
-      %span.gl-display-none.gl-display-sm-block
+      = sprite_icon(state_icon_name, css_class: 'gl-display-block gl-sm-display-none!')
+      %span.gl-display-none.gl-sm-display-block
         = state_human_name
 
     .issuable-meta
@@ -26,7 +26,7 @@
 
   .detail-page-header-actions.js-issuable-actions
     .clearfix.dropdown
-      %button.gl-button.btn.btn-default.float-left.gl-display-md-none.gl-w-full{ type: "button", data: { toggle: "dropdown" } }
+      %button.gl-button.btn.btn-default.float-left.gl-md-display-none.gl-w-full{ type: "button", data: { toggle: "dropdown" } }
         Options
         = sprite_icon('chevron-down', css_class: 'gl-text-gray-500')
       .dropdown-menu.dropdown-menu-right
@@ -45,9 +45,9 @@
             %li= link_to 'Report abuse', new_abuse_report_path(user_id: @merge_request.author.id, ref_url: merge_request_url(@merge_request))
 
       - if can_update_merge_request
-        = link_to 'Edit', edit_project_merge_request_path(@project, @merge_request), class: "d-none d-md-block btn gl-button btn-grouped js-issuable-edit qa-edit-button"
+        = link_to 'Edit', edit_project_merge_request_path(@project, @merge_request), class: "d-none d-md-block btn gl-button btn-default btn-grouped js-issuable-edit qa-edit-button"
 
       - if can_update_merge_request && !are_close_and_open_buttons_hidden
         = render 'projects/merge_requests/close_reopen_draft_report_toggle'
       - elsif !@merge_request.merged?
-        = link_to _('Report abuse'), new_abuse_report_path(user_id: @merge_request.author.id, ref_url: merge_request_url(@merge_request)), class: 'gl-display-none gl-display-md-block gl-button btn btn-warning-secondary float-right gl-ml-3', title: _('Report abuse')
+        = link_to _('Report abuse'), new_abuse_report_path(user_id: @merge_request.author.id, ref_url: merge_request_url(@merge_request)), class: 'gl-display-none gl-md-display-block gl-button btn btn-warning-secondary float-right gl-ml-3', title: _('Report abuse')
diff --git a/app/views/projects/merge_requests/conflicts/_submit_form.html.haml b/app/views/projects/merge_requests/conflicts/_submit_form.html.haml
index 15655e2b162..87356f33b1e 100644
--- a/app/views/projects/merge_requests/conflicts/_submit_form.html.haml
+++ b/app/views/projects/merge_requests/conflicts/_submit_form.html.haml
@@ -21,4 +21,4 @@
           %button.btn.gl-button.btn-success.js-submit-button{ type: "button", "@click" => "commit()", ":disabled" => "!readyToCommit" }
             %span {{commitButtonText}}
         .col-6.text-right
-          = link_to "Cancel", project_merge_request_path(@merge_request.project, @merge_request), class: "gl-button btn btn-cancel"
+          = link_to "Cancel", project_merge_request_path(@merge_request.project, @merge_request), class: "gl-button btn btn-default"
diff --git a/app/views/projects/merge_requests/conflicts/components/_diff_file_editor.html.haml b/app/views/projects/merge_requests/conflicts/components/_diff_file_editor.html.haml
index 7294c5d321a..4ba5ec5795a 100644
--- a/app/views/projects/merge_requests/conflicts/components/_diff_file_editor.html.haml
+++ b/app/views/projects/merge_requests/conflicts/components/_diff_file_editor.html.haml
@@ -4,7 +4,7 @@
       .discard-changes-alert
         Are you sure you want to discard your changes?
         .discard-actions
-          %button.btn.btn-sm.btn-close{ "@click" => "acceptDiscardConfirmation(file)" } Discard changes
-          %button.btn.btn-sm{ "@click" => "cancelDiscardConfirmation(file)" } Cancel
+          %button.btn.btn-sm.btn-danger-secondary.gl-button{ "@click" => "acceptDiscardConfirmation(file)" } Discard changes
+          %button.btn.btn-default.btn-sm.gl-button{ "@click" => "cancelDiscardConfirmation(file)" } Cancel
     .editor-wrap{ ":class" => "classObject" }
       .editor{ "style" => "height: 350px", data: { 'editor-loading': true } }
diff --git a/app/views/projects/merge_requests/show.html.haml b/app/views/projects/merge_requests/show.html.haml
index 849cfac825f..f20a4094f8f 100644
--- a/app/views/projects/merge_requests/show.html.haml
+++ b/app/views/projects/merge_requests/show.html.haml
@@ -56,10 +56,13 @@
               = render "projects/merge_requests/widget"
               = render "projects/merge_requests/awards_block"
               - if mr_action === "show"
-                - add_page_startup_api_call discussions_path(@merge_request)
+                - if Feature.enabled?(:paginated_notes, @project)
+                  - add_page_startup_api_call notes_url
+                - else
+                  - add_page_startup_api_call discussions_path(@merge_request)
                 - add_page_startup_api_call widget_project_json_merge_request_path(@project, @merge_request, format: :json)
                 - add_page_startup_api_call cached_widget_project_json_merge_request_path(@project, @merge_request, format: :json)
-              #js-vue-mr-discussions{ data: { notes_data: notes_data(@merge_request).to_json,
+              #js-vue-mr-discussions{ data: { notes_data: notes_data(@merge_request, Feature.enabled?(:paginated_notes, @project)).to_json,
                 noteable_data: serialize_issuable(@merge_request, serializer: 'noteable'),
                 noteable_type: 'MergeRequest',
                 target_type: 'merge_request',
@@ -100,7 +103,7 @@
 = render 'shared/issuable/sidebar', issuable_sidebar: @issuable_sidebar, assignees: @merge_request.assignees, reviewers: @merge_request.reviewers, source_branch: @merge_request.source_branch
 
 - if @merge_request.can_be_reverted?(current_user)
-  = render "projects/commit/change", type: 'revert', commit: @merge_request.merge_commit, title: @merge_request.title
+  = render "projects/commit/change", type: 'revert', commit: @merge_request.merge_commit, pajamas: true
 - 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/_commit_change_content.html.haml b/app/views/projects/merge_requests/widget/_commit_change_content.html.haml
index ad0ce7bf501..8684d2c860d 100644
--- a/app/views/projects/merge_requests/widget/_commit_change_content.html.haml
+++ b/app/views/projects/merge_requests/widget/_commit_change_content.html.haml
@@ -1,4 +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
+  = render "projects/commit/change", type: 'revert', commit: @merge_request.merge_commit, pajamas: true
 - 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/milestones/_form.html.haml b/app/views/projects/milestones/_form.html.haml
index a21f519da0e..f6e4442d4fb 100644
--- a/app/views/projects/milestones/_form.html.haml
+++ b/app/views/projects/milestones/_form.html.haml
@@ -21,8 +21,8 @@
 
   .form-actions
     - if @milestone.new_record?
-      = f.submit _('Create milestone'), class: 'btn-success btn', data: { qa_selector: 'create_milestone_button' }
+      = f.submit _('Create milestone'), class: 'gl-button btn-success btn', data: { qa_selector: 'create_milestone_button' }
       = link_to _('Cancel'), project_milestones_path(@project), class: 'gl-button btn btn-cancel'
     - else
-      = f.submit _('Save changes'), class: 'btn-success btn'
+      = f.submit _('Save changes'), class: 'gl-button btn-success btn'
       = link_to _('Cancel'), project_milestone_path(@project, @milestone), class: 'gl-button btn btn-cancel'
diff --git a/app/views/projects/milestones/index.html.haml b/app/views/projects/milestones/index.html.haml
index b964c8b1a93..c0df986e1ca 100644
--- a/app/views/projects/milestones/index.html.haml
+++ b/app/views/projects/milestones/index.html.haml
@@ -11,15 +11,14 @@
       = link_to new_project_milestone_path(@project), class: 'gl-button btn btn-success', data: { qa_selector: "new_project_milestone_link" }, title: _('New milestone') do
         = _('New milestone')
 
-.milestones
-  #js-delete-milestone-modal
-  #promote-milestone-modal
+- if @milestones.blank?
+  = render 'shared/empty_states/milestones'
+- else
+  .milestones
+    #js-delete-milestone-modal
+    #promote-milestone-modal
 
-  %ul.content-list
-    = render @milestones
+    %ul.content-list
+      = render @milestones
 
-    - if @milestones.blank?
-      %li
-        .nothing-here-block= _('No milestones to show')
-
-  = paginate @milestones, theme: 'gitlab'
+    = paginate @milestones, theme: 'gitlab'
diff --git a/app/views/projects/mirrors/_authentication_method.html.haml b/app/views/projects/mirrors/_authentication_method.html.haml
index 88bd7da7fef..94f8703657b 100644
--- a/app/views/projects/mirrors/_authentication_method.html.haml
+++ b/app/views/projects/mirrors/_authentication_method.html.haml
@@ -6,11 +6,11 @@
   .select-wrapper
     = f.select :auth_method,
         options_for_select(auth_options, mirror.auth_method),
-        {}, { class: "form-control select-control js-mirror-auth-type qa-authentication-method" }
+        {}, { class: "form-control gl-form-input select-control js-mirror-auth-type qa-authentication-method" }
     = sprite_icon('chevron-down', css_class: "gl-icon gl-absolute gl-top-3 gl-right-3 gl-text-gray-200")
     = f.hidden_field :auth_method, value: "password", class: "js-hidden-mirror-auth-type"
 
 .form-group
   .well-password-auth.collapse.js-well-password-auth
     = f.label :password, _("Password"), class: "label-bold"
-    = f.password_field :password, value: mirror.password, class: 'form-control qa-password', autocomplete: 'new-password'
+    = f.password_field :password, value: mirror.password, class: 'form-control gl-form-input qa-password', autocomplete: 'new-password'
diff --git a/app/views/projects/mirrors/_mirror_repos.html.haml b/app/views/projects/mirrors/_mirror_repos.html.haml
index 98d35845b31..d6ad6147e6e 100644
--- a/app/views/projects/mirrors/_mirror_repos.html.haml
+++ b/app/views/projects/mirrors/_mirror_repos.html.haml
@@ -21,7 +21,7 @@
 
             .form-group.has-feedback
               = label_tag :url, _('Git repository URL'), class: 'label-light'
-              = text_field_tag :url, nil, class: 'form-control js-mirror-url js-repo-url qa-mirror-repository-url-input', placeholder: _('Input the remote repository URL'), required: true, pattern: "(#{protocols}):\/\/.+", autocomplete: 'new-password'
+              = text_field_tag :url, nil, class: 'form-control gl-form-input js-mirror-url js-repo-url qa-mirror-repository-url-input', placeholder: _('Input the remote repository URL'), required: true, pattern: "(#{protocols}):\/\/.+", autocomplete: 'new-password'
 
             = render 'projects/mirrors/instructions'
 
diff --git a/app/views/projects/mirrors/_mirror_repos_form.html.haml b/app/views/projects/mirrors/_mirror_repos_form.html.haml
index 215d0a59d1b..dca01ebbe90 100644
--- a/app/views/projects/mirrors/_mirror_repos_form.html.haml
+++ b/app/views/projects/mirrors/_mirror_repos_form.html.haml
@@ -1,7 +1,7 @@
 .form-group
   = label_tag :mirror_direction, _('Mirror direction'), class: 'label-light'
   .select-wrapper
-    = select_tag :mirror_direction, options_for_select([[_('Push'), 'push']]), class: 'form-control select-control js-mirror-direction qa-mirror-direction', disabled: true
+    = select_tag :mirror_direction, options_for_select([[_('Push'), 'push']]), class: 'form-control gl-form-input select-control js-mirror-direction qa-mirror-direction', disabled: true
     = sprite_icon('chevron-down', css_class: "gl-icon gl-absolute gl-top-3 gl-right-3 gl-text-gray-200")
 
 = render partial: "projects/mirrors/mirror_repos_push", locals: { f: f }
diff --git a/app/views/projects/network/show.html.haml b/app/views/projects/network/show.html.haml
index 30ba22ba53c..99672ded6db 100644
--- a/app/views/projects/network/show.html.haml
+++ b/app/views/projects/network/show.html.haml
@@ -5,8 +5,8 @@
   .project-network.gl-border-1.gl-border-solid.gl-border-gray-300
     .controls.gl-bg-gray-50.gl-p-2.gl-font-base.gl-text-gray-400.gl-border-b-1.gl-border-b-solid.gl-border-b-gray-300
       = form_tag project_network_path(@project, @id), method: :get, class: 'form-inline network-form' do |f|
-        = text_field_tag :extended_sha1, @options[:extended_sha1], placeholder: _("Git revision"), class: 'search-input form-control input-mx-250 search-sha'
-        = button_tag class: 'btn btn-success' do
+        = text_field_tag :extended_sha1, @options[:extended_sha1], placeholder: _("Git revision"), class: 'search-input form-control gl-form-input input-mx-250 search-sha gl-mr-2'
+        = button_tag class: 'btn gl-button btn-success btn-icon' do
           = sprite_icon('search')
         .inline.gl-ml-5
           .form-check.light
diff --git a/app/views/projects/no_repo.html.haml b/app/views/projects/no_repo.html.haml
index d7853c1b466..ea14e2d6ca5 100644
--- a/app/views/projects/no_repo.html.haml
+++ b/app/views/projects/no_repo.html.haml
@@ -12,7 +12,7 @@
   #{ _('This means you can not push code until you create an empty repository or import existing one.') }
 %hr
 
-= render_if_exists 'projects/invite_members_modal', project: @project
+= render 'projects/invite_members_modal', project: @project
 
 .no-repo-actions
   = link_to project_repository_path(@project), method: :post, class: 'btn btn-primary' do
diff --git a/app/views/projects/notes/_actions.html.haml b/app/views/projects/notes/_actions.html.haml
index a785e36fad5..d11b61466e2 100644
--- a/app/views/projects/notes/_actions.html.haml
+++ b/app/views/projects/notes/_actions.html.haml
@@ -39,15 +39,15 @@
 - if can?(current_user, :award_emoji, note)
   - if note.emoji_awardable?
     .note-actions-item
-      = button_tag title: 'Add reaction', class: "note-action-button note-emoji-button js-add-award js-note-emoji has-tooltip btn btn-transparent", data: { position: 'right', container: 'body' } do
-        %span{ class: 'link-highlight award-control-icon-neutral' }= sprite_icon('slight-smile')
-        %span{ class: 'link-highlight award-control-icon-positive' }= sprite_icon('smiley')
-        %span{ class: 'link-highlight award-control-icon-super-positive' }= sprite_icon('smile')
+      = button_tag title: 'Add reaction', class: "note-action-button note-emoji-button js-add-award js-note-emoji has-tooltip btn gl-button btn-icon btn-default-tertiary btn-transparent", data: { position: 'right', container: 'body' } do
+        = sprite_icon('slight-smile', css_class: 'link-highlight award-control-icon-neutral gl-button-icon gl-icon gl-text-gray-400')
+        = sprite_icon('smiley', css_class: 'link-highlight award-control-icon-positive gl-button-icon gl-icon gl-left-3!')
+        = sprite_icon('smile', css_class: 'link-highlight award-control-icon-super-positive gl-button-icon gl-icon gl-left-3! ')
 
   - if note_editable
-    .note-actions-item
-      = button_tag title: 'Edit comment', class: 'note-action-button js-note-edit has-tooltip btn btn-transparent', data: { container: 'body', qa_selector: 'edit_comment_button' } do
+    .note-actions-item.gl-ml-0
+      = button_tag title: 'Edit comment', class: 'note-action-button js-note-edit has-tooltip btn gl-button btn-default-tertiary btn-transparent gl-px-2!', data: { container: 'body', qa_selector: 'edit_comment_button' } do
         %span.link-highlight
-          = custom_icon('icon_pencil')
+          = sprite_icon('pencil', css_class: 'gl-button-icon gl-icon gl-text-gray-400 s16')
 
   = render 'projects/notes/more_actions_dropdown', note: note, note_editable: note_editable
diff --git a/app/views/projects/notes/_more_actions_dropdown.html.haml b/app/views/projects/notes/_more_actions_dropdown.html.haml
index 8cf1b6b9294..c81a3683e90 100644
--- a/app/views/projects/notes/_more_actions_dropdown.html.haml
+++ b/app/views/projects/notes/_more_actions_dropdown.html.haml
@@ -1,10 +1,9 @@
 - is_current_user = current_user == note.author
 
 - if note_editable || !is_current_user
-  .dropdown.more-actions.note-actions-item
-    = button_tag title: 'More actions', class: 'note-action-button more-actions-toggle has-tooltip btn btn-transparent', data: { toggle: 'dropdown', container: 'body', qa_selector: 'more_actions_dropdown' } do
-      %span.icon
-        = custom_icon('ellipsis_v')
+  %div{ class: "dropdown more-actions note-actions-item gl-ml-0!" }
+    = button_tag title: 'More actions', class: 'note-action-button more-actions-toggle has-tooltip btn gl-button btn-default-tertiary btn-transparent gl-pl-2! gl-pr-0!', data: { toggle: 'dropdown', container: 'body', qa_selector: 'more_actions_dropdown' } do
+      = sprite_icon('ellipsis_v', css_class: 'gl-button-icon gl-icon gl-text-gray-400')
     %ul.dropdown-menu.more-actions-dropdown.dropdown-open-left
       %li
         = clipboard_button(text: noteable_note_url(note), title: _('Copy reference'), button_text: _('Copy link'), class: 'btn-clipboard', hide_tooltip: true, hide_button_icon: true)
diff --git a/app/views/projects/pages/_use.html.haml b/app/views/projects/pages/_use.html.haml
index e9ace8c72f1..ec3fc27dc20 100644
--- a/app/views/projects/pages/_use.html.haml
+++ b/app/views/projects/pages/_use.html.haml
@@ -4,7 +4,8 @@
       = s_('GitLabPages|Configure pages')
     .card-body
       %p.gl-mb-0
-        - link_start = "<a href='#{help_page_path('user/project/pages/index.md')}' target='_blank' rel='noopener noreferrer'>".html_safe
+        - docs_link_start = "<a href='#{help_page_path('user/project/pages/index.md')}' target='_blank' rel='noopener noreferrer'>".html_safe
+        - samples_link_start = "<a href='https://gitlab.com/pages' target='_blank' rel='noopener noreferrer'>".html_safe
+        - templates_link_start = "<a href='https://gitlab.com/gitlab-org/project-templates' target='_blank' rel='noopener noreferrer'>".html_safe
         - link_end = '</a>'.html_safe
-        = s_('GitLabPages|Learn how to upload your static site and have it served by GitLab by following the %{link_start}documentation on GitLab Pages%{link_end}.').html_safe % { link_start: link_start,
-            link_end: link_end }
+        = s_('GitLabPages|See the %{docs_link_start}GitLab Pages documentation%{link_end} to learn how to upload your static site and have GitLab serve it. You can also follow a %{samples_link_start}sample project%{link_end} or use a %{templates_link_start}GitLab CI template%{link_end}.').html_safe % { docs_link_start: docs_link_start, samples_link_start: samples_link_start, templates_link_start: templates_link_start, link_end: link_end }
diff --git a/app/views/projects/pipeline_schedules/_form.html.haml b/app/views/projects/pipeline_schedules/_form.html.haml
index ee0fe43e79c..8a369202555 100644
--- a/app/views/projects/pipeline_schedules/_form.html.haml
+++ b/app/views/projects/pipeline_schedules/_form.html.haml
@@ -39,5 +39,5 @@
         = f.check_box :active, required: false, value: @schedule.active?
         = f.label :active, _('Active'), class: 'gl-font-weight-normal'
   .footer-block.row-content-block
-    = f.submit _('Save pipeline schedule'), class: 'btn btn-success'
-    = link_to _('Cancel'), pipeline_schedules_path(@project), class: 'btn btn-cancel'
+    = f.submit _('Save pipeline schedule'), class: 'btn gl-button btn-success'
+    = link_to _('Cancel'), pipeline_schedules_path(@project), class: 'btn gl-button btn-default btn-cancel'
diff --git a/app/views/projects/pipeline_schedules/_pipeline_schedule.html.haml b/app/views/projects/pipeline_schedules/_pipeline_schedule.html.haml
index 45aaf2b64bf..e17c905e092 100644
--- a/app/views/projects/pipeline_schedules/_pipeline_schedule.html.haml
+++ b/app/views/projects/pipeline_schedules/_pipeline_schedule.html.haml
@@ -27,14 +27,14 @@
     %td
       .float-right.btn-group
         - if can?(current_user, :play_pipeline_schedule, pipeline_schedule)
-          = link_to play_pipeline_schedule_path(pipeline_schedule), method: :post, title: s_('Play'), class: 'btn btn-svg gl-display-flex gl-align-items-center gl-justify-content-center' do
+          = link_to play_pipeline_schedule_path(pipeline_schedule), method: :post, title: s_('Play'), class: 'btn gl-button btn-default btn-svg' do
             = sprite_icon('play')
         - if can?(current_user, :take_ownership_pipeline_schedule, pipeline_schedule)
-          = link_to take_ownership_pipeline_schedule_path(pipeline_schedule), method: :post, title: s_('PipelineSchedules|Take ownership'), class: 'btn' do
+          = link_to take_ownership_pipeline_schedule_path(pipeline_schedule), method: :post, title: s_('PipelineSchedules|Take ownership'), class: 'btn gl-button btn-default' do
             = s_('PipelineSchedules|Take ownership')
         - if can?(current_user, :update_pipeline_schedule, pipeline_schedule)
-          = link_to edit_pipeline_schedule_path(pipeline_schedule), title: _('Edit'), class: 'btn gl-display-flex' do
+          = link_to edit_pipeline_schedule_path(pipeline_schedule), title: _('Edit'), class: 'btn gl-button btn-default' do
             = sprite_icon('pencil')
         - if can?(current_user, :admin_pipeline_schedule, pipeline_schedule)
-          = link_to pipeline_schedule_path(pipeline_schedule), title: _('Delete'), method: :delete, class: 'gl-button btn btn-danger', data: { confirm: _("Are you sure you want to delete this pipeline schedule?") } do
+          = link_to pipeline_schedule_path(pipeline_schedule), title: _('Delete'), method: :delete, class: 'btn gl-button btn-danger', data: { confirm: _("Are you sure you want to delete this pipeline schedule?") } do
             = sprite_icon('remove')
diff --git a/app/views/projects/pipeline_schedules/index.html.haml b/app/views/projects/pipeline_schedules/index.html.haml
index 90417a852d5..558c12c04e4 100644
--- a/app/views/projects/pipeline_schedules/index.html.haml
+++ b/app/views/projects/pipeline_schedules/index.html.haml
@@ -9,7 +9,7 @@
 
   - if can?(current_user, :create_pipeline_schedule, @project)
     .nav-controls
-      = link_to new_project_pipeline_schedule_path(@project), class: 'btn btn-success' do
+      = link_to new_project_pipeline_schedule_path(@project), class: 'btn gl-button btn-success' do
         %span= _('New schedule')
 
 - if @schedules.present?
diff --git a/app/views/projects/pipelines/_info.html.haml b/app/views/projects/pipelines/_info.html.haml
index 77aa537dfdb..4a10f6aee1c 100644
--- a/app/views/projects/pipelines/_info.html.haml
+++ b/app/views/projects/pipelines/_info.html.haml
@@ -28,6 +28,9 @@
     - if @pipeline.latest?
       %span.js-pipeline-url-latest.badge.badge-pill.gl-badge.sm.badge-success.has-tooltip{ title: _("Latest pipeline for the most recent commit on this branch") }
         latest
+    - if @pipeline.merge_train_pipeline?
+      %span.js-pipeline-url-train.badge.badge-pill.gl-badge.sm.badge-info.has-tooltip{ title: _("This is a merge train pipeline") }
+        train
     - if @pipeline.has_yaml_errors?
       %span.js-pipeline-url-yaml.badge.badge-pill.gl-badge.sm.badge-danger.has-tooltip{ title: @pipeline.yaml_errors }
         yaml invalid
diff --git a/app/views/projects/pipelines/_with_tabs.html.haml b/app/views/projects/pipelines/_with_tabs.html.haml
index b41c3f4fc27..5f99396d744 100644
--- a/app/views/projects/pipelines/_with_tabs.html.haml
+++ b/app/views/projects/pipelines/_with_tabs.html.haml
@@ -1,15 +1,13 @@
 - return if pipeline_has_errors
-- dag_pipeline_tab_enabled = Feature.enabled?(:dag_pipeline_tab, @project, default_enabled: true)
 
 .tabs-holder
   %ul.pipelines-tabs.nav-links.no-top.no-bottom.mobile-separator.nav.nav-tabs
     %li.js-pipeline-tab-link
       = link_to project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-pipeline', action: 'pipelines', toggle: 'tab' }, class: 'pipeline-tab' do
         = _('Pipeline')
-    - if dag_pipeline_tab_enabled
-      %li.js-dag-tab-link
-        = link_to dag_project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-dag', action: 'dag', toggle: 'tab' }, class: 'dag-tab' do
-          = _('Needs')
+    %li.js-dag-tab-link
+      = link_to dag_project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-dag', action: 'dag', toggle: 'tab' }, class: 'dag-tab' do
+        = _('Needs')
     %li.js-builds-tab-link
       = link_to builds_project_pipeline_path(@project, @pipeline), data: { target: '#js-tab-builds', action: 'builds', toggle: 'tab' }, class: 'builds-tab' do
         = _('Jobs')
@@ -79,11 +77,10 @@
                     %code.bash.js-build-output
                       = build_summary(build)
 
-  - if dag_pipeline_tab_enabled
-    #js-tab-dag.tab-pane
-      #js-pipeline-dag-vue{ data: { pipeline_project_path: @project.full_path, pipeline_iid: @pipeline.iid, empty_svg_path: image_path('illustrations/empty-state/empty-dag-md.svg'), about_dag_doc_path: help_page_path('ci/directed_acyclic_graph/index.md'), dag_doc_path: help_page_path('ci/yaml/README.md', anchor: 'needs')} }
+  #js-tab-dag.tab-pane
+    #js-pipeline-dag-vue{ data: { pipeline_project_path: @project.full_path, pipeline_iid: @pipeline.iid, empty_svg_path: image_path('illustrations/empty-state/empty-dag-md.svg'), about_dag_doc_path: help_page_path('ci/directed_acyclic_graph/index.md'), dag_doc_path: help_page_path('ci/yaml/README.md', anchor: 'needs')} }
 
   #js-tab-tests.tab-pane
     #js-pipeline-tests-detail{ data: { summary_endpoint: summary_project_pipeline_tests_path(@project, @pipeline, format: :json),
-      suite_endpoint: project_pipeline_test_path(@project, @pipeline, suite_name: ':suite_name', format: :json) } }
+      suite_endpoint: project_pipeline_test_path(@project, @pipeline, suite_name: 'suite', format: :json) } }
   = render_if_exists "projects/pipelines/tabs_content", pipeline: @pipeline, project: @project
diff --git a/app/views/projects/pipelines/show.html.haml b/app/views/projects/pipelines/show.html.haml
index b3ad210aa47..b431ef202b3 100644
--- a/app/views/projects/pipelines/show.html.haml
+++ b/app/views/projects/pipelines/show.html.haml
@@ -6,7 +6,7 @@
 - add_page_specific_style 'page_bundles/reports'
 - add_page_specific_style 'page_bundles/ci_status'
 
-- if Feature.enabled?(:graphql_pipeline_details, @project)
+- if Feature.enabled?(:graphql_pipeline_details, @project, default_enabled: :yaml) || Feature.enabled?(:graphql_pipeline_details_users, @current_user, default_enabled: :yaml)
   - add_page_startup_graphql_call('pipelines/get_pipeline_details', { projectPath: @project.full_path, iid: @pipeline.iid })
 
 .js-pipeline-container{ data: { controller_action: "#{controller.action_name}" } }
diff --git a/app/views/projects/project_members/index.html.haml b/app/views/projects/project_members/index.html.haml
index cf39ac4dd56..b3c209d564b 100644
--- a/app/views/projects/project_members/index.html.haml
+++ b/app/views/projects/project_members/index.html.haml
@@ -1,10 +1,11 @@
 - page_title _("Members")
 - group = @project.group
+- vue_project_members_list_enabled = Feature.enabled?(:vue_project_members_list, @project)
 
 .js-remove-member-modal
 .row.gl-mt-3
   .col-lg-12
-    - if invite_members_allowed?(group)
+    - if can_invite_members_for_project?(@project)
       .row
         .col-md-12.col-lg-6.gl-display-flex
           .gl-flex-direction-column.gl-flex-wrap.align-items-baseline
@@ -19,7 +20,7 @@
         .col-md-12.col-lg-6
           .gl-display-flex.gl-flex-wrap.gl-lg-justify-content-end.gl-mx-n2.gl-mb-3
             .js-invite-members-trigger.gl-px-2.gl-sm-w-auto.gl-w-full.gl-mb-4{ data: { classes: 'btn btn-success gl-button gl-mt-3 gl-sm-w-auto gl-w-full', display_text: _('Invite members') } }
-        = render_if_exists 'projects/invite_members_modal', project: @project
+        = render 'projects/invite_members_modal', project: @project
 
     - else
       - if project_can_be_shared?
@@ -31,7 +32,7 @@
           %p
             = html_escape(_("Members can be added by project %{i_open}Maintainers%{i_close} or %{i_open}Owners%{i_close}")) % { i_open: '<i>'.html_safe, i_close: '</i>'.html_safe }
 
-    - if !invite_members_allowed?(group) && can_manage_project_members?(@project) && project_can_be_shared?
+    - if !can_invite_members_for_project?(@project) && can_manage_project_members?(@project) && project_can_be_shared?
       - if !membership_locked? && @project.allowed_to_share_with_group?
         %ul.nav-links.nav.nav-tabs.gitlab-tabs{ role: 'tablist' }
           %li.nav-tab{ role: 'presentation' }
@@ -74,24 +75,44 @@
             %span.badge.badge-pill= @requesters.count
     .tab-content
       #tab-members.tab-pane{ class: ('active' unless groups_tab_active?) }
-        = render 'projects/project_members/team', project: @project, group: group, members: @project_members, current_user_is_group_owner: current_user_is_group_owner?(@project)
+        - if vue_project_members_list_enabled
+          .js-project-members-list{ data: project_members_list_data_attributes(@project, @project_members) }
+            .loading
+              .spinner.spinner-md
+        - else
+          = render 'projects/project_members/team', project: @project, group: group, members: @project_members, current_user_is_group_owner: current_user_is_group_owner?(@project)
         = paginate @project_members, theme: "gitlab", params: { search_groups: nil }
       - if show_groups?(@group_links)
         #tab-groups.tab-pane{ class: ('active' if groups_tab_active?) }
-          = render 'projects/project_members/groups', group_links: @group_links
+          - if vue_project_members_list_enabled
+            .js-project-group-links-list{ data: project_group_links_list_data_attributes(@project, @group_links) }
+              .loading
+                .spinner.spinner-md
+          - else
+            = render 'projects/project_members/groups', group_links: @group_links
       - if show_invited_members?(@project, @invited_members)
         #tab-invited-members.tab-pane
-          .card.card-without-border
-            = render 'shared/members/tab_pane/header' do
-              = render 'shared/members/tab_pane/title' do
-                = html_escape(_('Members invited to %{strong_start}%{project_name}%{strong_end}')) % { project_name: @project.name, strong_start: '<strong>'.html_safe, strong_end: '</strong>'.html_safe }
-            %ul.content-list.members-list
-              = render partial: 'shared/members/member', collection: @invited_members, as: :member, locals: { membership_source: @project, group: group, current_user_is_group_owner: current_user_is_group_owner?(@project) }
+          - if vue_project_members_list_enabled
+            .js-project-invited-members-list{ data: project_members_list_data_attributes(@project, @invited_members) }
+              .loading
+                .spinner.spinner-md
+          - else
+            .card.card-without-border
+              = render 'shared/members/tab_pane/header' do
+                = render 'shared/members/tab_pane/title' do
+                  = html_escape(_('Members invited to %{strong_start}%{project_name}%{strong_end}')) % { project_name: @project.name, strong_start: '<strong>'.html_safe, strong_end: '</strong>'.html_safe }
+              %ul.content-list.members-list
+                = render partial: 'shared/members/member', collection: @invited_members, as: :member, locals: { membership_source: @project, group: group, current_user_is_group_owner: current_user_is_group_owner?(@project) }
       - if show_access_requests?(@project, @requesters)
         #tab-access-requests.tab-pane
-          .card.card-without-border
-            = render 'shared/members/tab_pane/header' do
-              = render 'shared/members/tab_pane/title' do
-                = html_escape(_('Users requesting access to %{strong_start}%{project_name}%{strong_end}')) % { project_name: @project.name, strong_start: '<strong>'.html_safe, strong_end: '</strong>'.html_safe }
-            %ul.content-list.members-list
-              = render partial: 'shared/members/member', collection: @requesters, as: :member, locals: { membership_source: @project, group: group }
+          - if vue_project_members_list_enabled
+            .js-project-access-requests-list{ data: project_members_list_data_attributes(@project, @requesters) }
+              .loading
+                .spinner.spinner-md
+          - else
+            .card.card-without-border
+              = render 'shared/members/tab_pane/header' do
+                = render 'shared/members/tab_pane/title' do
+                  = html_escape(_('Users requesting access to %{strong_start}%{project_name}%{strong_end}')) % { project_name: @project.name, strong_start: '<strong>'.html_safe, strong_end: '</strong>'.html_safe }
+              %ul.content-list.members-list
+                = render partial: 'shared/members/member', collection: @requesters, as: :member, locals: { membership_source: @project, group: group }
diff --git a/app/views/projects/protected_branches/shared/_protected_branch.html.haml b/app/views/projects/protected_branches/shared/_protected_branch.html.haml
index d62e9513d56..02ec778b97c 100644
--- a/app/views/projects/protected_branches/shared/_protected_branch.html.haml
+++ b/app/views/projects/protected_branches/shared/_protected_branch.html.haml
@@ -5,7 +5,7 @@
     %span.ref-name= protected_branch.name
 
     - if @project.root_ref?(protected_branch.name)
-      %span.badge.badge-info.d-inline default
+      %span.badge.gl-badge.badge-pill.badge-info.d-inline default
 
     %div
       - if protected_branch.wildcard?
@@ -20,4 +20,4 @@
 
   - if can_admin_project
     %td
-      = link_to 'Unprotect', [@project, protected_branch, { update_section: 'js-protected-branches-settings' }], disabled: local_assigns[:disabled], data: { confirm: 'Branch will be writable for developers. Are you sure?' }, method: :delete, class: "btn btn-warning"
+      = link_to 'Unprotect', [@project, protected_branch, { update_section: 'js-protected-branches-settings' }], disabled: local_assigns[:disabled], data: { confirm: 'Branch will be writable for developers. Are you sure?' }, method: :delete, class: "btn gl-button btn-warning"
diff --git a/app/views/projects/registry/repositories/index.html.haml b/app/views/projects/registry/repositories/index.html.haml
index 97bc366544f..93e94928110 100644
--- a/app/views/projects/registry/repositories/index.html.haml
+++ b/app/views/projects/registry/repositories/index.html.haml
@@ -19,4 +19,7 @@
     "project_path": @project.full_path,
     "gid_prefix": container_repository_gid_prefix,
     "is_admin": current_user&.admin.to_s,
-    character_error: @character_error.to_s } }
+    character_error: @character_error.to_s,
+    user_callouts_path: user_callouts_path,
+    user_callout_id: UserCalloutsHelper::UNFINISHED_TAG_CLEANUP_CALLOUT,
+    show_unfinished_tag_cleanup_callout: show_unfinished_tag_cleanup_callout?.to_s, } }
diff --git a/app/views/projects/runners/_group_runners.html.haml b/app/views/projects/runners/_group_runners.html.haml
index 9415516d6f6..6e46423cde0 100644
--- a/app/views/projects/runners/_group_runners.html.haml
+++ b/app/views/projects/runners/_group_runners.html.haml
@@ -13,10 +13,10 @@
     %br
     %br
     - if @project.group_runners_enabled?
-      = link_to toggle_group_runners_project_runners_path(@project), class: 'btn btn-close', method: :post do
+      = link_to toggle_group_runners_project_runners_path(@project), class: 'btn gl-button btn-warning-secondary', method: :post do
         = _('Disable group runners')
     - else
-      = link_to toggle_group_runners_project_runners_path(@project), class: 'btn btn-success btn-inverted', method: :post do
+      = link_to toggle_group_runners_project_runners_path(@project), class: 'btn gl-button btn-success btn-inverted', method: :post do
         = _('Enable group runners')
     &nbsp;
     = _('for this project')
diff --git a/app/views/projects/runners/_runner.html.haml b/app/views/projects/runners/_runner.html.haml
index 85bd0335b92..41159df1435 100644
--- a/app/views/projects/runners/_runner.html.haml
+++ b/app/views/projects/runners/_runner.html.haml
@@ -10,8 +10,8 @@
           = sprite_icon('lock')
 
       %small.edit-runner
-        = link_to edit_project_runner_path(@project, runner), class: 'btn btn-edit' do
-          = sprite_icon('pencil')
+        = link_to edit_project_runner_path(@project, runner), class: 'btn gl-button btn-edit' do
+          = sprite_icon('pencil', css_class: 'gl-my-2')
     - else
       %span.commit-sha
         = runner.short_sha
@@ -19,18 +19,18 @@
     .float-right
       - if @project_runners.include?(runner)
         - if runner.active?
-          = link_to _('Pause'), pause_project_runner_path(@project, runner), method: :post, class: 'btn btn-sm btn-danger', data: { confirm: _("Are you sure?") }
+          = link_to _('Pause'), pause_project_runner_path(@project, runner), method: :post, class: 'btn gl-button btn-sm btn-danger', data: { confirm: _("Are you sure?") }
         - else
-          = link_to _('Resume'), resume_project_runner_path(@project, runner), method: :post, class: 'btn btn-success btn-sm'
+          = link_to _('Resume'), resume_project_runner_path(@project, runner), method: :post, class: 'btn gl-button btn-success btn-sm'
         - if runner.belongs_to_one_project?
-          = link_to _('Remove runner'), project_runner_path(@project, runner), data: { confirm: _("Are you sure?") }, method: :delete, class: 'btn btn-danger btn-sm'
+          = link_to _('Remove runner'), project_runner_path(@project, runner), data: { confirm: _("Are you sure?") }, method: :delete, class: 'btn gl-button btn-danger btn-sm'
         - else
           - runner_project = @project.runner_projects.find_by(runner_id: runner) # rubocop: disable CodeReuse/ActiveRecord
-          = link_to _('Disable for this project'), project_runner_project_path(@project, runner_project), data: { confirm: _("Are you sure?") }, method: :delete, class: 'btn btn-danger btn-sm'
+          = link_to _('Disable for this project'), project_runner_project_path(@project, runner_project), data: { confirm: _("Are you sure?") }, method: :delete, class: 'btn gl-button btn-danger btn-sm'
       - elsif runner.project_type?
         = form_for [@project, @project.runner_projects.new] do |f|
           = f.hidden_field :runner_id, value: runner.id
-          = f.submit _('Enable for this project'), class: 'btn btn-sm'
+          = f.submit _('Enable for this project'), class: 'btn gl-button btn-sm'
   .float-right
     %small.light
       \##{runner.id}
diff --git a/app/views/projects/runners/_shared_runners.html.haml b/app/views/projects/runners/_shared_runners.html.haml
index fd8b4eb0d39..484d8f8a40c 100644
--- a/app/views/projects/runners/_shared_runners.html.haml
+++ b/app/views/projects/runners/_shared_runners.html.haml
@@ -9,10 +9,10 @@
         = _('Shared runners disabled on group level')
     - else
       - if @project.shared_runners_enabled?
-        = link_to toggle_shared_runners_project_runners_path(@project), class: 'btn btn-close', method: :post do
+        = link_to toggle_shared_runners_project_runners_path(@project), class: 'btn gl-button btn-warning-secondary', method: :post do
           = _('Disable shared runners')
       - else
-        = link_to toggle_shared_runners_project_runners_path(@project), class: 'btn btn-success', method: :post do
+        = link_to toggle_shared_runners_project_runners_path(@project), class: 'btn gl-button btn-success', method: :post do
           = _('Enable shared runners')
       &nbsp; for this project
 
diff --git a/app/views/projects/runners/_specific_runners.html.haml b/app/views/projects/runners/_specific_runners.html.haml
index 3e325b80efd..88895634990 100644
--- a/app/views/projects/runners/_specific_runners.html.haml
+++ b/app/views/projects/runners/_specific_runners.html.haml
@@ -9,9 +9,11 @@
                      clusters_path: project_clusters_path(@project) }
   %hr
   = render partial: 'ci/runner/how_to_setup_runner',
-           locals: { registration_token: @project.runners_token,
-                     type: 'specific',
-                     reset_token_url: reset_registration_token_namespace_project_settings_ci_cd_path }
+          locals: { registration_token: @project.runners_token,
+                    type: 'specific',
+                    reset_token_url: reset_registration_token_namespace_project_settings_ci_cd_path,
+                    project_path: @project.path_with_namespace,
+                    group_path: '' }
 
 %hr
 
diff --git a/app/views/projects/security/configuration/show.html.haml b/app/views/projects/security/configuration/show.html.haml
new file mode 100644
index 00000000000..1a371955be8
--- /dev/null
+++ b/app/views/projects/security/configuration/show.html.haml
@@ -0,0 +1,4 @@
+- breadcrumb_title _("Security Configuration")
+- page_title _("Security Configuration")
+
+#js-security-configuration-static
diff --git a/app/views/projects/services/_form.html.haml b/app/views/projects/services/_form.html.haml
index 59b3afa476f..3c99b4c5e68 100644
--- a/app/views/projects/services/_form.html.haml
+++ b/app/views/projects/services/_form.html.haml
@@ -1,19 +1,14 @@
 - if lookup_context.template_exists?('top', "projects/services/#{@service.to_param}", true)
   = render "projects/services/#{@service.to_param}/top"
 
-.row.gl-mt-3.gl-mb-3
-  .col-lg-4
-    %h3.page-title.gl-mt-0
-      = @service.title
-      - if @service.operating?
-        = sprite_icon('check', css_class: 'gl-text-green-500')
+%h3.page-title
+  = @service.title
+  - if @service.operating?
+    = sprite_icon('check', css_class: 'gl-text-green-500')
 
-    - if @service.respond_to?(:detailed_description)
-      %p= @service.detailed_description
-  .col-lg-8
-    = form_for(@service, as: :service, url: scoped_integration_path(@service), method: :put, html: { class: 'gl-show-field-errors integration-settings-form js-integration-settings-form', data: { 'test-url' => test_project_service_path(@project, @service) } }) do |form|
-      = render 'shared/service_settings', form: form, integration: @service
-      %input{ id: 'services_redirect_to', type: 'hidden', name: 'redirect_to', value: request.referrer }
+= form_for(@service, as: :service, url: scoped_integration_path(@service), method: :put, html: { class: 'gl-show-field-errors integration-settings-form js-integration-settings-form', data: { 'test-url' => test_project_service_path(@project, @service) } }) do |form|
+  = render 'shared/service_settings', form: form, integration: @service
+  %input{ id: 'services_redirect_to', type: 'hidden', name: 'redirect_to', value: request.referrer }
 
 - if lookup_context.template_exists?('show', "projects/services/#{@service.to_param}", true)
   %hr
diff --git a/app/views/projects/services/prometheus/_top.html.haml b/app/views/projects/services/prometheus/_top.html.haml
index 0238a45b75f..db02ea85865 100644
--- a/app/views/projects/services/prometheus/_top.html.haml
+++ b/app/views/projects/services/prometheus/_top.html.haml
@@ -7,4 +7,4 @@
       .gl-alert-body
         = s_('AlertSettings|You can now set up alert endpoints for manually configured Prometheus instances in the Alerts section on the Operations settings page. Alert endpoint fields on this page have been deprecated.')
       .gl-alert-actions
-        = link_to _('Visit settings page'), project_settings_operations_path(@project, anchor: 'js-alert-management-settings'), class: 'btn gl-alert-action btn-info gl-button'
+        = link_to _('Visit settings page'), project_settings_operations_path(@project, anchor: 'js-alert-management-settings'), class: 'gl-button btn gl-alert-action btn-info'
diff --git a/app/views/projects/settings/_archive.html.haml b/app/views/projects/settings/_archive.html.haml
index 4133129fde2..4300ebb4852 100644
--- a/app/views/projects/settings/_archive.html.haml
+++ b/app/views/projects/settings/_archive.html.haml
@@ -7,12 +7,14 @@
     - else
       = _('Archive project')
   - if @project.archived?
-    %p= _("Unarchiving the project will restore people's ability to make changes to it. The repository can be committed to, and issues, comments, and other entities can be created. %{strong_start}Once active, this project shows up in the search and on the dashboard.%{strong_end}").html_safe % { strong_start: '<strong>'.html_safe, strong_end: '</strong>'.html_safe }
+    - link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path('user/project/settings/index', anchor: 'unarchiving-a-project') }
+    %p= _("Unarchiving the project will restore its members' ability to make changes to it. The repository can be committed to, and issues, comments, and other entities can be created. %{strong_start}Once active, this project shows up in the search and on the dashboard.%{strong_end} %{link_start}Learn more.%{link_end}").html_safe % { strong_start: '<strong>'.html_safe, strong_end: '</strong>'.html_safe, link_start: link_start, link_end: '</a>'.html_safe }
     = link_to _('Unarchive project'), unarchive_project_path(@project),
         data: { confirm: _("Are you sure that you want to unarchive this project?"), qa_selector: 'unarchive_project_link' },
-        method: :post, class: "btn btn-success"
+        method: :post, class: "gl-button btn btn-success"
   - else
-    %p= _("Archiving the project will make it entirely read only. It is hidden from the dashboard and doesn't show up in searches. %{strong_start}The repository cannot be committed to, and no issues, comments, or other entities can be created.%{strong_end}").html_safe % { strong_start: '<strong>'.html_safe, strong_end: '</strong>'.html_safe }
+    - link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path('user/project/settings/index', anchor: 'archiving-a-project') }
+    %p= _("Archiving the project will make it entirely read only. It is hidden from the dashboard and doesn't show up in searches. %{strong_start}The repository cannot be committed to, and no issues, comments, or other entities can be created.%{strong_end} %{link_start}Learn more.%{link_end}").html_safe % { strong_start: '<strong>'.html_safe, strong_end: '</strong>'.html_safe, link_start: link_start, link_end: '</a>'.html_safe }
     = link_to _('Archive project'), archive_project_path(@project),
       data: { confirm: _("Are you sure that you want to archive this project?"), qa_selector: 'archive_project_link' },
-      method: :post, class: "btn btn-warning"
+      method: :post, class: "gl-button btn btn-warning"
diff --git a/app/views/projects/settings/_general.html.haml b/app/views/projects/settings/_general.html.haml
index 5d5f1d54439..3b03e213983 100644
--- a/app/views/projects/settings/_general.html.haml
+++ b/app/views/projects/settings/_general.html.haml
@@ -7,17 +7,17 @@
       .form-group.col-md-5
         = f.label :name, class: 'label-bold', for: 'project_name_edit' do
           = _('Project name')
-        = f.text_field :name, class: 'form-control qa-project-name-field', id: "project_name_edit"
+        = f.text_field :name, class: 'form-control gl-form-input qa-project-name-field', id: "project_name_edit"
 
       .form-group.col-md-7
         = f.label :id, class: 'label-bold' do
           = _('Project ID')
-        = f.text_field :id, class: 'form-control w-auto', readonly: true
+        = f.text_field :id, class: 'form-control gl-form-input w-auto', readonly: true
 
     .row
       .form-group.col-md-9
         = f.label :tag_list, _('Topics (optional)'), class: 'label-bold'
-        = f.text_field :tag_list, value: @project.tag_list.join(', '), maxlength: 2000, class: "form-control"
+        = f.text_field :tag_list, value: @project.tag_list.join(', '), maxlength: 2000, class: "form-control gl-form-input"
         %p.form-text.text-muted= _('Separate topics with commas.')
 
     = render_if_exists 'compliance_management/compliance_framework/project_settings', f: f
@@ -25,14 +25,14 @@
     .row
       .form-group.col-md-9
         = f.label :description, _('Project description (optional)'), class: 'label-bold'
-        = f.text_area :description, class: 'form-control', rows: 3, maxlength: 250
+        = f.text_area :description, class: 'form-control gl-form-input', rows: 3, maxlength: 250
 
   .row= render_if_exists 'projects/classification_policy_settings', f: f
 
   = render_if_exists 'shared/repository_size_limit_setting', form: f, type: :project
 
   .form-group.gl-mt-3.gl-mb-3
-    .avatar-container.s90
+    .avatar-container.rect-avatar.s90
       = project_icon(@project, alt: _('Project avatar'), class: 'avatar project-avatar s90')
     = f.label :avatar, _('Project avatar'), class: 'label-bold d-block'
     = render 'shared/choose_avatar_button', f: f
@@ -40,4 +40,4 @@
       %hr
       = link_to _('Remove avatar'), project_avatar_path(@project), data: { confirm: _('Avatar will be removed. Are you sure?')}, method: :delete, class: 'btn btn-link'
 
-  = f.submit _('Save changes'), class: "btn btn-success mt-4 qa-save-naming-topics-avatar-button"
+  = f.submit _('Save changes'), class: "gl-button btn btn-success gl-mt-6 qa-save-naming-topics-avatar-button"
diff --git a/app/views/projects/settings/ci_cd/_form.html.haml b/app/views/projects/settings/ci_cd/_form.html.haml
index d247e73a5b4..e0c4a3d624e 100644
--- a/app/views/projects/settings/ci_cd/_form.html.haml
+++ b/app/views/projects/settings/ci_cd/_form.html.haml
@@ -4,10 +4,46 @@
       = form_errors(@project)
       %fieldset.builds-feature
         .form-group
+          .form-check
+            = f.check_box :public_builds, { class: 'form-check-input' }
+            = f.label :public_builds, class: 'form-check-label' do
+              %strong= _("Public pipelines")
+            .form-text.text-muted
+              = _("Allow public access to pipelines and job details, including output logs and artifacts.")
+              = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'visibility-of-pipelines'), target: '_blank'
+
+        .form-group
+          .form-check
+            = f.check_box :auto_cancel_pending_pipelines, { class: 'form-check-input' }, 'enabled', 'disabled'
+            = f.label :auto_cancel_pending_pipelines, class: 'form-check-label' do
+              %strong= _("Auto-cancel redundant pipelines")
+            .form-text.text-muted
+              = _("New pipelines cause older pending pipelines on the same branch to be cancelled.")
+              = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'auto-cancel-redundant-pipelines'), target: '_blank'
+
+        .form-group
+          .form-check
+            = f.fields_for :ci_cd_settings_attributes, @project.ci_cd_settings do |form|
+              = form.check_box :forward_deployment_enabled, { class: 'form-check-input' }
+              = form.label :forward_deployment_enabled, class: 'form-check-label' do
+                %strong= _("Skip outdated deployment jobs")
+              .form-text.text-muted
+                = _("When a deployment job is successful, skip older deployment jobs that are still pending.")
+                = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'skip-outdated-deployment-jobs'), target: '_blank'
+
+        .form-group
+          = f.label :ci_config_path, _('CI/CD configuration file'), class: 'label-bold'
+          = f.text_field :ci_config_path, class: 'form-control', placeholder: '.gitlab-ci.yml'
+          %p.form-text.text-muted
+            = html_escape(_("The name of the CI/CD configuration file. A path relative to the root directory is optional (for example %{code_open}my/path/.myfile.yml%{code_close}).")) % { code_open: '<code>'.html_safe, code_close: '</code>'.html_safe }
+            = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'custom-cicd-configuration-path'), target: '_blank'
+
+        %hr
+        .form-group
           %h5.gl-mt-0
-            = _("Git strategy for pipelines")
+            = _("Git strategy")
           %p
-            = html_escape(_("Choose between %{code_open}clone%{code_close} or %{code_open}fetch%{code_close} to get the recent application code")) % { code_open: '<code>'.html_safe, code_close: '</code>'.html_safe }
+            = _("Choose which Git strategy to use when fetching the project.")
             = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'git-strategy'), target: '_blank'
           .form-check
             = f.radio_button :build_allow_git_fetch, 'false', { class: 'form-check-input' }
@@ -15,137 +51,50 @@
               %strong git clone
               %br
               %span
-                = _("Slower but makes sure the project workspace is pristine as it clones the repository from scratch for every job")
+                = _("For each job, clone the repository.")
           .form-check
             = f.radio_button :build_allow_git_fetch, 'true', { class: 'form-check-input' }
             = f.label :build_allow_git_fetch_true, class: 'form-check-label' do
               %strong git fetch
               %br
               %span
-                = _("Faster as it re-uses the project workspace (falling back to clone if it doesn't exist)")
+                = html_escape(_("For each job, re-use the project workspace. If the workspace doesn't exist, use %{code_open}git clone%{code_close}.")) % { code_open: '<code>'.html_safe, code_close: '</code>'.html_safe }
 
-        %hr
         .form-group
           = f.fields_for :ci_cd_settings_attributes, @project.ci_cd_settings do |form|
             = form.label :default_git_depth, _('Git shallow clone'), class: 'label-bold'
-            = form.number_field :default_git_depth, { class: 'form-control', min: 0, max: 1000 }
+            = form.number_field :default_git_depth, { class: 'form-control gl-form-input', min: 0, max: 1000 }
             %p.form-text.text-muted
-              = _('The number of changes to be fetched from GitLab when cloning a repository. This can speed up Pipelines execution. Keep empty or set to 0 to disable shallow clone by default and make GitLab CI fetch all branches and tags each time.')
+              = html_escape(_('The number of changes to fetch from GitLab when cloning a repository. Lower values can speed up pipeline execution. Set to %{code_open}0%{code_close} or blank to fetch all branches and tags for each job')) % { code_open: '<code>'.html_safe, code_close: '</code>'.html_safe }
+              = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'git-shallow-clone'), target: '_blank'
 
         %hr
         .form-group
           = f.label :build_timeout_human_readable, _('Timeout'), class: 'label-bold'
-          = f.text_field :build_timeout_human_readable, class: 'form-control'
+          = f.text_field :build_timeout_human_readable, class: 'form-control gl-form-input'
           %p.form-text.text-muted
-            = _('If any job surpasses this timeout threshold, it will be marked as failed. Human readable time input language is accepted like "1 hour". Values without specification represent seconds.')
+            = html_escape(_('Jobs fail if they run longer than the timeout time. Input value is in seconds by default. Human readable input is also accepted, for example %{code_open}1 hour%{code_close}.')) % { code_open: '<code>'.html_safe, code_close: '</code>'.html_safe }
             = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'timeout'), target: '_blank'
 
         - if can?(current_user, :update_max_artifacts_size, @project)
-          %hr
           .form-group
-            = f.label :max_artifacts_size, _('Maximum artifacts size (MB)'), class: 'label-bold'
-            = f.number_field :max_artifacts_size, class: 'form-control'
+            = f.label :max_artifacts_size, _('Maximum artifacts size'), class: 'label-bold'
+            = f.number_field :max_artifacts_size, class: 'form-control gl-form-input'
             %p.form-text.text-muted
-              = _("Set the maximum file size for each job's artifacts")
+              = _("The maximum file size in megabytes for individual job artifacts.")
               = link_to sprite_icon('question-o'), help_page_path('user/admin_area/settings/continuous_integration', anchor: 'maximum-artifacts-size'), target: '_blank'
 
-        %hr
-        .form-group
-          = f.label :ci_config_path, _('Custom CI configuration path'), class: 'label-bold'
-          = f.text_field :ci_config_path, class: 'form-control', placeholder: '.gitlab-ci.yml'
-          %p.form-text.text-muted
-            = html_escape(_("The path to the CI configuration file. Defaults to %{code_open}.gitlab-ci.yml%{code_close}")) % { code_open: '<code>'.html_safe, code_close: '</code>'.html_safe }
-            = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'custom-ci-configuration-path'), target: '_blank'
-
-        %hr
-        .form-group
-          .form-check
-            = f.check_box :public_builds, { class: 'form-check-input' }
-            = f.label :public_builds, class: 'form-check-label' do
-              %strong= _("Public pipelines")
-            .form-text.text-muted
-              = _("Allow public access to pipelines and job details, including output logs and artifacts")
-              = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'visibility-of-pipelines'), target: '_blank'
-            .bs-callout.bs-callout-info
-              %p #{_("If enabled")}:
-              %ul
-                %li
-                  = _("For public projects, anyone can view pipelines and access job details (output logs and artifacts)")
-                %li
-                  = _("For internal projects, any logged in user except external users can view pipelines and access job details (output logs and artifacts)")
-                %li
-                  = _("For private projects, any member (guest or higher) can view pipelines and access job details (output logs and artifacts)")
-              %p
-                = _("If disabled, the access level will depend on the user's permissions in the project.")
-
-        %hr
-        .form-group
-          .form-check
-            = f.check_box :auto_cancel_pending_pipelines, { class: 'form-check-input' }, 'enabled', 'disabled'
-            = f.label :auto_cancel_pending_pipelines, class: 'form-check-label' do
-              %strong= _("Auto-cancel redundant, pending pipelines")
-            .form-text.text-muted
-              = _("New pipelines will cancel older, pending pipelines on the same branch")
-              = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'auto-cancel-pending-pipelines'), target: '_blank'
-
-        .form-group
-          .form-check
-            = f.fields_for :ci_cd_settings_attributes, @project.ci_cd_settings do |form|
-              = form.check_box :forward_deployment_enabled, { class: 'form-check-input' }
-              = form.label :forward_deployment_enabled, class: 'form-check-label' do
-                %strong= _("Skip outdated deployment jobs")
-              .form-text.text-muted
-                = _("When a deployment job is successful, skip older deployment jobs that are still pending")
-                = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'skip-outdated-deployment-jobs'), target: '_blank'
-
-        %hr
         .form-group
           = f.label :build_coverage_regex, _("Test coverage parsing"), class: 'label-bold'
           .input-group
             %span.input-group-prepend
               .input-group-text /
-            = f.text_field :build_coverage_regex, class: 'form-control', placeholder: 'Regular expression', data: { qa_selector: 'build_coverage_regex_field' }
+            = f.text_field :build_coverage_regex, class: 'form-control gl-form-input', placeholder: 'Regular expression', data: { qa_selector: 'build_coverage_regex_field' }
             %span.input-group-append
               .input-group-text /
           %p.form-text.text-muted
-            = _("A regular expression that will be used to find the test coverage output in the job log. Leave blank to disable")
+            = html_escape(_('The regular expression used to find test coverage output in the job log. For example, use %{regex} for Simplecov (Ruby). Leave blank to disable.')) % { regex: '<code>\(\d+.\d+%\)</code>'.html_safe }
             = link_to sprite_icon('question-o'), help_page_path('ci/pipelines/settings', anchor: 'test-coverage-parsing'), target: '_blank'
-          .bs-callout.bs-callout-info
-            %p= _("Below are examples of regex for existing tools:")
-            %ul
-              %li
-                Simplecov (Ruby) -
-                %code \(\d+.\d+\%\) covered
-              %li
-                pytest-cov (Python) -
-                %code ^TOTAL.+?(\d+\%)$
-              %li
-                Scoverage (Scala) -
-                %code Statement coverage[A-Za-z\.*]\s*:\s*([^%]+)
-              %li
-                phpunit --coverage-text --colors=never (PHP) -
-                %code ^\s*Lines:\s*\d+.\d+\%
-              %li
-                gcovr (C/C++) -
-                %code ^TOTAL.*\s+(\d+\%)$
-              %li
-                tap --coverage-report=text-summary (NodeJS) -
-                %code ^Statements\s*:\s*([^%]+)
-              %li
-                nyc npm test (NodeJS) -
-                %code All files[^|]*\|[^|]*\s+([\d\.]+)
-              %li
-                excoveralls (Elixir) -
-                %code \[TOTAL\]\s+(\d+\.\d+)%
-              %li
-                mix test --cover (Elixir) -
-                %code \d+.\d+\%\s+\|\s+Total
-              %li
-                JaCoCo (Java/Kotlin)
-                %code Total.*?([0-9]{1,3})%
-              %li
-                go test -cover (Go)
-                %code coverage: \d+.\d+% of statements
 
         = f.submit _('Save changes'), class: "btn btn-success", data: { qa_selector: 'save_general_pipelines_changes_button' }
 
diff --git a/app/views/projects/settings/ci_cd/show.html.haml b/app/views/projects/settings/ci_cd/show.html.haml
index 55b6cf372fb..baf80c0a103 100644
--- a/app/views/projects/settings/ci_cd/show.html.haml
+++ b/app/views/projects/settings/ci_cd/show.html.haml
@@ -12,7 +12,7 @@
     %button.btn.js-settings-toggle{ type: 'button' }
       = expanded ? _('Collapse') : _('Expand')
     %p
-      = _("Customize your pipeline configuration, view your pipeline status and coverage report.")
+      = _("Customize your pipeline configuration and coverage report.")
   .settings-content
     = render 'form'
 
@@ -41,7 +41,7 @@
       = expanded ? _('Collapse') : _('Expand')
     %p
       = _("Runners are processes that pick up and execute CI/CD jobs for GitLab.")
-      = link_to s_('How do I configure runners?'), help_page_path('ci/runners/README')
+      = link_to s_('How do I configure runners?'), help_page_path('ci/runners/README'), target: '_blank', rel: 'noopener noreferrer'
   .settings-content
     = render 'projects/runners/index'
 
@@ -69,7 +69,8 @@
     %button.btn.js-settings-toggle{ type: 'button' }
       = expanded ? _('Collapse') : _('Expand')
     %p
-      = _("Triggers can force a specific branch or tag to get rebuilt with an API call. These tokens will impersonate their associated user including their access to projects and their project permissions.")
+      = _("Trigger a pipeline for a branch or tag by generating a trigger token and using it with an API call. The token impersonates a user's project access and permissions.")
+      = link_to _('Learn more.'), help_page_path('ci/triggers/README'), target: '_blank', rel: 'noopener noreferrer'
   .settings-content
     = render 'projects/triggers/index'
 
@@ -82,7 +83,7 @@
         = expanded ? _('Collapse') : _('Expand')
       %p
         = _("Save space and find images in the Container Registry. Remove unneeded tags and keep only the ones you want.")
-        = link_to _('How does cleanup work?'), help_page_path('user/packages/container_registry/index', anchor: 'cleanup-policy', target: '_blank', rel: 'noopener noreferrer')
+        = link_to _('How does cleanup work?'), help_page_path('user/packages/container_registry/index', anchor: 'cleanup-policy'), target: '_blank', rel: 'noopener noreferrer'
     .settings-content
       = render 'projects/registry/settings/index'
 
@@ -98,11 +99,11 @@
       %p
         - freeze_period_docs = help_page_path('user/project/releases/index', anchor: 'prevent-unintentional-releases-by-setting-a-deploy-freeze')
         - freeze_period_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: freeze_period_docs }
-        = html_escape(s_('DeployFreeze|Specify times when deployments are not allowed for an environment. The %{filename} file must be updated to make deployment jobs aware of the %{freeze_period_link_start}freeze period%{freeze_period_link_end}.')) % { freeze_period_link_start: freeze_period_link_start, freeze_period_link_end: '</a>'.html_safe, filename: tag.code('gitlab-ci.yml') }
+        = html_escape(s_('DeployFreeze|Add a freeze period to prevent unintended releases during a period of time for a given environment. You must update the deployment jobs in %{filename} according to the deploy freezes added here. %{freeze_period_link_start}Learn more.%{freeze_period_link_end}')) % { freeze_period_link_start: freeze_period_link_start, freeze_period_link_end: '</a>'.html_safe, filename: tag.code('.gitlab-ci.yml') }
 
         - cron_syntax_url = 'https://crontab.guru/'
         - cron_syntax_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: cron_syntax_url }
-        = s_('DeployFreeze|You can specify deploy freezes using only %{cron_syntax_link_start}cron syntax%{cron_syntax_link_end}.').html_safe % { cron_syntax_link_start: cron_syntax_link_start, cron_syntax_link_end: "</a>".html_safe }
+        = s_('DeployFreeze|Specify deploy freezes using %{cron_syntax_link_start}cron syntax%{cron_syntax_link_end}.').html_safe % { cron_syntax_link_start: cron_syntax_link_start, cron_syntax_link_end: "</a>".html_safe }
 
     .settings-content
       = render 'ci/deploy_freeze/index'
diff --git a/app/views/projects/settings/integrations/show.html.haml b/app/views/projects/settings/integrations/show.html.haml
index 18c6cb31874..3f5fd765b11 100644
--- a/app/views/projects/settings/integrations/show.html.haml
+++ b/app/views/projects/settings/integrations/show.html.haml
@@ -10,7 +10,7 @@
     .gl-alert-body
       = _('Webhooks have moved. They can now be found under the Settings menu.')
     .gl-alert-actions
-      = link_to _('Go to Webhooks'), project_hooks_path(@project), class: 'btn gl-alert-action btn-info new-gl-button'
+      = link_to _('Go to Webhooks'), project_hooks_path(@project), class: 'gl-button btn gl-alert-action btn-info'
 
 %h4= _('Integrations')
 - integrations_link_start = '<a href="%{url}">'.html_safe % { url: help_page_url('user/project/integrations/overview') }
diff --git a/app/views/projects/settings/operations/_alert_management.html.haml b/app/views/projects/settings/operations/_alert_management.html.haml
index 46f45df00df..079812f7077 100644
--- a/app/views/projects/settings/operations/_alert_management.html.haml
+++ b/app/views/projects/settings/operations/_alert_management.html.haml
@@ -5,7 +5,7 @@
 
 %section.settings.no-animate#js-alert-management-settings{ class: ('expanded' if expanded) }
   .settings-header
-    %h3{ :class => "h4" }
+    %h4
       = _('Alerts')
     %button.btn.js-settings-toggle{ type: 'button' }
       = _('Expand')
diff --git a/app/views/projects/settings/operations/_error_tracking.html.haml b/app/views/projects/settings/operations/_error_tracking.html.haml
index 6ab8beff99f..fe302978da6 100644
--- a/app/views/projects/settings/operations/_error_tracking.html.haml
+++ b/app/views/projects/settings/operations/_error_tracking.html.haml
@@ -4,7 +4,7 @@
 
 %section.settings.no-animate.js-error-tracking-settings
   .settings-header
-    %h3{ :class => "h4" }
+    %h4
       = _('Error tracking')
     %button.btn.js-settings-toggle{ type: 'button' }
       = _('Expand')
diff --git a/app/views/projects/settings/operations/_tracing.html.haml b/app/views/projects/settings/operations/_tracing.html.haml
index f654c723e36..03970dfe0b9 100644
--- a/app/views/projects/settings/operations/_tracing.html.haml
+++ b/app/views/projects/settings/operations/_tracing.html.haml
@@ -3,7 +3,7 @@
 
 %section.settings.border-0.no-animate
   .settings-header{ :class => "border-top" }
-    %h3{ :class => "h4" }
+    %h4
       = _("Jaeger tracing")
     %button.btn.gl-button.js-settings-toggle{ type: 'button' }
       = _('Expand')
@@ -24,7 +24,7 @@
       .form-group
         = f.fields_for :tracing_setting_attributes, setting do |form|
           = form.label :external_url, _('Jaeger URL'), class: 'label-bold'
-          = form.url_field :external_url, class: 'form-control', placeholder: 'e.g. https://jaeger.mycompany.com'
+          = form.url_field :external_url, class: 'form-control gl-form-input', placeholder: 'e.g. https://jaeger.mycompany.com'
           %p.form-text.text-muted
             - jaeger_help_url = "https://www.jaegertracing.io/docs/1.7/getting-started/"
             - link_start_tag = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: jaeger_help_url }
diff --git a/app/views/projects/settings/repository/show.html.haml b/app/views/projects/settings/repository/show.html.haml
index 24fc137fd29..8ac22e1c325 100644
--- a/app/views/projects/settings/repository/show.html.haml
+++ b/app/views/projects/settings/repository/show.html.haml
@@ -1,7 +1,7 @@
 - breadcrumb_title _("Repository Settings")
 - page_title _("Repository")
 - @content_class = "limit-container-width" unless fluid_layout
-- deploy_token_description = s_('DeployTokens|Deploy tokens allow access to packages, your repository, and registry images.')
+- deploy_token_description = s_('DeployTokens|Deploy Tokens allow access to packages, your repository, and registry images.')
 
 = render "projects/default_branch/show"
 = render_if_exists "projects/push_rules/index"
diff --git a/app/views/projects/show.html.haml b/app/views/projects/show.html.haml
index 40faf91eadf..e1774c955bc 100644
--- a/app/views/projects/show.html.haml
+++ b/app/views/projects/show.html.haml
@@ -6,6 +6,9 @@
 = content_for :meta_tags do
   = auto_discovery_link_tag(:atom, project_path(@project, rss_url_options), title: "#{@project.name} activity")
 
+= content_for :invite_members_sidebar do
+  = render partial: 'projects/invite_members_link'
+
 = render partial: 'flash_messages', locals: { project: @project }
 
 = render "projects/last_push"
diff --git a/app/views/projects/tags/_tag.html.haml b/app/views/projects/tags/_tag.html.haml
index 9d4e5d629f4..61b357831fd 100644
--- a/app/views/projects/tags/_tag.html.haml
+++ b/app/views/projects/tags/_tag.html.haml
@@ -41,6 +41,6 @@
     = render 'projects/buttons/download', project: @project, ref: tag.name, pipeline: @tags_pipelines[tag.name]
 
     - if can?(current_user, :admin_tag, @project)
-      = link_to edit_project_tag_release_path(@project, tag.name), class: 'btn btn-edit has-tooltip', title: s_('TagsPage|Edit release notes'), data: { container: "body" } do
+      = link_to edit_project_tag_release_path(@project, tag.name), class: 'btn gl-button btn-default btn-icon btn-edit has-tooltip', title: s_('TagsPage|Edit release notes'), data: { container: "body" } do
         = sprite_icon("pencil")
       = render 'projects/buttons/remove_tag', project: @project, tag: tag
diff --git a/app/views/projects/tags/index.html.haml b/app/views/projects/tags/index.html.haml
index 2fe5c5888f5..04d8c1f42bc 100644
--- a/app/views/projects/tags/index.html.haml
+++ b/app/views/projects/tags/index.html.haml
@@ -24,9 +24,9 @@
             %li
               = link_to title, filter_tags_path(sort: value), class: ("is-active" if @sort == value)
       - if can?(current_user, :admin_tag, @project)
-        = link_to new_project_tag_path(@project), class: 'btn btn-success new-tag-btn', data: { qa_selector: "new_tag_button" } do
+        = link_to new_project_tag_path(@project), class: 'btn gl-button btn-success', data: { qa_selector: "new_tag_button" } do
           = s_('TagsPage|New tag')
-      = link_to project_tags_path(@project, rss_url_options), title: _("Tags feed"), class: 'btn btn-svg d-none d-sm-inline-block has-tooltip' do
+      = link_to project_tags_path(@project, rss_url_options), title: _("Tags feed"), class: 'btn gl-button btn-default btn-icon d-none d-sm-inline-block has-tooltip' do
         = sprite_icon('rss', css_class: 'qa-rss-icon')
 
   = render_if_exists 'projects/commits/mirror_status'
diff --git a/app/views/projects/tags/releases/edit.html.haml b/app/views/projects/tags/releases/edit.html.haml
index 896dbe454e6..d82c89a3f9f 100644
--- a/app/views/projects/tags/releases/edit.html.haml
+++ b/app/views/projects/tags/releases/edit.html.haml
@@ -15,5 +15,5 @@
     = render 'shared/notes/hints'
   .error-alert
   .gl-mt-3
-    = f.submit 'Save changes', class: 'btn btn-success'
-    = link_to "Cancel", project_tag_path(@project, @tag.name), class: "btn btn-default btn-cancel"
+    = f.submit 'Save changes', class: 'btn gl-button btn-success'
+    = link_to "Cancel", project_tag_path(@project, @tag.name), class: "btn gl-button btn-default btn-cancel"
diff --git a/app/views/projects/tags/show.html.haml b/app/views/projects/tags/show.html.haml
index d726d2ab233..b3a75494ccc 100644
--- a/app/views/projects/tags/show.html.haml
+++ b/app/views/projects/tags/show.html.haml
@@ -42,13 +42,13 @@
     - if @tag.has_signature?
       = render partial: 'projects/commit/signature', object: @tag.signature
     - if can?(current_user, :admin_tag, @project)
-      = link_to edit_project_tag_release_path(@project, @tag.name), class: 'btn btn-icon btn-edit gl-button controls-item has-tooltip', title: s_('TagsPage|Edit release notes') do
+      = link_to edit_project_tag_release_path(@project, @tag.name), class: 'btn btn-icon btn-edit gl-button btn-default controls-item has-tooltip', title: s_('TagsPage|Edit release notes') do
         = sprite_icon("pencil", css_class: 'gl-icon')
-    = link_to project_tree_path(@project, @tag.name), class: 'btn btn-icon gl-button controls-item has-tooltip', title: s_('TagsPage|Browse files') do
+    = link_to project_tree_path(@project, @tag.name), class: 'btn btn-icon gl-button btn-default controls-item has-tooltip', title: s_('TagsPage|Browse files') do
       = sprite_icon('folder-open', css_class: 'gl-icon')
-    = link_to project_commits_path(@project, @tag.name), class: 'btn btn-icon gl-button controls-item has-tooltip', title: s_('TagsPage|Browse commits') do
+    = link_to project_commits_path(@project, @tag.name), class: 'btn btn-icon gl-button btn-default controls-item has-tooltip', title: s_('TagsPage|Browse commits') do
       = sprite_icon('history', css_class: 'gl-icon')
-    .btn-container.controls-item
+    .controls-item
       = render 'projects/buttons/download', project: @project, ref: @tag.name
     - if can?(current_user, :admin_tag, @project)
       .btn-container.controls-item-full
diff --git a/app/views/projects/tree/_readme.html.haml b/app/views/projects/tree/_readme.html.haml
deleted file mode 100644
index 6d2bdda8254..00000000000
--- a/app/views/projects/tree/_readme.html.haml
+++ /dev/null
@@ -1,10 +0,0 @@
-- if readme.rich_viewer
-  %article.file-holder.readme-holder{ id: 'readme', class: [("limited-width-container" unless fluid_layout)] }
-    .js-file-title.file-title-flex-parent
-      .file-header-content
-        = blob_icon readme.mode, readme.name
-        = link_to project_blob_path(@project, tree_join(@ref, readme.path)) do
-          %strong
-            = readme.name
-
-    = render 'projects/blob/viewer', viewer: readme.rich_viewer, viewer_url: project_blob_path(@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
deleted file mode 100644
index a4427c6eedb..00000000000
--- a/app/views/projects/tree/_tree_content.html.haml
+++ /dev/null
@@ -1,24 +0,0 @@
-.tree-content-holder.js-tree-content{ data: tree_content_data(@logs_path, @project, @path) }
-  .table-holder.bordered-box
-    %table.table#tree-slider{ class: "table_#{@hex_path} tree-table" }
-      %thead
-        %tr
-          %th= s_('ProjectFileTree|Name')
-          %th.d-none.d-sm-table-cell
-            .float-left= _('Last commit')
-          %th.text-right= _('Last update')
-      - if @path.present?
-        %tr.tree-item
-          %td.tree-item-file-name
-            = link_to "..", project_tree_path(@project, up_dir_path), class: 'gl-ml-3'
-          %td
-          %td.d-none.d-sm-table-cell
-
-      = render_tree(tree)
-
-  - if tree.readme
-    = render "projects/tree/readme", readme: tree.readme
-
-- if can_edit_tree?
-  = render 'projects/blob/upload', title: _('Upload New File'), placeholder: _('Upload New File'), button_title: _('Upload file'), form_path: project_create_blob_path(@project, @id), method: :post
-  = render 'projects/blob/new_dir'
diff --git a/app/views/projects/tree/_tree_row.html.haml b/app/views/projects/tree/_tree_row.html.haml
deleted file mode 100644
index 04496914c02..00000000000
--- a/app/views/projects/tree/_tree_row.html.haml
+++ /dev/null
@@ -1,27 +0,0 @@
-- tree_row_name = tree_row.name
-- tree_row_type = tree_row.type
-
-%tr{ class: "tree-item file_#{hexdigest(tree_row_name)}" }
-  %td.tree-item-file-name
-    - if tree_row_type == :tree
-      = tree_icon('folder', tree_row.mode, tree_row.name)
-      - path = flatten_tree(@path, tree_row)
-      %a.str-truncated{ href: fast_project_tree_path(@project, tree_join(@id || @commit.id, path)), title: path }
-        %span= path
-
-    - elsif tree_row_type == :blob
-      = tree_icon('file', tree_row.mode, tree_row_name)
-      %a.str-truncated{ href: fast_project_blob_path(@project, tree_join(@id || @commit.id, tree_row_name)), title: tree_row_name }
-        %span= tree_row_name
-      - if @lfs_blob_ids.include?(tree_row.id)
-        %span.badge.label-lfs.gl-ml-2 LFS
-
-    - elsif tree_row_type == :commit
-      = tree_icon('archive', tree_row.mode, tree_row.name)
-      = submodule_link(tree_row, @ref)
-
-  %td.d-none.d-sm-table-cell.tree-commit
-  %td.tree-time-ago.text-right
-    %span.log_loading.hide
-      = loading_icon
-      Loading commit data...
diff --git a/app/views/projects/tree/_truncated_notice_tree_row.html.haml b/app/views/projects/tree/_truncated_notice_tree_row.html.haml
deleted file mode 100644
index a03e0a549ee..00000000000
--- a/app/views/projects/tree/_truncated_notice_tree_row.html.haml
+++ /dev/null
@@ -1,7 +0,0 @@
-%tr.tree-truncated-warning
-  %td{ colspan: '3' }
-    = sprite_icon('warning-solid')
-    %span
-      Too many items to show. To preserve performance only
-      %strong #{number_with_delimiter(limit)} of #{number_with_delimiter(total)}
-      items are displayed.
diff --git a/app/views/projects/triggers/_form.html.haml b/app/views/projects/triggers/_form.html.haml
index dec71cdb56a..1dbf8addb57 100644
--- a/app/views/projects/triggers/_form.html.haml
+++ b/app/views/projects/triggers/_form.html.haml
@@ -7,5 +7,5 @@
       %p.form-control-plaintext= @trigger.token
   .form-group
     = f.label :key, "Description", class: "label-bold"
-    = f.text_field :description, class: "form-control", required: true, title: 'Trigger description is required.', placeholder: "Trigger description"
+    = f.text_field :description, class: 'form-control gl-form-input', required: true, title: 'Trigger description is required.', placeholder: "Trigger description"
   = f.submit btn_text, class: "btn btn-success"
diff --git a/app/views/projects/triggers/_index.html.haml b/app/views/projects/triggers/_index.html.haml
index 4f39c839630..c7cb051e40d 100644
--- a/app/views/projects/triggers/_index.html.haml
+++ b/app/views/projects/triggers/_index.html.haml
@@ -2,7 +2,7 @@
   .col-lg-12
     .card
       .card-header
-        Manage your project's triggers
+        = s_("Manage your project's triggers")
       .card-body
         = render "projects/triggers/form", btn_text: "Add trigger"
         %hr
@@ -14,39 +14,33 @@
               %table.table
                 %thead
                   %th
-                    %strong Token
+                    %strong
+                    = s_("Token")
                   %th
-                    %strong Description
+                    %strong
+                    = s_("Description")
                   %th
-                    %strong Owner
+                    %strong
+                    = s_("Owner")
                   %th
-                    %strong Last used
+                    %strong
+                    = s_("Last used")
                   %th
                 = render partial: 'projects/triggers/trigger', collection: @triggers, as: :trigger
           - else
             %p.settings-message.text-center.gl-mb-3{ data: { testid: 'no_triggers_content' } }
-              No triggers have been created yet. Add one using the form above.
+              = s_("No triggers exist yet. Use the form above to create one.")
 
       .card-footer
 
         %p
-          In the following examples, you can see the exact API call you need to
-          make in order to rebuild a specific
-          %code ref
-          (branch or tag) with a trigger token.
-        %p
-          All you need to do is replace the
-          %code TOKEN
-          and
-          %code REF_NAME
-          with the trigger token and the branch or tag name respectively.
-
-        %h5.gl-mt-3
-          Use cURL
+          = s_("These examples show how to trigger this project's pipeline for a branch or tag.")
 
         %p.light
-          Copy one of the tokens above, set your branch or tag name, and that
-          reference will be rebuilt.
+          = s_("Triggers|In each example, replace %{code_start}TOKEN%{code_end} with the trigger token you generated and replace %{code_start}REF_NAME%{code_end} with the branch or tag name.").html_safe % { code_start: "<code>".html_safe, code_end: "</code>".html_safe }
+
+        %h5.gl-mt-3
+          = s_("Use cURL")
 
         %pre
           :plain
@@ -55,39 +49,26 @@
                  -F ref=REF_NAME \
                  #{builds_trigger_url(@project.id)}
         %h5.gl-mt-3
-          Use .gitlab-ci.yml
-
-        %p.light
-          In the
-          %code .gitlab-ci.yml
-          of another project, include the following snippet.
-          The project will be rebuilt at the end of the pipeline.
+          = s_("Use .gitlab-ci.yml")
 
         %pre
           :plain
-            trigger_build:
-              stage: deploy
-              script:
-                - "curl -X POST -F token=TOKEN -F ref=REF_NAME #{builds_trigger_url(@project.id)}"
+            script:
+              - "curl -X POST -F token=TOKEN -F ref=REF_NAME #{builds_trigger_url(@project.id)}"
         %h5.gl-mt-3
-          Use webhook
-
-        %p.light
-          Add the following webhook to another project for Push and Tag push events.
-          The project will be rebuilt at the corresponding event.
+          = s_("Use webhook")
 
         %pre
           :plain
-             #{builds_trigger_url(@project.id, ref: 'REF_NAME')}?token=TOKEN
+            #{builds_trigger_url(@project.id, ref: 'REF_NAME')}?token=TOKEN
         %h5.gl-mt-3
-          Pass job variables
+          = s_("Pass job variables")
 
         %p.light
-          Add
-          %code variables[VARIABLE]=VALUE
-          to an API request. Variable values can be used to distinguish between triggered pipelines and normal pipelines.
+          = s_("Triggers|To pass variables to the triggered pipeline, add %{code_start}variables[VARIABLE]=VALUE%{code_end} to the API request.").html_safe % { code_start: "<code>".html_safe, code_end: "</code>".html_safe }
 
-          With cURL:
+        %p.light
+          = s_("cURL:")
 
         %pre
           :plain
@@ -97,8 +78,8 @@
                  -F "variables[RUN_NIGHTLY_BUILD]=true" \
                  #{builds_trigger_url(@project.id)}
         %p.light
-          With webhook:
+          = s_("Webhook:")
 
         %pre.gl-mb-0
           :plain
-             #{builds_trigger_url(@project.id, ref: 'REF_NAME')}?token=TOKEN&variables[RUN_NIGHTLY_BUILD]=true
+            #{builds_trigger_url(@project.id, ref: 'REF_NAME')}?token=TOKEN&variables[RUN_NIGHTLY_BUILD]=true