Merge remote-tracking branch 'upstream/master' into no-ivar-in-modules

* upstream/master: (507 commits)
  Add dropdowns documentation
  Convert migration to populate latest merge request ID into a background migration
  Set 0.69.0 instead of latest for codeclimate image
  De-duplicate background migration matchers defined in spec/support/migrations_helpers.rb
  Update database_debugging.md
  Update database_debugging.md
  Move installation of apps higher
  Change to Google Kubernetes Cluster and add internal links
  Add Ingress description from official docs
  Add info on creating your own k8s cluster from the cluster page
  Add info about the installed apps in the Cluster docs
  Resolve "lock/confidential issuable sidebar custom svg icons iteration"
  Update HA README.md to clarify GitLab support does not troubleshoot DRBD.
  Update license_finder to 3.1.1
  Make sure NotesActions#noteable returns a Noteable in the update action
  Cache the number of user SSH keys
  Adjust openid_connect_spec to use `raise_error`
  Resolve "Clicking on GPG verification badge jumps to top of the page"
  Add changelog for container repository path update
  Update container repository path reference
  ...

344 files changed, 6110 insertions, 3379 deletions

diff --git a/app/assets/images/emoji.png b/app/assets/images/emoji.png
index 5dcd9c09b70..723c2c3f4c8 100644
--- a/app/assets/images/emoji.png
+++ b/app/assets/images/emoji.png
diff --git a/app/assets/images/emoji/gay_pride_flag.png b/app/assets/images/emoji/gay_pride_flag.png
new file mode 100644
index 00000000000..1bec5f2ffd7
--- /dev/null
+++ b/app/assets/images/emoji/gay_pride_flag.png
diff --git a/app/assets/images/emoji/mrs_claus.png b/app/assets/images/emoji/mrs_claus.png
index 078f0657f95..9cf2458df1a 100644
--- a/app/assets/images/emoji/mrs_claus.png
+++ b/app/assets/images/emoji/mrs_claus.png
diff --git a/app/assets/images/emoji/speech_left.png b/app/assets/images/emoji/speech_left.png
new file mode 100644
index 00000000000..00c05959bcd
--- /dev/null
+++ b/app/assets/images/emoji/speech_left.png
diff --git a/app/assets/images/emoji@2x.png b/app/assets/images/emoji@2x.png
index b0fa9e1139e..987279c13cc 100644
--- a/app/assets/images/emoji@2x.png
+++ b/app/assets/images/emoji@2x.png
diff --git a/app/assets/javascripts/abuse_reports.js b/app/assets/javascripts/abuse_reports.js
index 3de192d56eb..d2d3a257c0d 100644
--- a/app/assets/javascripts/abuse_reports.js
+++ b/app/assets/javascripts/abuse_reports.js
@@ -1,3 +1,5 @@
+import { truncate } from './lib/utils/text_utility';
+
 const MAX_MESSAGE_LENGTH = 500;
 const MESSAGE_CELL_SELECTOR = '.abuse-reports .message';
 
@@ -15,7 +17,7 @@ export default class AbuseReports {
     if (reportMessage.length > MAX_MESSAGE_LENGTH) {
       $messageCellElement.data('original-message', reportMessage);
       $messageCellElement.data('message-truncated', 'true');
-      $messageCellElement.text(window.gl.text.truncate(reportMessage, MAX_MESSAGE_LENGTH));
+      $messageCellElement.text(truncate(reportMessage, MAX_MESSAGE_LENGTH));
     }
   }
 
diff --git a/app/assets/javascripts/copy_as_gfm.js b/app/assets/javascripts/behaviors/copy_as_gfm.js
index 93b0cbf4209..e7dc4ef8304 100644
--- a/app/assets/javascripts/copy_as_gfm.js
+++ b/app/assets/javascripts/behaviors/copy_as_gfm.js
@@ -1,7 +1,8 @@
 /* eslint-disable class-methods-use-this, object-shorthand, no-unused-vars, no-use-before-define, no-new, max-len, no-restricted-syntax, guard-for-in, no-continue */
+
 import _ from 'underscore';
-import { insertText, getSelectedFragment, nodeMatchesSelector } from './lib/utils/common_utils';
-import { placeholderImage } from './lazy_loader';
+import { insertText, getSelectedFragment, nodeMatchesSelector } from '../lib/utils/common_utils';
+import { placeholderImage } from '../lazy_loader';
 
 const gfmRules = {
   // The filters referenced in lib/banzai/pipeline/gfm_pipeline.rb convert
@@ -284,7 +285,7 @@ const gfmRules = {
   },
 };
 
-class CopyAsGFM {
+export class CopyAsGFM {
   constructor() {
     $(document).on('copy', '.md, .wiki', (e) => { CopyAsGFM.copyAsGFM(e, CopyAsGFM.transformGFMSelection); });
     $(document).on('copy', 'pre.code.highlight, .diff-content .line_content', (e) => { CopyAsGFM.copyAsGFM(e, CopyAsGFM.transformCodeSelection); });
@@ -469,7 +470,12 @@ class CopyAsGFM {
   }
 }
 
-window.gl = window.gl || {};
-window.gl.CopyAsGFM = CopyAsGFM;
+// Export CopyAsGFM as a global for rspec to access
+// see /spec/features/copy_as_gfm_spec.rb
+if (process.env.NODE_ENV !== 'production') {
+  window.CopyAsGFM = CopyAsGFM;
+}
 
-new CopyAsGFM();
+export default function initCopyAsGFM() {
+  return new CopyAsGFM();
+}
diff --git a/app/assets/javascripts/behaviors/index.js b/app/assets/javascripts/behaviors/index.js
index 44b2c974b9e..671532394a9 100644
--- a/app/assets/javascripts/behaviors/index.js
+++ b/app/assets/javascripts/behaviors/index.js
@@ -1,5 +1,6 @@
 import './autosize';
 import './bind_in_out';
+import initCopyAsGFM from './copy_as_gfm';
 import './details_behavior';
 import installGlEmojiElement from './gl_emoji';
 import './quick_submit';
@@ -7,3 +8,4 @@ import './requires_input';
 import './toggler_behavior';
 
 installGlEmojiElement();
+initCopyAsGFM();
diff --git a/app/assets/javascripts/boards/components/modal/footer.js b/app/assets/javascripts/boards/components/modal/footer.js
index de9e44cef35..182957113a2 100644
--- a/app/assets/javascripts/boards/components/modal/footer.js
+++ b/app/assets/javascripts/boards/components/modal/footer.js
@@ -3,6 +3,7 @@
 import Vue from 'vue';
 import Flash from '../../../flash';
 import './lists_dropdown';
+import { pluralize } from '../../../lib/utils/text_utility';
 
 const ModalStore = gl.issueBoards.ModalStore;
 
@@ -21,7 +22,7 @@ gl.issueBoards.ModalFooter = Vue.extend({
     submitText() {
       const count = ModalStore.selectedCount();
 
-      return `Add ${count > 0 ? count : ''} ${gl.text.pluralize('issue', count)}`;
+      return `Add ${count > 0 ? count : ''} ${pluralize('issue', count)}`;
     },
   },
   methods: {
diff --git a/app/assets/javascripts/boards/filtered_search_boards.js b/app/assets/javascripts/boards/filtered_search_boards.js
index 3f083655f95..184665f395c 100644
--- a/app/assets/javascripts/boards/filtered_search_boards.js
+++ b/app/assets/javascripts/boards/filtered_search_boards.js
@@ -11,7 +11,8 @@ export default class FilteredSearchBoards extends gl.FilteredSearchManager {
     // Issue boards is slightly different, we handle all the requests async
     // instead or reloading the page, we just re-fire the list ajax requests
     this.isHandledAsync = true;
-    this.cantEdit = cantEdit;
+    this.cantEdit = cantEdit.filter(i => typeof i === 'string');
+    this.cantEditWithValue = cantEdit.filter(i => typeof i === 'object');
   }
 
   updateObject(path) {
@@ -42,7 +43,9 @@ export default class FilteredSearchBoards extends gl.FilteredSearchManager {
     this.filteredSearchInput.dispatchEvent(new Event('input'));
   }
 
-  canEdit(tokenName) {
-    return this.cantEdit.indexOf(tokenName) === -1;
+  canEdit(tokenName, tokenValue) {
+    if (this.cantEdit.includes(tokenName)) return false;
+    return this.cantEditWithValue.findIndex(token => token.name === tokenName &&
+      token.value === tokenValue) === -1;
   }
 }
diff --git a/app/assets/javascripts/boards/stores/boards_store.js b/app/assets/javascripts/boards/stores/boards_store.js
index ea82958e80d..798d7e0d147 100644
--- a/app/assets/javascripts/boards/stores/boards_store.js
+++ b/app/assets/javascripts/boards/stores/boards_store.js
@@ -14,16 +14,18 @@ gl.issueBoards.BoardsStore = {
   },
   state: {},
   detail: {
-    issue: {}
+    issue: {},
   },
   moving: {
     issue: {},
-    list: {}
+    list: {},
   },
   create () {
     this.state.lists = [];
     this.filter.path = getUrlParamsArray().join('&');
-    this.detail = { issue: {} };
+    this.detail = {
+      issue: {},
+    };
   },
   addList (listObj, defaultAvatar) {
     const list = new List(listObj, defaultAvatar);
diff --git a/app/assets/javascripts/clusters.js b/app/assets/javascripts/clusters.js
deleted file mode 100644
index c9fef94efea..00000000000
--- a/app/assets/javascripts/clusters.js
+++ /dev/null
@@ -1,123 +0,0 @@
-/* globals Flash */
-import Visibility from 'visibilityjs';
-import axios from 'axios';
-import setAxiosCsrfToken from './lib/utils/axios_utils';
-import Poll from './lib/utils/poll';
-import { s__ } from './locale';
-import initSettingsPanels from './settings_panels';
-import Flash from './flash';
-
-/**
- * Cluster page has 2 separate parts:
- *   Toggle button
- *
- * - Polling status while creating or scheduled
- * -- Update status area with the response result
- */
-
-class ClusterService {
-  constructor(options = {}) {
-    this.options = options;
-    setAxiosCsrfToken();
-  }
-  fetchData() {
-    return axios.get(this.options.endpoint);
-  }
-}
-
-export default class Clusters {
-  constructor() {
-    initSettingsPanels();
-
-    const dataset = document.querySelector('.js-edit-cluster-form').dataset;
-
-    this.state = {
-      statusPath: dataset.statusPath,
-      clusterStatus: dataset.clusterStatus,
-      clusterStatusReason: dataset.clusterStatusReason,
-      toggleStatus: dataset.toggleStatus,
-    };
-
-    this.service = new ClusterService({ endpoint: this.state.statusPath });
-    this.toggleButton = document.querySelector('.js-toggle-cluster');
-    this.toggleInput = document.querySelector('.js-toggle-input');
-    this.errorContainer = document.querySelector('.js-cluster-error');
-    this.successContainer = document.querySelector('.js-cluster-success');
-    this.creatingContainer = document.querySelector('.js-cluster-creating');
-    this.errorReasonContainer = this.errorContainer.querySelector('.js-error-reason');
-
-    this.toggleButton.addEventListener('click', this.toggle.bind(this));
-
-    if (this.state.clusterStatus !== 'created') {
-      this.updateContainer(this.state.clusterStatus, this.state.clusterStatusReason);
-    }
-
-    if (this.state.statusPath) {
-      this.initPolling();
-    }
-  }
-
-  toggle() {
-    this.toggleButton.classList.toggle('checked');
-    this.toggleInput.setAttribute('value', this.toggleButton.classList.contains('checked').toString());
-  }
-
-  initPolling() {
-    this.poll = new Poll({
-      resource: this.service,
-      method: 'fetchData',
-      successCallback: data => this.handleSuccess(data),
-      errorCallback: () => Clusters.handleError(),
-    });
-
-    if (!Visibility.hidden()) {
-      this.poll.makeRequest();
-    } else {
-      this.service.fetchData()
-        .then(data => this.handleSuccess(data))
-        .catch(() => Clusters.handleError());
-    }
-
-    Visibility.change(() => {
-      if (!Visibility.hidden()) {
-        this.poll.restart();
-      } else {
-        this.poll.stop();
-      }
-    });
-  }
-
-  static handleError() {
-    Flash(s__('ClusterIntegration|Something went wrong on our end.'));
-  }
-
-  handleSuccess(data) {
-    const { status, status_reason } = data.data;
-    this.updateContainer(status, status_reason);
-  }
-
-  hideAll() {
-    this.errorContainer.classList.add('hidden');
-    this.successContainer.classList.add('hidden');
-    this.creatingContainer.classList.add('hidden');
-  }
-
-  updateContainer(status, error) {
-    this.hideAll();
-    switch (status) {
-      case 'created':
-        this.successContainer.classList.remove('hidden');
-        break;
-      case 'errored':
-        this.errorContainer.classList.remove('hidden');
-        this.errorReasonContainer.textContent = error;
-        break;
-      case 'scheduled':
-      case 'creating':
-        this.creatingContainer.classList.remove('hidden');
-        break;
-      default:
-        this.hideAll();
-    }
-  }
-}
diff --git a/app/assets/javascripts/clusters/clusters_bundle.js b/app/assets/javascripts/clusters/clusters_bundle.js
new file mode 100644
index 00000000000..dc443475952
--- /dev/null
+++ b/app/assets/javascripts/clusters/clusters_bundle.js
@@ -0,0 +1,221 @@
+import Visibility from 'visibilityjs';
+import Vue from 'vue';
+import { s__, sprintf } from '../locale';
+import Flash from '../flash';
+import Poll from '../lib/utils/poll';
+import initSettingsPanels from '../settings_panels';
+import eventHub from './event_hub';
+import {
+  APPLICATION_INSTALLED,
+  REQUEST_LOADING,
+  REQUEST_SUCCESS,
+  REQUEST_FAILURE,
+} from './constants';
+import ClustersService from './services/clusters_service';
+import ClustersStore from './stores/clusters_store';
+import applications from './components/applications.vue';
+
+/**
+ * Cluster page has 2 separate parts:
+ * Toggle button and applications section
+ *
+ * - Polling status while creating or scheduled
+ * - Update status area with the response result
+ */
+
+export default class Clusters {
+  constructor() {
+    const {
+      statusPath,
+      installHelmPath,
+      installIngressPath,
+      installRunnerPath,
+      clusterStatus,
+      clusterStatusReason,
+      helpPath,
+    } = document.querySelector('.js-edit-cluster-form').dataset;
+
+    this.store = new ClustersStore();
+    this.store.setHelpPath(helpPath);
+    this.store.updateStatus(clusterStatus);
+    this.store.updateStatusReason(clusterStatusReason);
+    this.service = new ClustersService({
+      endpoint: statusPath,
+      installHelmEndpoint: installHelmPath,
+      installIngressEndpoint: installIngressPath,
+      installRunnerEndpoint: installRunnerPath,
+    });
+
+    this.toggle = this.toggle.bind(this);
+    this.installApplication = this.installApplication.bind(this);
+
+    this.toggleButton = document.querySelector('.js-toggle-cluster');
+    this.toggleInput = document.querySelector('.js-toggle-input');
+    this.errorContainer = document.querySelector('.js-cluster-error');
+    this.successContainer = document.querySelector('.js-cluster-success');
+    this.creatingContainer = document.querySelector('.js-cluster-creating');
+    this.errorReasonContainer = this.errorContainer.querySelector('.js-error-reason');
+    this.successApplicationContainer = document.querySelector('.js-cluster-application-notice');
+
+    initSettingsPanels();
+    this.initApplications();
+
+    if (this.store.state.status !== 'created') {
+      this.updateContainer(null, this.store.state.status, this.store.state.statusReason);
+    }
+
+    this.addListeners();
+    if (statusPath) {
+      this.initPolling();
+    }
+  }
+
+  initApplications() {
+    const store = this.store;
+    const el = document.querySelector('#js-cluster-applications');
+
+    this.applications = new Vue({
+      el,
+      components: {
+        applications,
+      },
+      data() {
+        return {
+          state: store.state,
+        };
+      },
+      render(createElement) {
+        return createElement('applications', {
+          props: {
+            applications: this.state.applications,
+            helpPath: this.state.helpPath,
+          },
+        });
+      },
+    });
+  }
+
+  addListeners() {
+    this.toggleButton.addEventListener('click', this.toggle);
+    eventHub.$on('installApplication', this.installApplication);
+  }
+
+  removeListeners() {
+    this.toggleButton.removeEventListener('click', this.toggle);
+    eventHub.$off('installApplication', this.installApplication);
+  }
+
+  initPolling() {
+    this.poll = new Poll({
+      resource: this.service,
+      method: 'fetchData',
+      successCallback: data => this.handleSuccess(data),
+      errorCallback: () => Clusters.handleError(),
+    });
+
+    if (!Visibility.hidden()) {
+      this.poll.makeRequest();
+    } else {
+      this.service.fetchData()
+        .then(data => this.handleSuccess(data))
+        .catch(() => Clusters.handleError());
+    }
+
+    Visibility.change(() => {
+      if (!Visibility.hidden() && !this.destroyed) {
+        this.poll.restart();
+      } else {
+        this.poll.stop();
+      }
+    });
+  }
+
+  static handleError() {
+    Flash(s__('ClusterIntegration|Something went wrong on our end.'));
+  }
+
+  handleSuccess(data) {
+    const prevStatus = this.store.state.status;
+    const prevApplicationMap = Object.assign({}, this.store.state.applications);
+
+    this.store.updateStateFromServer(data.data);
+
+    this.checkForNewInstalls(prevApplicationMap, this.store.state.applications);
+    this.updateContainer(prevStatus, this.store.state.status, this.store.state.statusReason);
+  }
+
+  toggle() {
+    this.toggleButton.classList.toggle('checked');
+    this.toggleInput.setAttribute('value', this.toggleButton.classList.contains('checked').toString());
+  }
+
+  hideAll() {
+    this.errorContainer.classList.add('hidden');
+    this.successContainer.classList.add('hidden');
+    this.creatingContainer.classList.add('hidden');
+  }
+
+  checkForNewInstalls(prevApplicationMap, newApplicationMap) {
+    const appTitles = Object.keys(newApplicationMap)
+      .filter(appId => newApplicationMap[appId].status === APPLICATION_INSTALLED &&
+        prevApplicationMap[appId].status !== APPLICATION_INSTALLED &&
+        prevApplicationMap[appId].status !== null)
+      .map(appId => newApplicationMap[appId].title);
+
+    if (appTitles.length > 0) {
+      const text = sprintf(s__('ClusterIntegration|%{appList} was successfully installed on your cluster'), {
+        appList: appTitles.join(', '),
+      });
+      Flash(text, 'notice', this.successApplicationContainer);
+    }
+  }
+
+  updateContainer(prevStatus, status, error) {
+    this.hideAll();
+
+    // We poll all the time but only want the `created` banner to show when newly created
+    if (this.store.state.status !== 'created' || prevStatus !== this.store.state.status) {
+      switch (status) {
+        case 'created':
+          this.successContainer.classList.remove('hidden');
+          break;
+        case 'errored':
+          this.errorContainer.classList.remove('hidden');
+          this.errorReasonContainer.textContent = error;
+          break;
+        case 'scheduled':
+        case 'creating':
+          this.creatingContainer.classList.remove('hidden');
+          break;
+        default:
+          this.hideAll();
+      }
+    }
+  }
+
+  installApplication(appId) {
+    this.store.updateAppProperty(appId, 'requestStatus', REQUEST_LOADING);
+    this.store.updateAppProperty(appId, 'requestReason', null);
+
+    this.service.installApplication(appId)
+      .then(() => {
+        this.store.updateAppProperty(appId, 'requestStatus', REQUEST_SUCCESS);
+      })
+      .catch(() => {
+        this.store.updateAppProperty(appId, 'requestStatus', REQUEST_FAILURE);
+        this.store.updateAppProperty(appId, 'requestReason', s__('ClusterIntegration|Request to begin installing failed'));
+      });
+  }
+
+  destroy() {
+    this.destroyed = true;
+
+    this.removeListeners();
+
+    if (this.poll) {
+      this.poll.stop();
+    }
+
+    this.applications.$destroy();
+  }
+}
diff --git a/app/assets/javascripts/clusters/components/application_row.vue b/app/assets/javascripts/clusters/components/application_row.vue
new file mode 100644
index 00000000000..872abf03ef1
--- /dev/null
+++ b/app/assets/javascripts/clusters/components/application_row.vue
@@ -0,0 +1,185 @@
+<script>
+import { s__, sprintf } from '../../locale';
+import eventHub from '../event_hub';
+import loadingButton from '../../vue_shared/components/loading_button.vue';
+import {
+  APPLICATION_NOT_INSTALLABLE,
+  APPLICATION_SCHEDULED,
+  APPLICATION_INSTALLABLE,
+  APPLICATION_INSTALLING,
+  APPLICATION_INSTALLED,
+  APPLICATION_ERROR,
+  REQUEST_LOADING,
+  REQUEST_SUCCESS,
+  REQUEST_FAILURE,
+} from '../constants';
+
+export default {
+  props: {
+    id: {
+      type: String,
+      required: true,
+    },
+    title: {
+      type: String,
+      required: true,
+    },
+    titleLink: {
+      type: String,
+      required: false,
+    },
+    description: {
+      type: String,
+      required: true,
+    },
+    status: {
+      type: String,
+      required: false,
+    },
+    statusReason: {
+      type: String,
+      required: false,
+    },
+    requestStatus: {
+      type: String,
+      required: false,
+    },
+    requestReason: {
+      type: String,
+      required: false,
+    },
+  },
+  components: {
+    loadingButton,
+  },
+  computed: {
+    rowJsClass() {
+      return `js-cluster-application-row-${this.id}`;
+    },
+    installButtonLoading() {
+      return !this.status ||
+        this.status === APPLICATION_SCHEDULED ||
+        this.status === APPLICATION_INSTALLING ||
+        this.requestStatus === REQUEST_LOADING;
+    },
+    installButtonDisabled() {
+      // Avoid the potential for the real-time data to say APPLICATION_INSTALLABLE but
+      // we already made a request to install and are just waiting for the real-time
+      // to sync up.
+      return (this.status !== APPLICATION_INSTALLABLE && this.status !== APPLICATION_ERROR) ||
+        this.requestStatus === REQUEST_LOADING ||
+        this.requestStatus === REQUEST_SUCCESS;
+    },
+    installButtonLabel() {
+      let label;
+      if (
+        this.status === APPLICATION_NOT_INSTALLABLE ||
+        this.status === APPLICATION_INSTALLABLE ||
+        this.status === APPLICATION_ERROR
+      ) {
+        label = s__('ClusterIntegration|Install');
+      } else if (this.status === APPLICATION_SCHEDULED || this.status === APPLICATION_INSTALLING) {
+        label = s__('ClusterIntegration|Installing');
+      } else if (this.status === APPLICATION_INSTALLED) {
+        label = s__('ClusterIntegration|Installed');
+      }
+
+      return label;
+    },
+    hasError() {
+      return this.status === APPLICATION_ERROR || this.requestStatus === REQUEST_FAILURE;
+    },
+    generalErrorDescription() {
+      return sprintf(
+        s__('ClusterIntegration|Something went wrong while installing %{title}'), {
+          title: this.title,
+        },
+      );
+    },
+  },
+  methods: {
+    installClicked() {
+      eventHub.$emit('installApplication', this.id);
+    },
+  },
+};
+</script>
+
+<template>
+  <div
+    class="gl-responsive-table-row gl-responsive-table-row-col-span"
+    :class="rowJsClass"
+  >
+    <div
+      class="gl-responsive-table-row-layout"
+      role="row"
+    >
+      <a
+        v-if="titleLink"
+        :href="titleLink"
+        target="blank"
+        rel="noopener noreferrer"
+        role="gridcell"
+        class="table-section section-15 section-align-top js-cluster-application-title"
+      >
+        {{ title }}
+      </a>
+      <span
+        v-else
+        class="table-section section-15 section-align-top js-cluster-application-title"
+      >
+        {{ title }}
+      </span>
+      <div
+        class="table-section section-wrap"
+        role="gridcell"
+      >
+        <div v-html="description"></div>
+      </div>
+      <div
+        class="table-section table-button-footer section-15 section-align-top"
+        role="gridcell"
+      >
+        <div class="btn-group table-action-buttons">
+          <loading-button
+            class="js-cluster-application-install-button"
+            :loading="installButtonLoading"
+            :disabled="installButtonDisabled"
+            :label="installButtonLabel"
+            @click="installClicked"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      v-if="hasError"
+      class="gl-responsive-table-row-layout"
+      role="row"
+    >
+      <div
+        class="alert alert-danger alert-block append-bottom-0 table-section section-100"
+        role="gridcell"
+      >
+        <div>
+          <p class="js-cluster-application-general-error-message">
+            {{ generalErrorDescription }}
+          </p>
+          <ul v-if="statusReason || requestReason">
+            <li
+              v-if="statusReason"
+              class="js-cluster-application-status-error-message"
+            >
+              {{ statusReason }}
+            </li>
+            <li
+              v-if="requestReason"
+              class="js-cluster-application-request-error-message"
+            >
+              {{ requestReason }}
+            </li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/app/assets/javascripts/clusters/components/applications.vue b/app/assets/javascripts/clusters/components/applications.vue
new file mode 100644
index 00000000000..e5ae439d26e
--- /dev/null
+++ b/app/assets/javascripts/clusters/components/applications.vue
@@ -0,0 +1,114 @@
+<script>
+import _ from 'underscore';
+import { s__, sprintf } from '../../locale';
+import applicationRow from './application_row.vue';
+
+export default {
+  props: {
+    applications: {
+      type: Object,
+      required: false,
+      default: () => ({}),
+    },
+    helpPath: {
+      type: String,
+      required: false,
+    },
+  },
+  components: {
+    applicationRow,
+  },
+  computed: {
+    generalApplicationDescription() {
+      return sprintf(
+        _.escape(s__('ClusterIntegration|Install applications on your cluster. Read more about %{helpLink}')), {
+          helpLink: `<a href="${this.helpPath}">
+            ${_.escape(s__('ClusterIntegration|installing applications'))}
+          </a>`,
+        },
+        false,
+      );
+    },
+    helmTillerDescription() {
+      return _.escape(s__(
+        `ClusterIntegration|Helm streamlines installing and managing Kubernets applications.
+        Tiller runs inside of your Kubernetes Cluster, and manages
+        releases of your charts.`,
+      ));
+    },
+    ingressDescription() {
+      const descriptionParagraph = _.escape(s__(
+        `ClusterIntegration|Ingress gives you a way to route requests to services based on the
+        request host or path, centralizing a number of services into a single entrypoint.`,
+      ));
+
+      const extraCostParagraph = sprintf(
+        _.escape(s__('ClusterIntegration|%{boldNotice} This will add some extra resources like a load balancer, which incur additional costs. See %{pricingLink}')), {
+          boldNotice: `<strong>${_.escape(s__('ClusterIntegration|Note:'))}</strong>`,
+          pricingLink: `<a href="https://cloud.google.com/compute/pricing#lb" target="_blank" rel="noopener noreferrer">
+            ${_.escape(s__('ClusterIntegration|GKE pricing'))}
+          </a>`,
+        },
+        false,
+      );
+
+      return `
+        <p>
+          ${descriptionParagraph}
+        </p>
+        <p class="append-bottom-0">
+          ${extraCostParagraph}
+        </p>
+      `;
+    },
+    gitlabRunnerDescription() {
+      return _.escape(s__(
+        `ClusterIntegration|GitLab Runner is the open source project that is used to run your jobs
+        and send the results back to GitLab.`,
+      ));
+    },
+  },
+};
+</script>
+
+<template>
+  <section class="settings no-animate expanded">
+    <div class="settings-header">
+      <h4>
+        {{ s__('ClusterIntegration|Applications') }}
+      </h4>
+      <p
+        class="append-bottom-0"
+        v-html="generalApplicationDescription"
+      >
+      </p>
+    </div>
+
+    <div class="settings-content">
+      <div class="append-bottom-20">
+        <application-row
+          id="helm"
+          :title="applications.helm.title"
+          title-link="https://docs.helm.sh/"
+          :description="helmTillerDescription"
+          :status="applications.helm.status"
+          :status-reason="applications.helm.statusReason"
+          :request-status="applications.helm.requestStatus"
+          :request-reason="applications.helm.requestReason"
+        />
+        <application-row
+         id="ingress"
+         :title="applications.ingress.title"
+         title-link="https://kubernetes.io/docs/concepts/services-networking/ingress/"
+         :description="ingressDescription"
+         :status="applications.ingress.status"
+         :status-reason="applications.ingress.statusReason"
+         :request-status="applications.ingress.requestStatus"
+         :request-reason="applications.ingress.requestReason"
+       />
+        <!-- NOTE: Don't forget to update `clusters.scss` min-height for this block and uncomment `application_spec` tests -->
+        <!-- Add GitLab Runner row, all other plumbing is complete -->
+      </div>
+    </div>
+  </section>
+</template>
diff --git a/app/assets/javascripts/clusters/constants.js b/app/assets/javascripts/clusters/constants.js
new file mode 100644
index 00000000000..93223aefff8
--- /dev/null
+++ b/app/assets/javascripts/clusters/constants.js
@@ -0,0 +1,12 @@
+// These need to match what is returned from the server
+export const APPLICATION_NOT_INSTALLABLE = 'not_installable';
+export const APPLICATION_INSTALLABLE = 'installable';
+export const APPLICATION_SCHEDULED = 'scheduled';
+export const APPLICATION_INSTALLING = 'installing';
+export const APPLICATION_INSTALLED = 'installed';
+export const APPLICATION_ERROR = 'errored';
+
+// These are only used client-side
+export const REQUEST_LOADING = 'request-loading';
+export const REQUEST_SUCCESS = 'request-success';
+export const REQUEST_FAILURE = 'request-failure';
diff --git a/app/assets/javascripts/clusters/event_hub.js b/app/assets/javascripts/clusters/event_hub.js
new file mode 100644
index 00000000000..0948c2e5352
--- /dev/null
+++ b/app/assets/javascripts/clusters/event_hub.js
@@ -0,0 +1,3 @@
+import Vue from 'vue';
+
+export default new Vue();
diff --git a/app/assets/javascripts/clusters/services/clusters_service.js b/app/assets/javascripts/clusters/services/clusters_service.js
new file mode 100644
index 00000000000..0ac8e68187d
--- /dev/null
+++ b/app/assets/javascripts/clusters/services/clusters_service.js
@@ -0,0 +1,24 @@
+import axios from 'axios';
+import setAxiosCsrfToken from '../../lib/utils/axios_utils';
+
+export default class ClusterService {
+  constructor(options = {}) {
+    setAxiosCsrfToken();
+
+    this.options = options;
+    this.appInstallEndpointMap = {
+      helm: this.options.installHelmEndpoint,
+      ingress: this.options.installIngressEndpoint,
+      runner: this.options.installRunnerEndpoint,
+    };
+  }
+
+  fetchData() {
+    return axios.get(this.options.endpoint);
+  }
+
+  installApplication(appId) {
+    const endpoint = this.appInstallEndpointMap[appId];
+    return axios.post(endpoint);
+  }
+}
diff --git a/app/assets/javascripts/clusters/stores/clusters_store.js b/app/assets/javascripts/clusters/stores/clusters_store.js
new file mode 100644
index 00000000000..e731cdc3042
--- /dev/null
+++ b/app/assets/javascripts/clusters/stores/clusters_store.js
@@ -0,0 +1,68 @@
+import { s__ } from '../../locale';
+
+export default class ClusterStore {
+  constructor() {
+    this.state = {
+      helpPath: null,
+      status: null,
+      statusReason: null,
+      applications: {
+        helm: {
+          title: s__('ClusterIntegration|Helm Tiller'),
+          status: null,
+          statusReason: null,
+          requestStatus: null,
+          requestReason: null,
+        },
+        ingress: {
+          title: s__('ClusterIntegration|Ingress'),
+          status: null,
+          statusReason: null,
+          requestStatus: null,
+          requestReason: null,
+        },
+        runner: {
+          title: s__('ClusterIntegration|GitLab Runner'),
+          status: null,
+          statusReason: null,
+          requestStatus: null,
+          requestReason: null,
+        },
+      },
+    };
+  }
+
+  setHelpPath(helpPath) {
+    this.state.helpPath = helpPath;
+  }
+
+  updateStatus(status) {
+    this.state.status = status;
+  }
+
+  updateStatusReason(reason) {
+    this.state.statusReason = reason;
+  }
+
+  updateAppProperty(appId, prop, value) {
+    this.state.applications[appId][prop] = value;
+  }
+
+  updateStateFromServer(serverState = {}) {
+    this.state.status = serverState.status;
+    this.state.statusReason = serverState.status_reason;
+    serverState.applications.forEach((serverAppEntry) => {
+      const {
+        name: appId,
+        status,
+        status_reason: statusReason,
+      } = serverAppEntry;
+
+      this.state.applications[appId] = {
+        ...(this.state.applications[appId] || {}),
+        status,
+        statusReason,
+      };
+    });
+  }
+}
diff --git a/app/assets/javascripts/commits.js b/app/assets/javascripts/commits.js
index ae6b8902032..9b952ea7b60 100644
--- a/app/assets/javascripts/commits.js
+++ b/app/assets/javascripts/commits.js
@@ -3,6 +3,8 @@
   prefer-template, object-shorthand, prefer-arrow-callback */
 /* global Pager */
 
+import { pluralize } from './lib/utils/text_utility';
+
 export default (function () {
   const CommitsList = {};
 
@@ -86,7 +88,7 @@ export default (function () {
 
       // Update commits count in the previous commits header.
       commitsCount += Number($(processedData).nextUntil('li.js-commit-header').first().find('li.commit').length);
-      $commitsHeadersLast.find('span.commits-count').text(`${commitsCount} ${gl.text.pluralize('commit', commitsCount)}`);
+      $commitsHeadersLast.find('span.commits-count').text(`${commitsCount} ${pluralize('commit', commitsCount)}`);
     }
 
     gl.utils.localTimeAgo($processedData.find('.js-timeago'));
diff --git a/app/assets/javascripts/create_label.js b/app/assets/javascripts/create_label.js
index 3bed0678350..9a4c9bfcc80 100644
--- a/app/assets/javascripts/create_label.js
+++ b/app/assets/javascripts/create_label.js
@@ -1,5 +1,6 @@
 /* eslint-disable func-names, prefer-arrow-callback */
 import Api from './api';
+import { humanize } from './lib/utils/text_utility';
 
 export default class CreateLabelDropdown {
   constructor($el, namespacePath, projectPath) {
@@ -107,7 +108,7 @@ export default class CreateLabelDropdown {
           errors = label.message;
         } else {
           errors = Object.keys(label.message).map(key =>
-            `${gl.text.humanize(key)} ${label.message[key].join(', ')}`,
+            `${humanize(key)} ${label.message[key].join(', ')}`,
           ).join('<br/>');
         }
 
diff --git a/app/assets/javascripts/cycle_analytics/cycle_analytics_store.js b/app/assets/javascripts/cycle_analytics/cycle_analytics_store.js
index 8bf9ae17de0..a8cd8c20f8f 100644
--- a/app/assets/javascripts/cycle_analytics/cycle_analytics_store.js
+++ b/app/assets/javascripts/cycle_analytics/cycle_analytics_store.js
@@ -1,7 +1,7 @@
 /* eslint-disable no-param-reassign */
 
 import { __ } from '../locale';
-import '../lib/utils/text_utility';
+import { dasherize } from '../lib/utils/text_utility';
 import DEFAULT_EVENT_OBJECTS from './default_event_objects';
 
 const EMPTY_STAGE_TEXTS = {
@@ -36,7 +36,7 @@ export default {
     });
 
     newData.stages.forEach((item) => {
-      const stageSlug = gl.text.dasherize(item.name.toLowerCase());
+      const stageSlug = dasherize(item.name.toLowerCase());
       item.active = false;
       item.isUserAllowed = data.permissions[stageSlug];
       item.emptyStageText = EMPTY_STAGE_TEXTS[stageSlug];
diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js
index 760fb0cdf67..d716218d9a4 100644
--- a/app/assets/javascripts/dispatcher.js
+++ b/app/assets/javascripts/dispatcher.js
@@ -1,4 +1,5 @@
 /* eslint-disable func-names, space-before-function-paren, no-var, prefer-arrow-callback, wrap-iife, no-shadow, consistent-return, one-var, one-var-declaration-per-line, camelcase, default-case, no-new, quotes, no-duplicate-case, no-case-declarations, no-fallthrough, max-len */
+import { s__ } from './locale';
 /* global ProjectSelect */
 import IssuableIndex from './issuable_index';
 /* global Milestone */
@@ -19,19 +20,20 @@ import groupsSelect from './groups_select';
 import NamespaceSelect from './namespace_select';
 /* global NewCommitForm */
 /* global NewBranchForm */
-/* global Project */
-/* global ProjectAvatar */
+import Project from './project';
+import projectAvatar from './project_avatar';
 /* global MergeRequest */
 /* global Compare */
 /* global CompareAutocomplete */
 /* global ProjectFindFile */
 /* global ProjectNew */
 /* global ProjectShow */
-/* global ProjectImport */
+import projectImport from './project_import';
 import Labels from './labels';
 import LabelManager from './label_manager';
 /* global Sidebar */
 
+import Flash from './flash';
 import CommitsList from './commits';
 import Issue from './issue';
 import BindInOut from './behaviors/bind_in_out';
@@ -376,7 +378,7 @@ import Diff from './diff';
           initSettingsPanels();
           break;
         case 'projects:imports:show':
-          new ProjectImport();
+          projectImport();
           break;
         case 'projects:pipelines:new':
           new NewBranchForm($('.js-new-pipeline-form'));
@@ -543,9 +545,12 @@ import Diff from './diff';
           new DueDateSelectors();
           break;
         case 'projects:clusters:show':
-          import(/* webpackChunkName: "clusters" */ './clusters')
+          import(/* webpackChunkName: "clusters" */ './clusters/clusters_bundle')
             .then(cluster => new cluster.default()) // eslint-disable-line new-cap
-            .catch(() => {});
+            .catch((err) => {
+              Flash(s__('ClusterIntegration|Problem setting up the cluster JavaScript'));
+              throw err;
+            });
           break;
       }
       switch (path[0]) {
@@ -599,7 +604,7 @@ import Diff from './diff';
           break;
         case 'projects':
           new Project();
-          new ProjectAvatar();
+          projectAvatar();
           switch (path[1]) {
             case 'compare':
               new CompareAutocomplete();
diff --git a/app/assets/javascripts/emoji/support/is_emoji_unicode_supported.js b/app/assets/javascripts/emoji/support/is_emoji_unicode_supported.js
index 3fd23efa9f8..e9defb62cf8 100644
--- a/app/assets/javascripts/emoji/support/is_emoji_unicode_supported.js
+++ b/app/assets/javascripts/emoji/support/is_emoji_unicode_supported.js
@@ -7,6 +7,17 @@ function isFlagEmoji(emojiUnicode) {
   return emojiUnicode.length === 4 && cp >= flagACodePoint && cp <= flagZCodePoint;
 }
 
+// Tested on mac OS 10.12.6 and Windows 10 FCU, it renders as two separate characters
+const baseFlagCodePoint = 127987; // parseInt('1F3F3', 16)
+const rainbowCodePoint = 127752; // parseInt('1F308', 16)
+function isRainbowFlagEmoji(emojiUnicode) {
+  const characters = Array.from(emojiUnicode);
+  // Length 4 because flags are made of 2 characters which are surrogate pairs
+  return emojiUnicode.length === 4 &&
+    characters[0].codePointAt(0) === baseFlagCodePoint &&
+    characters[1].codePointAt(0) === rainbowCodePoint;
+}
+
 // Chrome <57 renders keycaps oddly
 // See https://bugs.chromium.org/p/chromium/issues/detail?id=632294
 // Same issue on Windows also fixed in Chrome 57, http://i.imgur.com/rQF7woO.png
@@ -57,9 +68,11 @@ function isPersonZwjEmoji(emojiUnicode) {
 // in `isEmojiUnicodeSupported` logic
 function checkFlagEmojiSupport(unicodeSupportMap, emojiUnicode) {
   const isFlagResult = isFlagEmoji(emojiUnicode);
+  const isRainbowFlagResult = isRainbowFlagEmoji(emojiUnicode);
   return (
     (unicodeSupportMap.flag && isFlagResult) ||
-    !isFlagResult
+    (unicodeSupportMap.rainbowFlag && isRainbowFlagResult) ||
+    (!isFlagResult && !isRainbowFlagResult)
   );
 }
 
@@ -113,6 +126,7 @@ function isEmojiUnicodeSupported(unicodeSupportMap = {}, emojiUnicode, unicodeVe
 export {
   isEmojiUnicodeSupported as default,
   isFlagEmoji,
+  isRainbowFlagEmoji,
   isKeycapEmoji,
   isSkinToneComboEmoji,
   isHorceRacingSkinToneComboEmoji,
diff --git a/app/assets/javascripts/emoji/support/unicode_support_map.js b/app/assets/javascripts/emoji/support/unicode_support_map.js
index 755381c2f95..c18d07dad43 100644
--- a/app/assets/javascripts/emoji/support/unicode_support_map.js
+++ b/app/assets/javascripts/emoji/support/unicode_support_map.js
@@ -1,5 +1,7 @@
 import AccessorUtilities from '../../lib/utils/accessor';
 
+const GL_EMOJI_VERSION = '0.2.0';
+
 const unicodeSupportTestMap = {
   // man, student (emojione does not have any of these yet), http://emojipedia.org/emoji-zwj-sequences/
   // occupationZwj: '\u{1F468}\u{200D}\u{1F393}',
@@ -13,6 +15,7 @@ const unicodeSupportTestMap = {
   horseRacing: '\u{1F3C7}\u{1F3FF}',
   // US flag, http://emojipedia.org/flags/
   flag: '\u{1F1FA}\u{1F1F8}',
+  rainbowFlag: '\u{1F3F3}\u{1F308}',
   // http://emojipedia.org/modifiers/
   skinToneModifier: [
     // spy_tone5
@@ -141,23 +144,31 @@ function generateUnicodeSupportMap(testMap) {
 }
 
 export default function getUnicodeSupportMap() {
-  let unicodeSupportMap;
-  let userAgentFromCache;
-
   const isLocalStorageAvailable = AccessorUtilities.isLocalStorageAccessSafe();
 
-  if (isLocalStorageAvailable) userAgentFromCache = window.localStorage.getItem('gl-emoji-user-agent');
+  let glEmojiVersionFromCache;
+  let userAgentFromCache;
+  if (isLocalStorageAvailable) {
+    glEmojiVersionFromCache = window.localStorage.getItem('gl-emoji-version');
+    userAgentFromCache = window.localStorage.getItem('gl-emoji-user-agent');
+  }
 
+  let unicodeSupportMap;
   try {
     unicodeSupportMap = JSON.parse(window.localStorage.getItem('gl-emoji-unicode-support-map'));
   } catch (err) {
     // swallow
   }
 
-  if (!unicodeSupportMap || userAgentFromCache !== navigator.userAgent) {
+  if (
+    !unicodeSupportMap ||
+    glEmojiVersionFromCache !== GL_EMOJI_VERSION ||
+    userAgentFromCache !== navigator.userAgent
+  ) {
     unicodeSupportMap = generateUnicodeSupportMap(unicodeSupportTestMap);
 
     if (isLocalStorageAvailable) {
+      window.localStorage.setItem('gl-emoji-version', GL_EMOJI_VERSION);
       window.localStorage.setItem('gl-emoji-user-agent', navigator.userAgent);
       window.localStorage.setItem('gl-emoji-unicode-support-map', JSON.stringify(unicodeSupportMap));
     }
diff --git a/app/assets/javascripts/environments/components/environment_item.vue b/app/assets/javascripts/environments/components/environment_item.vue
index fc0308b81ba..9d25f806c0d 100644
--- a/app/assets/javascripts/environments/components/environment_item.vue
+++ b/app/assets/javascripts/environments/components/environment_item.vue
@@ -2,7 +2,7 @@
 import Timeago from 'timeago.js';
 import _ from 'underscore';
 import userAvatarLink from '../../vue_shared/components/user_avatar/user_avatar_link.vue';
-import '../../lib/utils/text_utility';
+import { humanize } from '../../lib/utils/text_utility';
 import ActionsComponent from './environment_actions.vue';
 import ExternalUrlComponent from './environment_external_url.vue';
 import StopComponent from './environment_stop.vue';
@@ -139,7 +139,7 @@ export default {
       if (this.hasManualActions) {
         return this.model.last_deployment.manual_actions.map((action) => {
           const parsedAction = {
-            name: gl.text.humanize(action.name),
+            name: humanize(action.name),
             play_path: action.play_path,
             playable: action.playable,
           };
diff --git a/app/assets/javascripts/filtered_search/dropdown_utils.js b/app/assets/javascripts/filtered_search/dropdown_utils.js
index 8d711e3213c..cf8a9b0402b 100644
--- a/app/assets/javascripts/filtered_search/dropdown_utils.js
+++ b/app/assets/javascripts/filtered_search/dropdown_utils.js
@@ -147,6 +147,16 @@ class DropdownUtils {
     return dataValue !== null;
   }
 
+  static getVisualTokenValues(visualToken) {
+    const tokenName = visualToken && visualToken.querySelector('.name').textContent.trim();
+    let tokenValue = visualToken && visualToken.querySelector('.value') && visualToken.querySelector('.value').textContent.trim();
+    if (tokenName === 'label' && tokenValue) {
+      // remove leading symbol and wrapping quotes
+      tokenValue = tokenValue.replace(/^~("|')?(.*)/, '$2').replace(/("|')$/, '');
+    }
+    return { tokenName, tokenValue };
+  }
+
   // Determines the full search query (visual tokens + input)
   static getSearchQuery(untilInput = false) {
     const container = FilteredSearchContainer.container;
diff --git a/app/assets/javascripts/filtered_search/filtered_search_manager.js b/app/assets/javascripts/filtered_search/filtered_search_manager.js
index 7b233842d5a..69c57f923b6 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_manager.js
+++ b/app/assets/javascripts/filtered_search/filtered_search_manager.js
@@ -185,8 +185,8 @@ class FilteredSearchManager {
     if (e.keyCode === 8 || e.keyCode === 46) {
       const { lastVisualToken } = gl.FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
 
-      const sanitizedTokenName = lastVisualToken && lastVisualToken.querySelector('.name').textContent.trim();
-      const canEdit = sanitizedTokenName && this.canEdit && this.canEdit(sanitizedTokenName);
+      const { tokenName, tokenValue } = gl.DropdownUtils.getVisualTokenValues(lastVisualToken);
+      const canEdit = tokenName && this.canEdit && this.canEdit(tokenName, tokenValue);
       if (this.filteredSearchInput.value === '' && lastVisualToken && canEdit) {
         this.filteredSearchInput.value = gl.FilteredSearchVisualTokens.getLastTokenPartial();
         gl.FilteredSearchVisualTokens.removeLastTokenPartial();
@@ -336,8 +336,8 @@ class FilteredSearchManager {
       let canClearToken = t.classList.contains('js-visual-token');
 
       if (canClearToken) {
-        const tokenKey = t.querySelector('.name').textContent.trim();
-        canClearToken = this.canEdit && this.canEdit(tokenKey);
+        const { tokenName, tokenValue } = gl.DropdownUtils.getVisualTokenValues(t);
+        canClearToken = this.canEdit && this.canEdit(tokenName, tokenValue);
       }
 
       if (canClearToken) {
@@ -469,7 +469,7 @@ class FilteredSearchManager {
           }
 
           hasFilteredSearch = true;
-          const canEdit = this.canEdit && this.canEdit(sanitizedKey);
+          const canEdit = this.canEdit && this.canEdit(sanitizedKey, sanitizedValue);
           gl.FilteredSearchVisualTokens.addFilterVisualToken(
             sanitizedKey,
             `${symbol}${quotationsToUse}${sanitizedValue}${quotationsToUse}`,
diff --git a/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js b/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
index d2f92929b8a..6139e81fe6d 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
+++ b/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
@@ -38,21 +38,14 @@ class FilteredSearchVisualTokens {
   }
 
   static createVisualTokenElementHTML(canEdit = true) {
-    let removeTokenMarkup = '';
-    if (canEdit) {
-      removeTokenMarkup = `
-        <div class="remove-token" role="button">
-          <i class="fa fa-close"></i>
-        </div>
-      `;
-    }
-
     return `
-      <div class="selectable" role="button">
+      <div class="${canEdit ? 'selectable' : 'hidden'}" role="button">
         <div class="name"></div>
         <div class="value-container">
           <div class="value"></div>
-          ${removeTokenMarkup}
+          <div class="remove-token" role="button">
+            <i class="fa fa-close"></i>
+          </div>
         </div>
       </div>
     `;
diff --git a/app/assets/javascripts/gfm_auto_complete.js b/app/assets/javascripts/gfm_auto_complete.js
index 5c624b79d45..a642464c920 100644
--- a/app/assets/javascripts/gfm_auto_complete.js
+++ b/app/assets/javascripts/gfm_auto_complete.js
@@ -338,7 +338,8 @@ class GfmAutoComplete {
         let resultantValue = value;
         if (value && !this.setting.skipSpecialCharacterTest) {
           const withoutAt = value.substring(1);
-          if (withoutAt && /[^\w\d]/.test(withoutAt)) {
+          const regex = value.charAt() === '~' ? /\W|^\d+$/ : /\W/;
+          if (withoutAt && regex.test(withoutAt)) {
             resultantValue = `${value.charAt()}"${withoutAt}"`;
           }
         }
diff --git a/app/assets/javascripts/gl_dropdown.js b/app/assets/javascripts/gl_dropdown.js
index c4202f92443..4e7a6e54f90 100644
--- a/app/assets/javascripts/gl_dropdown.js
+++ b/app/assets/javascripts/gl_dropdown.js
@@ -331,7 +331,7 @@ GitLabDropdown = (function() {
             if (_this.dropdown.find('.dropdown-toggle-page').length) {
               selector = ".dropdown-page-one " + selector;
             }
-            return $(selector);
+            return $(selector, this.instance.dropdown);
           };
         })(this),
         data: (function(_this) {
diff --git a/app/assets/javascripts/gl_form.js b/app/assets/javascripts/gl_form.js
index 48cd43d3348..d0f9e6af0f8 100644
--- a/app/assets/javascripts/gl_form.js
+++ b/app/assets/javascripts/gl_form.js
@@ -2,6 +2,7 @@
 
 import GfmAutoComplete from './gfm_auto_complete';
 import dropzoneInput from './dropzone_input';
+import textUtils from './lib/utils/text_markdown';
 
 export default class GLForm {
   constructor(form, enableGFM = false) {
@@ -46,7 +47,7 @@ export default class GLForm {
     }
     // form and textarea event listeners
     this.addEventListeners();
-    gl.text.init(this.form);
+    textUtils.init(this.form);
     // hide discard button
     this.form.find('.js-note-discard').hide();
     this.form.show();
@@ -85,7 +86,7 @@ export default class GLForm {
   clearEventListeners() {
     this.textarea.off('focus');
     this.textarea.off('blur');
-    gl.text.removeListeners(this.form);
+    textUtils.removeListeners(this.form);
   }
 
   addEventListeners() {
diff --git a/app/assets/javascripts/issue.js b/app/assets/javascripts/issue.js
index acd5730cf3c..7de07e9403d 100644
--- a/app/assets/javascripts/issue.js
+++ b/app/assets/javascripts/issue.js
@@ -1,6 +1,6 @@
 /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, one-var, no-underscore-dangle, one-var-declaration-per-line, object-shorthand, no-unused-vars, no-new, comma-dangle, consistent-return, quotes, dot-notation, quote-props, prefer-arrow-callback, max-len */
 import 'vendor/jquery.waitforimages';
-import '~/lib/utils/text_utility';
+import { addDelimiter } from './lib/utils/text_utility';
 import Flash from './flash';
 import TaskList from './task_list';
 import CreateMergeRequestDropdown from './create_merge_request_dropdown';
@@ -73,7 +73,7 @@ export default class Issue {
 
           let numProjectIssues = Number(projectIssuesCounter.first().text().trim().replace(/[^\d]/, ''));
           numProjectIssues = isClosed ? numProjectIssues - 1 : numProjectIssues + 1;
-          projectIssuesCounter.text(gl.text.addDelimiter(numProjectIssues));
+          projectIssuesCounter.text(addDelimiter(numProjectIssues));
 
           if (this.createMergeRequestDropdown) {
             if (isClosed) {
diff --git a/app/assets/javascripts/issue_show/components/app.vue b/app/assets/javascripts/issue_show/components/app.vue
index d1aa83ea57f..e8ac8d3b5bb 100644
--- a/app/assets/javascripts/issue_show/components/app.vue
+++ b/app/assets/javascripts/issue_show/components/app.vue
@@ -29,6 +29,11 @@ export default {
       required: false,
       default: false,
     },
+    showDeleteButton: {
+      type: Boolean,
+      required: false,
+      default: true,
+    },
     issuableRef: {
       type: String,
       required: true,
@@ -92,6 +97,11 @@ export default {
       type: String,
       required: true,
     },
+    issuableType: {
+      type: String,
+      required: false,
+      default: 'issue',
+    },
   },
   data() {
     const store = new Store({
@@ -157,21 +167,21 @@ export default {
         })
         .catch(() => {
           eventHub.$emit('close.form');
-          window.Flash('Error updating issue');
+          window.Flash(`Error updating ${this.issuableType}`);
         });
     },
     deleteIssuable() {
       this.service.deleteIssuable()
         .then(res => res.json())
         .then((data) => {
-          // Stop the poll so we don't get 404's with the issue not existing
+          // Stop the poll so we don't get 404's with the issuable not existing
           this.poll.stop();
 
           gl.utils.visitUrl(data.web_url);
         })
         .catch(() => {
           eventHub.$emit('close.form');
-          window.Flash('Error deleting issue');
+          window.Flash(`Error deleting ${this.issuableType}`);
         });
     },
   },
@@ -223,6 +233,7 @@ export default {
       :markdown-preview-path="markdownPreviewPath"
       :project-path="projectPath"
       :project-namespace="projectNamespace"
+      :show-delete-button="showDeleteButton"
     />
     <div v-else>
       <title-component
diff --git a/app/assets/javascripts/issue_show/components/edit_actions.vue b/app/assets/javascripts/issue_show/components/edit_actions.vue
index 8c81575fe6f..a539506bce2 100644
--- a/app/assets/javascripts/issue_show/components/edit_actions.vue
+++ b/app/assets/javascripts/issue_show/components/edit_actions.vue
@@ -13,6 +13,11 @@
         type: Object,
         required: true,
       },
+      showDeleteButton: {
+        type: Boolean,
+        required: false,
+        default: true,
+      },
     },
     data() {
       return {
@@ -23,6 +28,9 @@
       isSubmitEnabled() {
         return this.formState.title.trim() !== '';
       },
+      shouldShowDeleteButton() {
+        return this.canDestroy && this.showDeleteButton;
+      },
     },
     methods: {
       closeForm() {
@@ -62,7 +70,7 @@
       Cancel
     </button>
     <button
-      v-if="canDestroy"
+      v-if="shouldShowDeleteButton"
       class="btn btn-danger pull-right append-right-default"
       :class="{ disabled: deleteLoading }"
       type="button"
diff --git a/app/assets/javascripts/issue_show/components/form.vue b/app/assets/javascripts/issue_show/components/form.vue
index 28bf6c67ea5..8bb5c86d567 100644
--- a/app/assets/javascripts/issue_show/components/form.vue
+++ b/app/assets/javascripts/issue_show/components/form.vue
@@ -36,6 +36,11 @@
         type: String,
         required: true,
       },
+      showDeleteButton: {
+        type: Boolean,
+        required: false,
+        default: true,
+      },
     },
     components: {
       lockedWarning,
@@ -81,6 +86,7 @@
       :markdown-docs-path="markdownDocsPath" />
     <edit-actions
       :form-state="formState"
-      :can-destroy="canDestroy" />
+      :can-destroy="canDestroy"
+      :show-delete-button="showDeleteButton" />
   </form>
 </template>
diff --git a/app/assets/javascripts/job.js b/app/assets/javascripts/job.js
index c6b5844dff6..cf8fda9a4fa 100644
--- a/app/assets/javascripts/job.js
+++ b/app/assets/javascripts/job.js
@@ -14,8 +14,8 @@ export default class Job {
     this.state = this.options.logState;
     this.buildStage = this.options.buildStage;
     this.$document = $(document);
+    this.$window = $(window);
     this.logBytes = 0;
-    this.hasBeenScrolled = false;
     this.updateDropdown = this.updateDropdown.bind(this);
 
     this.$buildTrace = $('#build-trace');
@@ -54,23 +54,18 @@ export default class Job {
 
     this.scrollThrottled = _.throttle(this.toggleScroll.bind(this), 100);
 
-    $(window)
+    this.$window
       .off('scroll')
       .on('scroll', () => {
-        const contentHeight = this.$buildTraceOutput.height();
-        if (contentHeight > this.windowSize) {
-          // means the user did not scroll, the content was updated.
-          this.windowSize = contentHeight;
-        } else {
-          // User scrolled
-          this.hasBeenScrolled = true;
+        if (!this.isScrolledToBottom()) {
           this.toggleScrollAnimation(false);
+        } else if (this.isScrolledToBottom() && !this.isLogComplete) {
+          this.toggleScrollAnimation(true);
         }
-
         this.scrollThrottled();
       });
 
-    $(window)
+    this.$window
       .off('resize.build')
       .on('resize.build', _.throttle(this.sidebarOnResize.bind(this), 100));
 
@@ -99,14 +94,14 @@ export default class Job {
 
   // eslint-disable-next-line class-methods-use-this
   canScroll() {
-    return $(document).height() > $(window).height();
+    return this.$document.height() > this.$window.height();
   }
 
   toggleScroll() {
-    const currentPosition = $(document).scrollTop();
-    const scrollHeight = $(document).height();
+    const currentPosition = this.$document.scrollTop();
+    const scrollHeight = this.$document.height();
 
-    const windowHeight = $(window).height();
+    const windowHeight = this.$window.height();
     if (this.canScroll()) {
       if (currentPosition > 0 &&
         (scrollHeight - currentPosition !== windowHeight)) {
@@ -119,7 +114,7 @@ export default class Job {
 
         this.toggleDisableButton(this.$scrollTopBtn, true);
         this.toggleDisableButton(this.$scrollBottomBtn, false);
-      } else if (scrollHeight - currentPosition === windowHeight) {
+      } else if (this.isScrolledToBottom()) {
         // User is at the bottom of the build log.
 
         this.toggleDisableButton(this.$scrollTopBtn, false);
@@ -131,9 +126,17 @@ export default class Job {
     }
   }
 
+  isScrolledToBottom() {
+    const currentPosition = this.$document.scrollTop();
+    const scrollHeight = this.$document.height();
+
+    const windowHeight = this.$window.height();
+    return scrollHeight - currentPosition === windowHeight;
+  }
+
   // eslint-disable-next-line class-methods-use-this
   scrollDown() {
-    $(document).scrollTop($(document).height());
+    this.$document.scrollTop(this.$document.height());
   }
 
   scrollToBottom() {
@@ -143,7 +146,7 @@ export default class Job {
   }
 
   scrollToTop() {
-    $(document).scrollTop(0);
+    this.$document.scrollTop(0);
     this.hasBeenScrolled = true;
     this.toggleScroll();
   }
@@ -174,7 +177,7 @@ export default class Job {
           this.state = log.state;
         }
 
-        this.windowSize = this.$buildTraceOutput.height();
+        this.isScrollInBottom = this.isScrolledToBottom();
 
         if (log.append) {
           this.$buildTraceOutput.append(log.html);
@@ -194,14 +197,9 @@ export default class Job {
         } else {
           this.$truncatedInfo.addClass('hidden');
         }
+        this.isLogComplete = log.complete;
 
         if (!log.complete) {
-          if (!this.hasBeenScrolled) {
-            this.toggleScrollAnimation(true);
-          } else {
-            this.toggleScrollAnimation(false);
-          }
-
           this.timeout = setTimeout(() => {
             this.getBuildTrace();
           }, 4000);
@@ -218,7 +216,7 @@ export default class Job {
         this.$buildRefreshAnimation.remove();
       })
       .then(() => {
-        if (!this.hasBeenScrolled) {
+        if (this.isScrollInBottom) {
           this.scrollDown();
         }
       })
diff --git a/app/assets/javascripts/labels_select.js b/app/assets/javascripts/labels_select.js
index 9b35efcb499..f7a1c9f1e40 100644
--- a/app/assets/javascripts/labels_select.js
+++ b/app/assets/javascripts/labels_select.js
@@ -7,7 +7,7 @@ import DropdownUtils from './filtered_search/dropdown_utils';
 import CreateLabelDropdown from './create_label';
 
 export default class LabelsSelect {
-  constructor(els) {
+  constructor(els, options = {}) {
     var _this, $els;
     _this = this;
 
@@ -57,6 +57,7 @@ export default class LabelsSelect {
         labelHTMLTemplate = _.template('<% _.each(labels, function(label){ %> <a href="<%- ["",issueURLSplit[1], issueURLSplit[2],""].join("/") %>issues?label_name[]=<%- encodeURIComponent(label.title) %>"> <span class="label has-tooltip color-label" title="<%- label.description %>" style="background-color: <%- label.color %>; color: <%- label.text_color %>;"> <%- label.title %> </span> </a> <% }); %>');
         labelNoneHTMLTemplate = '<span class="no-value">None</span>';
       }
+      const handleClick = options.handleClick;
 
       $sidebarLabelTooltip.tooltip();
 
@@ -390,6 +391,10 @@ export default class LabelsSelect {
               .then(fadeOutLoader)
               .catch(fadeOutLoader);
           }
+          else if (handleClick) {
+            e.preventDefault();
+            handleClick(label);
+          }
           else {
             if ($dropdown.hasClass('js-multiselect')) {
 
diff --git a/app/assets/javascripts/lib/utils/common_utils.js b/app/assets/javascripts/lib/utils/common_utils.js
index 07899777a1e..195e2ca6a78 100644
--- a/app/assets/javascripts/lib/utils/common_utils.js
+++ b/app/assets/javascripts/lib/utils/common_utils.js
@@ -172,7 +172,6 @@ export const getSelectedFragment = () => {
   return documentFragment;
 };
 
-// TODO: Update this name, there is a gl.text.insertText function.
 export const insertText = (target, text) => {
   // Firefox doesn't support `document.execCommand('insertText', false, text)` on textareas
   const selectionStart = target.selectionStart;
@@ -311,6 +310,42 @@ export const setParamInURL = (param, value) => {
 };
 
 /**
+ * Given a string of query parameters creates an object.
+ *
+ * @example
+ * `scope=all&page=2` -> { scope: 'all', page: '2'}
+ * `scope=all` -> { scope: 'all' }
+ * ``-> {}
+ * @param {String} query
+ * @returns {Object}
+ */
+export const parseQueryStringIntoObject = (query = '') => {
+  if (query === '') return {};
+
+  return query
+    .split('&')
+    .reduce((acc, element) => {
+      const val = element.split('=');
+      Object.assign(acc, {
+        [val[0]]: decodeURIComponent(val[1]),
+      });
+      return acc;
+    }, {});
+};
+
+export const buildUrlWithCurrentLocation = param => (param ? `${window.location.pathname}${param}` : window.location.pathname);
+
+/**
+ * Based on the current location and the string parameters provided
+ * creates a new entry in the history without reloading the page.
+ *
+ * @param {String} param
+ */
+export const historyPushState = (newUrl) => {
+  window.history.pushState({}, document.title, newUrl);
+};
+
+/**
  * Converts permission provided as strings to booleans.
  *
  * @param  {String} string
diff --git a/app/assets/javascripts/lib/utils/datetime_utility.js b/app/assets/javascripts/lib/utils/datetime_utility.js
index 29fc91733b3..5679b8c9a09 100644
--- a/app/assets/javascripts/lib/utils/datetime_utility.js
+++ b/app/assets/javascripts/lib/utils/datetime_utility.js
@@ -2,6 +2,7 @@
 
 import timeago from 'timeago.js';
 import dateFormat from 'vendor/date.format';
+import { pluralize } from './text_utility';
 
 import {
   lang,
@@ -143,9 +144,9 @@ export function timeIntervalInWords(intervalInSeconds) {
   let text = '';
 
   if (minutes >= 1) {
-    text = `${minutes} ${gl.text.pluralize('minute', minutes)} ${seconds} ${gl.text.pluralize('second', seconds)}`;
+    text = `${minutes} ${pluralize('minute', minutes)} ${seconds} ${pluralize('second', seconds)}`;
   } else {
-    text = `${seconds} ${gl.text.pluralize('second', seconds)}`;
+    text = `${seconds} ${pluralize('second', seconds)}`;
   }
   return text;
 }
diff --git a/app/assets/javascripts/lib/utils/number_utils.js b/app/assets/javascripts/lib/utils/number_utils.js
index 917a45eb06b..a02c79b787e 100644
--- a/app/assets/javascripts/lib/utils/number_utils.js
+++ b/app/assets/javascripts/lib/utils/number_utils.js
@@ -52,3 +52,31 @@ export function bytesToKiB(number) {
 export function bytesToMiB(number) {
   return number / (BYTES_IN_KIB * BYTES_IN_KIB);
 }
+
+/**
+ * Utility function that calculates GiB of the given bytes.
+ * @param {Number} number
+ * @returns {Number}
+ */
+export function bytesToGiB(number) {
+  return number / (BYTES_IN_KIB * BYTES_IN_KIB * BYTES_IN_KIB);
+}
+
+/**
+ * Port of rails number_to_human_size
+ * Formats the bytes in number into a more understandable
+ * representation (e.g., giving it 1500 yields 1.5 KB).
+ *
+ * @param {Number} size
+ * @returns {String}
+ */
+export function numberToHumanSize(size) {
+  if (size < BYTES_IN_KIB) {
+    return `${size} bytes`;
+  } else if (size < BYTES_IN_KIB * BYTES_IN_KIB) {
+    return `${bytesToKiB(size).toFixed(2)} KiB`;
+  } else if (size < BYTES_IN_KIB * BYTES_IN_KIB * BYTES_IN_KIB) {
+    return `${bytesToMiB(size).toFixed(2)} MiB`;
+  }
+  return `${bytesToGiB(size).toFixed(2)} GiB`;
+}
diff --git a/app/assets/javascripts/lib/utils/poll.js b/app/assets/javascripts/lib/utils/poll.js
index 1485e900945..65a8cf2c891 100644
--- a/app/assets/javascripts/lib/utils/poll.js
+++ b/app/assets/javascripts/lib/utils/poll.js
@@ -60,7 +60,6 @@ export default class Poll {
   checkConditions(response) {
     const headers = normalizeHeaders(response.headers);
     const pollInterval = parseInt(headers[this.intervalHeader], 10);
-
     if (pollInterval > 0 && response.status === httpStatusCodes.OK && this.canPoll) {
       this.timeoutID = setTimeout(() => {
         this.makeRequest();
@@ -102,7 +101,12 @@ export default class Poll {
   /**
    * Restarts polling after it has been stoped
    */
-  restart() {
+  restart(options) {
+    // update data
+    if (options && options.data) {
+      this.options.data = options.data;
+    }
+
     this.canPoll = true;
     this.makeRequest();
   }
diff --git a/app/assets/javascripts/lib/utils/text_markdown.js b/app/assets/javascripts/lib/utils/text_markdown.js
new file mode 100644
index 00000000000..2dc9cf0cc29
--- /dev/null
+++ b/app/assets/javascripts/lib/utils/text_markdown.js
@@ -0,0 +1,153 @@
+/* eslint-disable import/prefer-default-export, func-names, space-before-function-paren, wrap-iife, no-var, no-param-reassign, no-cond-assign, quotes, one-var, one-var-declaration-per-line, operator-assignment, no-else-return, prefer-template, prefer-arrow-callback, no-empty, max-len, consistent-return, no-unused-vars, no-return-assign, max-len, vars-on-top */
+
+const textUtils = {};
+
+textUtils.selectedText = function(text, textarea) {
+  return text.substring(textarea.selectionStart, textarea.selectionEnd);
+};
+
+textUtils.lineBefore = function(text, textarea) {
+  var split;
+  split = text.substring(0, textarea.selectionStart).trim().split('\n');
+  return split[split.length - 1];
+};
+
+textUtils.lineAfter = function(text, textarea) {
+  return text.substring(textarea.selectionEnd).trim().split('\n')[0];
+};
+
+textUtils.blockTagText = function(text, textArea, blockTag, selected) {
+  var lineAfter, lineBefore;
+  lineBefore = this.lineBefore(text, textArea);
+  lineAfter = this.lineAfter(text, textArea);
+  if (lineBefore === blockTag && lineAfter === blockTag) {
+    // To remove the block tag we have to select the line before & after
+    if (blockTag != null) {
+      textArea.selectionStart = textArea.selectionStart - (blockTag.length + 1);
+      textArea.selectionEnd = textArea.selectionEnd + (blockTag.length + 1);
+    }
+    return selected;
+  } else {
+    return blockTag + "\n" + selected + "\n" + blockTag;
+  }
+};
+
+textUtils.insertText = function(textArea, text, tag, blockTag, selected, wrap) {
+  var insertText, inserted, selectedSplit, startChar, removedLastNewLine, removedFirstNewLine, currentLineEmpty, lastNewLine;
+  removedLastNewLine = false;
+  removedFirstNewLine = false;
+  currentLineEmpty = false;
+
+  // Remove the first newline
+  if (selected.indexOf('\n') === 0) {
+    removedFirstNewLine = true;
+    selected = selected.replace(/\n+/, '');
+  }
+
+  // Remove the last newline
+  if (textArea.selectionEnd - textArea.selectionStart > selected.replace(/\n$/, '').length) {
+    removedLastNewLine = true;
+    selected = selected.replace(/\n$/, '');
+  }
+
+  selectedSplit = selected.split('\n');
+
+  if (!wrap) {
+    lastNewLine = textArea.value.substr(0, textArea.selectionStart).lastIndexOf('\n');
+
+    // Check whether the current line is empty or consists only of spaces(=handle as empty)
+    if (/^\s*$/.test(textArea.value.substring(lastNewLine, textArea.selectionStart))) {
+      currentLineEmpty = true;
+    }
+  }
+
+  startChar = !wrap && !currentLineEmpty && textArea.selectionStart > 0 ? '\n' : '';
+
+  if (selectedSplit.length > 1 && (!wrap || (blockTag != null && blockTag !== ''))) {
+    if (blockTag != null && blockTag !== '') {
+      insertText = this.blockTagText(text, textArea, blockTag, selected);
+    } else {
+      insertText = selectedSplit.map(function(val) {
+        if (val.indexOf(tag) === 0) {
+          return "" + (val.replace(tag, ''));
+        } else {
+          return "" + tag + val;
+        }
+      }).join('\n');
+    }
+  } else {
+    insertText = "" + startChar + tag + selected + (wrap ? tag : ' ');
+  }
+
+  if (removedFirstNewLine) {
+    insertText = '\n' + insertText;
+  }
+
+  if (removedLastNewLine) {
+    insertText += '\n';
+  }
+
+  if (document.queryCommandSupported('insertText')) {
+    inserted = document.execCommand('insertText', false, insertText);
+  }
+  if (!inserted) {
+    try {
+      document.execCommand("ms-beginUndoUnit");
+    } catch (error) {}
+    textArea.value = this.replaceRange(text, textArea.selectionStart, textArea.selectionEnd, insertText);
+    try {
+      document.execCommand("ms-endUndoUnit");
+    } catch (error) {}
+  }
+  return this.moveCursor(textArea, tag, wrap, removedLastNewLine);
+};
+
+textUtils.moveCursor = function(textArea, tag, wrapped, removedLastNewLine) {
+  var pos;
+  if (!textArea.setSelectionRange) {
+    return;
+  }
+  if (textArea.selectionStart === textArea.selectionEnd) {
+    if (wrapped) {
+      pos = textArea.selectionStart - tag.length;
+    } else {
+      pos = textArea.selectionStart;
+    }
+
+    if (removedLastNewLine) {
+      pos -= 1;
+    }
+
+    return textArea.setSelectionRange(pos, pos);
+  }
+};
+
+textUtils.updateText = function(textArea, tag, blockTag, wrap) {
+  var $textArea, selected, text;
+  $textArea = $(textArea);
+  textArea = $textArea.get(0);
+  text = $textArea.val();
+  selected = this.selectedText(text, textArea);
+  $textArea.focus();
+  return this.insertText(textArea, text, tag, blockTag, selected, wrap);
+};
+
+textUtils.init = function(form) {
+  var self;
+  self = this;
+  return $('.js-md', form).off('click').on('click', function() {
+    var $this;
+    $this = $(this);
+    return self.updateText($this.closest('.md-area').find('textarea'), $this.data('md-tag'), $this.data('md-block'), !$this.data('md-prepend'));
+  });
+};
+
+textUtils.removeListeners = function(form) {
+  return $('.js-md', form).off('click');
+};
+
+textUtils.replaceRange = function(s, start, end, substitute) {
+  return s.substring(0, start) + substitute + s.substring(end);
+};
+
+export default textUtils;
diff --git a/app/assets/javascripts/lib/utils/text_utility.js b/app/assets/javascripts/lib/utils/text_utility.js
index f776829f69c..a1475b92c7e 100644
--- a/app/assets/javascripts/lib/utils/text_utility.js
+++ b/app/assets/javascripts/lib/utils/text_utility.js
@@ -1,18 +1,13 @@
-/* eslint-disable import/prefer-default-export, func-names, space-before-function-paren, wrap-iife, no-var, no-param-reassign, no-cond-assign, quotes, one-var, one-var-declaration-per-line, operator-assignment, no-else-return, prefer-template, prefer-arrow-callback, no-empty, max-len, consistent-return, no-unused-vars, no-return-assign, max-len, vars-on-top */
-
-import 'vendor/latinise';
-
-var base;
-var w = window;
-if (w.gl == null) {
-  w.gl = {};
-}
-if ((base = w.gl).text == null) {
-  base.text = {};
-}
-gl.text.addDelimiter = function(text) {
-  return text ? text.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") : text;
-};
+/**
+ * Adds a , to a string composed by numbers, at every 3 chars.
+ *
+ * 2333 -> 2,333
+ * 232324 -> 232,324
+ *
+ * @param {String} text
+ * @returns {String}
+ */
+export const addDelimiter = text => (text ? text.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') : text);
 
 /**
  * Returns '99+' for numbers bigger than 99.
@@ -20,178 +15,43 @@ gl.text.addDelimiter = function(text) {
  * @param {Number} count
  * @return {Number|String}
  */
-export function highCountTrim(count) {
-  return count > 99 ? '99+' : count;
-}
-
-gl.text.randomString = function() {
-  return Math.random().toString(36).substring(7);
-};
-gl.text.replaceRange = function(s, start, end, substitute) {
-  return s.substring(0, start) + substitute + s.substring(end);
-};
-gl.text.getTextWidth = function(text, font) {
-  /**
-  * Uses canvas.measureText to compute and return the width of the given text of given font in pixels.
-  *
-  * @param {String} text The text to be rendered.
-  * @param {String} font The css font descriptor that text is to be rendered with (e.g. "bold 14px verdana").
-  *
-  * @see http://stackoverflow.com/questions/118241/calculate-text-width-with-javascript/21015393#21015393
-  */
-  // re-use canvas object for better performance
-  var canvas = gl.text.getTextWidth.canvas || (gl.text.getTextWidth.canvas = document.createElement('canvas'));
-  var context = canvas.getContext('2d');
-  context.font = font;
-  return context.measureText(text).width;
-};
-gl.text.selectedText = function(text, textarea) {
-  return text.substring(textarea.selectionStart, textarea.selectionEnd);
-};
-gl.text.lineBefore = function(text, textarea) {
-  var split;
-  split = text.substring(0, textarea.selectionStart).trim().split('\n');
-  return split[split.length - 1];
-};
-gl.text.lineAfter = function(text, textarea) {
-  return text.substring(textarea.selectionEnd).trim().split('\n')[0];
-};
-gl.text.blockTagText = function(text, textArea, blockTag, selected) {
-  var lineAfter, lineBefore;
-  lineBefore = this.lineBefore(text, textArea);
-  lineAfter = this.lineAfter(text, textArea);
-  if (lineBefore === blockTag && lineAfter === blockTag) {
-    // To remove the block tag we have to select the line before & after
-    if (blockTag != null) {
-      textArea.selectionStart = textArea.selectionStart - (blockTag.length + 1);
-      textArea.selectionEnd = textArea.selectionEnd + (blockTag.length + 1);
-    }
-    return selected;
-  } else {
-    return blockTag + "\n" + selected + "\n" + blockTag;
-  }
-};
-gl.text.insertText = function(textArea, text, tag, blockTag, selected, wrap) {
-  var insertText, inserted, selectedSplit, startChar, removedLastNewLine, removedFirstNewLine, currentLineEmpty, lastNewLine;
-  removedLastNewLine = false;
-  removedFirstNewLine = false;
-  currentLineEmpty = false;
-
-  // Remove the first newline
-  if (selected.indexOf('\n') === 0) {
-    removedFirstNewLine = true;
-    selected = selected.replace(/\n+/, '');
-  }
-
-  // Remove the last newline
-  if (textArea.selectionEnd - textArea.selectionStart > selected.replace(/\n$/, '').length) {
-    removedLastNewLine = true;
-    selected = selected.replace(/\n$/, '');
-  }
-
-  selectedSplit = selected.split('\n');
-
-  if (!wrap) {
-    lastNewLine = textArea.value.substr(0, textArea.selectionStart).lastIndexOf('\n');
-
-    // Check whether the current line is empty or consists only of spaces(=handle as empty)
-    if (/^\s*$/.test(textArea.value.substring(lastNewLine, textArea.selectionStart))) {
-      currentLineEmpty = true;
-    }
-  }
-
-  startChar = !wrap && !currentLineEmpty && textArea.selectionStart > 0 ? '\n' : '';
+export const highCountTrim = count => (count > 99 ? '99+' : count);
 
-  if (selectedSplit.length > 1 && (!wrap || (blockTag != null && blockTag !== ''))) {
-    if (blockTag != null && blockTag !== '') {
-      insertText = this.blockTagText(text, textArea, blockTag, selected);
-    } else {
-      insertText = selectedSplit.map(function(val) {
-        if (val.indexOf(tag) === 0) {
-          return "" + (val.replace(tag, ''));
-        } else {
-          return "" + tag + val;
-        }
-      }).join('\n');
-    }
-  } else {
-    insertText = "" + startChar + tag + selected + (wrap ? tag : ' ');
-  }
+/**
+ * Converts first char to uppercase and replaces undercores with spaces
+ * @param {String} string
+ * @requires {String}
+ */
+export const humanize = string => string.charAt(0).toUpperCase() + string.replace(/_/g, ' ').slice(1);
 
-  if (removedFirstNewLine) {
-    insertText = '\n' + insertText;
-  }
+/**
+ * Adds an 's' to the end of the string when count is bigger than 0
+ * @param {String} str
+ * @param {Number} count
+ * @returns {String}
+ */
+export const pluralize = (str, count) => str + (count > 1 || count === 0 ? 's' : '');
 
-  if (removedLastNewLine) {
-    insertText += '\n';
-  }
+/**
+ * Replaces underscores with dashes
+ * @param {*} str
+ * @returns {String}
+ */
+export const dasherize = str => str.replace(/[_\s]+/g, '-');
 
-  if (document.queryCommandSupported('insertText')) {
-    inserted = document.execCommand('insertText', false, insertText);
-  }
-  if (!inserted) {
-    try {
-      document.execCommand("ms-beginUndoUnit");
-    } catch (error) {}
-    textArea.value = this.replaceRange(text, textArea.selectionStart, textArea.selectionEnd, insertText);
-    try {
-      document.execCommand("ms-endUndoUnit");
-    } catch (error) {}
-  }
-  return this.moveCursor(textArea, tag, wrap, removedLastNewLine);
-};
-gl.text.moveCursor = function(textArea, tag, wrapped, removedLastNewLine) {
-  var pos;
-  if (!textArea.setSelectionRange) {
-    return;
-  }
-  if (textArea.selectionStart === textArea.selectionEnd) {
-    if (wrapped) {
-      pos = textArea.selectionStart - tag.length;
-    } else {
-      pos = textArea.selectionStart;
-    }
+/**
+ * Removes accents and converts to lower case
+ * @param {String} str
+ * @returns {String}
+ */
+export const slugify = str => str.trim().toLowerCase();
 
-    if (removedLastNewLine) {
-      pos -= 1;
-    }
+/**
+ * Truncates given text
+ *
+ * @param {String} string
+ * @param {Number} maxLength
+ * @returns {String}
+ */
+export const truncate = (string, maxLength) => `${string.substr(0, (maxLength - 3))}...`;
 
-    return textArea.setSelectionRange(pos, pos);
-  }
-};
-gl.text.updateText = function(textArea, tag, blockTag, wrap) {
-  var $textArea, selected, text;
-  $textArea = $(textArea);
-  textArea = $textArea.get(0);
-  text = $textArea.val();
-  selected = this.selectedText(text, textArea);
-  $textArea.focus();
-  return this.insertText(textArea, text, tag, blockTag, selected, wrap);
-};
-gl.text.init = function(form) {
-  var self;
-  self = this;
-  return $('.js-md', form).off('click').on('click', function() {
-    var $this;
-    $this = $(this);
-    return self.updateText($this.closest('.md-area').find('textarea'), $this.data('md-tag'), $this.data('md-block'), !$this.data('md-prepend'));
-  });
-};
-gl.text.removeListeners = function(form) {
-  return $('.js-md', form).off('click');
-};
-gl.text.humanize = function(string) {
-  return string.charAt(0).toUpperCase() + string.replace(/_/g, ' ').slice(1);
-};
-gl.text.pluralize = function(str, count) {
-  return str + (count > 1 || count === 0 ? 's' : '');
-};
-gl.text.truncate = function(string, maxLength) {
-  return string.substr(0, (maxLength - 3)) + '...';
-};
-gl.text.dasherize = function(str) {
-  return str.replace(/[_\s]+/g, '-');
-};
-gl.text.slugify = function(str) {
-  return str.trim().toLowerCase().latinise();
-};
diff --git a/app/assets/javascripts/lib/utils/url_utility.js b/app/assets/javascripts/lib/utils/url_utility.js
index 1aa63216baf..17236c91490 100644
--- a/app/assets/javascripts/lib/utils/url_utility.js
+++ b/app/assets/javascripts/lib/utils/url_utility.js
@@ -100,6 +100,10 @@ export function visitUrl(url, external = false) {
   }
 }
 
+export function redirectTo(url) {
+  return window.location.assign(url);
+}
+
 window.gl = window.gl || {};
 window.gl.utils = {
   ...(window.gl.utils || {}),
diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js
index 9117f033c9f..0035dd23011 100644
--- a/app/assets/javascripts/main.js
+++ b/app/assets/javascripts/main.js
@@ -30,7 +30,6 @@ import './commit/image_file';
 import { handleLocationHash } from './lib/utils/common_utils';
 import './lib/utils/datetime_utility';
 import './lib/utils/pretty_time';
-import './lib/utils/text_utility';
 import './lib/utils/url_utility';
 
 // behaviors
@@ -46,7 +45,6 @@ import './commits';
 import './compare';
 import './compare_autocomplete';
 import './confirm_danger_modal';
-import './copy_as_gfm';
 import './copy_to_clipboard';
 import Flash, { removeFlashClickListener } from './flash';
 import './gl_dropdown';
@@ -71,8 +69,6 @@ import './notifications_dropdown';
 import './notifications_form';
 import './pager';
 import './preview_markdown';
-import './project';
-import './project_avatar';
 import './project_find_file';
 import './project_import';
 import './project_label_subscription';
diff --git a/app/assets/javascripts/members.js b/app/assets/javascripts/members.js
index 6264750a4fb..52315e969d1 100644
--- a/app/assets/javascripts/members.js
+++ b/app/assets/javascripts/members.js
@@ -5,7 +5,6 @@ export default class Members {
   }
 
   addListeners() {
-    $('.project_member, .group_member').off('ajax:success').on('ajax:success', this.removeRow);
     $('.js-member-update-control').off('change').on('change', this.formSubmit.bind(this));
     $('.js-edit-member-form').off('ajax:success').on('ajax:success', this.formSuccess.bind(this));
     gl.utils.disableButtonIfEmptyField('#user_ids', 'input[name=commit]', 'change');
@@ -33,17 +32,6 @@ export default class Members {
       });
     });
   }
-  // eslint-disable-next-line class-methods-use-this
-  removeRow(e) {
-    const $target = $(e.target);
-
-    if ($target.hasClass('btn-remove')) {
-      $target.closest('.member')
-        .fadeOut(function fadeOutMemberRow() {
-          $(this).remove();
-        });
-    }
-  }
 
   formSubmit(e, $el = null) {
     const $this = e ? $(e.currentTarget) : $el;
diff --git a/app/assets/javascripts/merge_request.js b/app/assets/javascripts/merge_request.js
index af0658eb668..d30ff12bb59 100644
--- a/app/assets/javascripts/merge_request.js
+++ b/app/assets/javascripts/merge_request.js
@@ -5,6 +5,7 @@ import 'vendor/jquery.waitforimages';
 import TaskList from './task_list';
 import './merge_request_tabs';
 import IssuablesHelper from './helpers/issuables_helper';
+import { addDelimiter } from './lib/utils/text_utility';
 
 (function() {
   this.MergeRequest = (function() {
@@ -124,7 +125,7 @@ import IssuablesHelper from './helpers/issuables_helper';
       const $el = $('.nav-links .js-merge-counter');
       const count = Math.max((parseInt($el.text().replace(/[^\d]/, ''), 10) - by), 0);
 
-      $el.text(gl.text.addDelimiter(count));
+      $el.text(addDelimiter(count));
     };
 
     MergeRequest.prototype.hideCloseButton = function() {
diff --git a/app/assets/javascripts/milestone_select.js b/app/assets/javascripts/milestone_select.js
index e7d5325a509..74e5a4f1cea 100644
--- a/app/assets/javascripts/milestone_select.js
+++ b/app/assets/javascripts/milestone_select.js
@@ -5,7 +5,7 @@ import _ from 'underscore';
 
 (function() {
   this.MilestoneSelect = (function() {
-    function MilestoneSelect(currentProject, els) {
+    function MilestoneSelect(currentProject, els, options = {}) {
       var _this, $els;
       if (currentProject != null) {
         _this = this;
@@ -136,19 +136,26 @@ import _ from 'underscore';
           },
           opened: function(e) {
             const $el = $(e.currentTarget);
-            if ($dropdown.hasClass('js-issue-board-sidebar')) {
+            if ($dropdown.hasClass('js-issue-board-sidebar') || options.handleClick) {
               selectedMilestone = $dropdown[0].dataset.selected || selectedMilestoneDefault;
             }
             $('a.is-active', $el).removeClass('is-active');
             $(`[data-milestone-id="${selectedMilestone}"] > a`, $el).addClass('is-active');
           },
           vue: $dropdown.hasClass('js-issue-board-sidebar'),
-          clicked: function(options) {
-            const { $el, e } = options;
-            let selected = options.selectedObj;
+          clicked: function(clickEvent) {
+            const { $el, e } = clickEvent;
+            let selected = clickEvent.selectedObj;
 
             var data, isIssueIndex, isMRIndex, isSelecting, page, boardsStore;
             if (!selected) return;
+
+            if (options.handleClick) {
+              e.preventDefault();
+              options.handleClick(selected);
+              return;
+            }
+
             page = $('body').attr('data-page');
             isIssueIndex = page === 'projects:issues:index';
             isMRIndex = (page === page && page === 'projects:merge_requests:index');
diff --git a/app/assets/javascripts/monitoring/components/graph.vue b/app/assets/javascripts/monitoring/components/graph.vue
index 5aa3865f96a..f8782fde927 100644
--- a/app/assets/javascripts/monitoring/components/graph.vue
+++ b/app/assets/javascripts/monitoring/components/graph.vue
@@ -138,7 +138,7 @@
 
       renderAxesPaths() {
         this.timeSeries = createTimeSeries(
-          this.graphData.queries[0],
+          this.graphData.queries,
           this.graphWidth,
           this.graphHeight,
           this.graphHeightOffset,
@@ -153,8 +153,9 @@
         const axisYScale = d3.scale.linear()
           .range([this.graphHeight - this.graphHeightOffset, 0]);
 
-        axisXScale.domain(d3.extent(this.timeSeries[0].values, d => d.time));
-        axisYScale.domain([0, d3.max(this.timeSeries[0].values.map(d => d.value))]);
+        const allValues = this.timeSeries.reduce((all, { values }) => all.concat(values), []);
+        axisXScale.domain(d3.extent(allValues, d => d.time));
+        axisYScale.domain([0, d3.max(allValues.map(d => d.value))]);
 
         const xAxis = d3.svg.axis()
           .scale(axisXScale)
@@ -246,6 +247,7 @@
               :key="index"
               :generated-line-path="path.linePath"
               :generated-area-path="path.areaPath"
+              :line-style="path.lineStyle"
               :line-color="path.lineColor"
               :area-color="path.areaColor"
             />
diff --git a/app/assets/javascripts/monitoring/components/graph/legend.vue b/app/assets/javascripts/monitoring/components/graph/legend.vue
index 85b6d7f4cbe..440b1b12631 100644
--- a/app/assets/javascripts/monitoring/components/graph/legend.vue
+++ b/app/assets/javascripts/monitoring/components/graph/legend.vue
@@ -79,7 +79,8 @@
       },
 
       formatMetricUsage(series) {
-        const value = series.values[this.currentDataIndex].value;
+        const value = series.values[this.currentDataIndex] &&
+          series.values[this.currentDataIndex].value;
         if (isNaN(value)) {
           return '-';
         }
@@ -92,6 +93,12 @@
         }
         return `${this.legendTitle} series ${index + 1} ${this.formatMetricUsage(series)}`;
       },
+
+      strokeDashArray(type) {
+        if (type === 'dashed') return '6, 3';
+        if (type === 'dotted') return '3, 3';
+        return null;
+      },
     },
     mounted() {
       this.$nextTick(() => {
@@ -162,13 +169,15 @@
       v-for="(series, index) in timeSeries"
       :key="index"
       :transform="translateLegendGroup(index)">
-      <rect
-        :fill="series.areaColor"
-        :width="measurements.legends.width"
-        :height="measurements.legends.height"
-        x="20"
-        :y="graphHeight - measurements.legendOffset">
-      </rect>
+      <line
+        :stroke="series.lineColor"
+        :stroke-width="measurements.legends.height"
+        :stroke-dasharray="strokeDashArray(series.lineStyle)"
+        :x1="measurements.legends.offsetX"
+        :x2="measurements.legends.offsetX + measurements.legends.width"
+        :y1="graphHeight - measurements.legends.offsetY"
+        :y2="graphHeight - measurements.legends.offsetY">
+      </line>
       <text
         v-if="timeSeries.length > 1"
         class="legend-metric-title"
diff --git a/app/assets/javascripts/monitoring/components/graph/path.vue b/app/assets/javascripts/monitoring/components/graph/path.vue
index 043f1bf66bb..5e6d409033a 100644
--- a/app/assets/javascripts/monitoring/components/graph/path.vue
+++ b/app/assets/javascripts/monitoring/components/graph/path.vue
@@ -9,6 +9,10 @@
         type: String,
         required: true,
       },
+      lineStyle: {
+        type: String,
+        required: false,
+      },
       lineColor: {
         type: String,
         required: true,
@@ -18,6 +22,13 @@
         required: true,
       },
     },
+    computed: {
+      strokeDashArray() {
+        if (this.lineStyle === 'dashed') return '3, 1';
+        if (this.lineStyle === 'dotted') return '1, 1';
+        return null;
+      },
+    },
   };
 </script>
 <template>
@@ -34,6 +45,7 @@
       :stroke="lineColor"
       fill="none"
       stroke-width="1"
+      :stroke-dasharray="strokeDashArray"
       transform="translate(-5, 20)">
     </path>
   </g>
diff --git a/app/assets/javascripts/monitoring/utils/measurements.js b/app/assets/javascripts/monitoring/utils/measurements.js
index ee3c45efacc..ee866850e13 100644
--- a/app/assets/javascripts/monitoring/utils/measurements.js
+++ b/app/assets/javascripts/monitoring/utils/measurements.js
@@ -7,15 +7,16 @@ export default {
       left: 40,
     },
     legends: {
-      width: 10,
+      width: 15,
       height: 3,
+      offsetX: 20,
+      offsetY: 32,
     },
     backgroundLegend: {
       width: 30,
       height: 50,
     },
     axisLabelLineOffset: -20,
-    legendOffset: 33,
   },
   large: { // This covers both md and lg screen sizes
     margin: {
@@ -27,13 +28,14 @@ export default {
     legends: {
       width: 15,
       height: 3,
+      offsetX: 20,
+      offsetY: 34,
     },
     backgroundLegend: {
       width: 30,
       height: 150,
     },
     axisLabelLineOffset: 20,
-    legendOffset: 36,
   },
   xTicks: 8,
   yTicks: 3,
diff --git a/app/assets/javascripts/monitoring/utils/multiple_time_series.js b/app/assets/javascripts/monitoring/utils/multiple_time_series.js
index 65eec0d8d02..d21a265bd43 100644
--- a/app/assets/javascripts/monitoring/utils/multiple_time_series.js
+++ b/app/assets/javascripts/monitoring/utils/multiple_time_series.js
@@ -11,7 +11,9 @@ const defaultColorPalette = {
 
 const defaultColorOrder = ['blue', 'orange', 'red', 'green', 'purple'];
 
-export default function createTimeSeries(queryData, graphWidth, graphHeight, graphHeightOffset) {
+const defaultStyleOrder = ['solid', 'dashed', 'dotted'];
+
+function queryTimeSeries(query, graphWidth, graphHeight, graphHeightOffset, xDom, yDom, lineStyle) {
   let usedColors = [];
 
   function pickColor(name) {
@@ -31,17 +33,7 @@ export default function createTimeSeries(queryData, graphWidth, graphHeight, gra
     return defaultColorPalette[pick];
   }
 
-  const maxValues = queryData.result.map((timeSeries, index) => {
-    const maxValue = d3.max(timeSeries.values.map(d => d.value));
-    return {
-      maxValue,
-      index,
-    };
-  });
-
-  const maxValueFromSeries = _.max(maxValues, val => val.maxValue);
-
-  return queryData.result.map((timeSeries, timeSeriesNumber) => {
+  return query.result.map((timeSeries, timeSeriesNumber) => {
     let metricTag = '';
     let lineColor = '';
     let areaColor = '';
@@ -52,9 +44,9 @@ export default function createTimeSeries(queryData, graphWidth, graphHeight, gra
     const timeSeriesScaleY = d3.scale.linear()
       .range([graphHeight - graphHeightOffset, 0]);
 
-    timeSeriesScaleX.domain(d3.extent(timeSeries.values, d => d.time));
+    timeSeriesScaleX.domain(xDom);
     timeSeriesScaleX.ticks(d3.time.minute, 60);
-    timeSeriesScaleY.domain([0, maxValueFromSeries.maxValue]);
+    timeSeriesScaleY.domain(yDom);
 
     const defined = d => !isNaN(d.value) && d.value != null;
 
@@ -72,10 +64,10 @@ export default function createTimeSeries(queryData, graphWidth, graphHeight, gra
       .y1(d => timeSeriesScaleY(d.value));
 
     const timeSeriesMetricLabel = timeSeries.metric[Object.keys(timeSeries.metric)[0]];
-    const seriesCustomizationData = queryData.series != null &&
-                                    _.findWhere(queryData.series[0].when,
-                                    { value: timeSeriesMetricLabel });
-    if (seriesCustomizationData != null) {
+    const seriesCustomizationData = query.series != null &&
+      _.findWhere(query.series[0].when, { value: timeSeriesMetricLabel });
+
+    if (seriesCustomizationData) {
       metricTag = seriesCustomizationData.value || timeSeriesMetricLabel;
       [lineColor, areaColor] = pickColor(seriesCustomizationData.color);
     } else {
@@ -83,14 +75,35 @@ export default function createTimeSeries(queryData, graphWidth, graphHeight, gra
       [lineColor, areaColor] = pickColor();
     }
 
+    if (query.track) {
+      metricTag += ` - ${query.track}`;
+    }
+
     return {
       linePath: lineFunction(timeSeries.values),
       areaPath: areaFunction(timeSeries.values),
       timeSeriesScaleX,
       values: timeSeries.values,
+      lineStyle,
       lineColor,
       areaColor,
       metricTag,
     };
   });
 }
+
+export default function createTimeSeries(queries, graphWidth, graphHeight, graphHeightOffset) {
+  const allValues = queries.reduce((allQueryResults, query) => allQueryResults.concat(
+    query.result.reduce((allResults, result) => allResults.concat(result.values), []),
+  ), []);
+
+  const xDom = d3.extent(allValues, d => d.time);
+  const yDom = [0, d3.max(allValues.map(d => d.value))];
+
+  return queries.reduce((series, query, index) => {
+    const lineStyle = defaultStyleOrder[index % defaultStyleOrder.length];
+    return series.concat(
+      queryTimeSeries(query, graphWidth, graphHeight, graphHeightOffset, xDom, yDom, lineStyle),
+    );
+  }, []);
+}
diff --git a/app/assets/javascripts/notes/components/issue_comment_form.vue b/app/assets/javascripts/notes/components/issue_comment_form.vue
index db8f85759b2..30e02554b65 100644
--- a/app/assets/javascripts/notes/components/issue_comment_form.vue
+++ b/app/assets/javascripts/notes/components/issue_comment_form.vue
@@ -357,7 +357,8 @@
                   @click="handleSave(true)"
                   v-if="canUpdateIssue"
                   :class="actionButtonClassNames"
-                  class="btn btn-comment btn-comment-and-close">
+                  :disabled="isSubmitting"
+                  class="btn btn-comment btn-comment-and-close js-action-button">
                   {{issueActionButtonTitle}}
                 </button>
                 <button
diff --git a/app/assets/javascripts/notes/components/issue_discussion_locked_widget.vue b/app/assets/javascripts/notes/components/issue_discussion_locked_widget.vue
index e73ec2aaf71..64466b04b40 100644
--- a/app/assets/javascripts/notes/components/issue_discussion_locked_widget.vue
+++ b/app/assets/javascripts/notes/components/issue_discussion_locked_widget.vue
@@ -1,18 +1,21 @@
 <script>
+  import Icon from '../../vue_shared/components/icon.vue';
+
   export default {
-    computed: {
-      lockIcon() {
-        return gl.utils.spriteIcon('lock');
-      },
+    component: {
+      Icon,
     },
   };
-
 </script>
 
 <template>
   <div class="disabled-comment text-center">
-    <span class="issuable-note-warning">
-      <span class="icon" v-html="lockIcon"></span>
+    <span class="issuable-note-warning inline">
+      <icon
+        name="lock"
+        :size="16"
+        class="icon">
+      </icon>
       <span>This issue is locked. Only <b>project members</b> can comment.</span>
      </span>
   </div>
diff --git a/app/assets/javascripts/pipelines/components/graph/action_component.vue b/app/assets/javascripts/pipelines/components/graph/action_component.vue
index 547140b1a43..19d8e1f49cf 100644
--- a/app/assets/javascripts/pipelines/components/graph/action_component.vue
+++ b/app/assets/javascripts/pipelines/components/graph/action_component.vue
@@ -1,7 +1,7 @@
 <script>
   import tooltip from '../../../vue_shared/directives/tooltip';
   import icon from '../../../vue_shared/components/icon.vue';
-
+  import { dasherize } from '../../../lib/utils/text_utility';
   /**
    * Renders either a cancel, retry or play icon pointing to the given path.
    * TODO: Remove UJS from here and use an async request instead.
@@ -39,7 +39,7 @@
 
     computed: {
       cssClass() {
-        const actionIconDash = gl.text.dasherize(this.actionIcon);
+        const actionIconDash = dasherize(this.actionIcon);
         return `${actionIconDash} js-icon-${actionIconDash}`;
       },
     },
diff --git a/app/assets/javascripts/pipelines/components/navigation_tabs.vue b/app/assets/javascripts/pipelines/components/navigation_tabs.vue
index 73f7e3a0cad..07befd23500 100644
--- a/app/assets/javascripts/pipelines/components/navigation_tabs.vue
+++ b/app/assets/javascripts/pipelines/components/navigation_tabs.vue
@@ -2,16 +2,8 @@
   export default {
     name: 'PipelineNavigationTabs',
     props: {
-      scope: {
-        type: String,
-        required: true,
-      },
-      count: {
-        type: Object,
-        required: true,
-      },
-      paths: {
-        type: Object,
+      tabs: {
+        type: Array,
         required: true,
       },
     },
@@ -23,68 +15,37 @@
         // 0 is valid in a badge, but evaluates to false, we need to check for undefined
         return count !== undefined;
       },
+
+      onTabClick(tab) {
+        this.$emit('onChangeTab', tab.scope);
+      },
     },
 };
 </script>
 <template>
   <ul class="nav-links scrolling-tabs">
     <li
-      class="js-pipelines-tab-all"
-      :class="{ active: scope === 'all'}">
-      <a :href="paths.allPath">
-        All
-        <span
-          v-if="shouldRenderBadge(count.all)"
-          class="badge js-totalbuilds-count">
-          {{count.all}}
-        </span>
-      </a>
-    </li>
-    <li
-      class="js-pipelines-tab-pending"
-      :class="{ active: scope === 'pending'}">
-      <a :href="paths.pendingPath">
-        Pending
-        <span
-          v-if="shouldRenderBadge(count.pending)"
-          class="badge">
-          {{count.pending}}
-        </span>
-      </a>
-    </li>
-    <li
-      class="js-pipelines-tab-running"
-      :class="{ active: scope === 'running'}">
-      <a :href="paths.runningPath">
-        Running
-        <span
-          v-if="shouldRenderBadge(count.running)"
-          class="badge">
-          {{count.running}}
-        </span>
-      </a>
-    </li>
-    <li
-      class="js-pipelines-tab-finished"
-      :class="{ active: scope === 'finished'}">
-      <a :href="paths.finishedPath">
-        Finished
+      v-for="(tab, i) in tabs"
+      :key="i"
+      :class="{
+        active: tab.isActive,
+      }"
+      >
+      <a
+        role="button"
+        @click="onTabClick(tab)"
+        :class="`js-pipelines-tab-${tab.scope}`"
+        >
+        {{ tab.name }}
+
         <span
-          v-if="shouldRenderBadge(count.finished)"
-          class="badge">
-          {{count.finished}}
+          v-if="shouldRenderBadge(tab.count)"
+          class="badge"
+          >
+          {{tab.count}}
         </span>
+
       </a>
     </li>
-    <li
-      class="js-pipelines-tab-branches"
-      :class="{ active: scope === 'branches'}">
-      <a :href="paths.branchesPath">Branches</a>
-    </li>
-    <li
-      class="js-pipelines-tab-tags"
-      :class="{ active: scope === 'tags'}">
-      <a :href="paths.tagsPath">Tags</a>
-    </li>
   </ul>
 </template>
diff --git a/app/assets/javascripts/pipelines/components/pipelines.vue b/app/assets/javascripts/pipelines/components/pipelines.vue
index 3da60e88474..cf241c8ffed 100644
--- a/app/assets/javascripts/pipelines/components/pipelines.vue
+++ b/app/assets/javascripts/pipelines/components/pipelines.vue
@@ -1,10 +1,17 @@
 <script>
+  import _ from 'underscore';
   import PipelinesService from '../services/pipelines_service';
   import pipelinesMixin from '../mixins/pipelines';
   import tablePagination from '../../vue_shared/components/table_pagination.vue';
   import navigationTabs from './navigation_tabs.vue';
   import navigationControls from './nav_controls.vue';
-  import { convertPermissionToBoolean, getParameterByName, setParamInURL } from '../../lib/utils/common_utils';
+  import {
+    convertPermissionToBoolean,
+    getParameterByName,
+    historyPushState,
+    buildUrlWithCurrentLocation,
+    parseQueryStringIntoObject,
+  } from '../../lib/utils/common_utils';
 
   export default {
     props: {
@@ -41,27 +48,18 @@
         autoDevopsPath: pipelinesData.helpAutoDevopsPath,
         newPipelinePath: pipelinesData.newPipelinePath,
         canCreatePipeline: pipelinesData.canCreatePipeline,
-        allPath: pipelinesData.allPath,
-        pendingPath: pipelinesData.pendingPath,
-        runningPath: pipelinesData.runningPath,
-        finishedPath: pipelinesData.finishedPath,
-        branchesPath: pipelinesData.branchesPath,
-        tagsPath: pipelinesData.tagsPath,
         hasCi: pipelinesData.hasCi,
         ciLintPath: pipelinesData.ciLintPath,
         state: this.store.state,
-        apiScope: 'all',
-        pagenum: 1,
+        scope: getParameterByName('scope') || 'all',
+        page: getParameterByName('page') || '1',
+        requestData: {},
       };
     },
     computed: {
       canCreatePipelineParsed() {
         return convertPermissionToBoolean(this.canCreatePipeline);
       },
-      scope() {
-        const scope = getParameterByName('scope');
-        return scope === null ? 'all' : scope;
-      },
 
       /**
       * The empty state should only be rendered when the request is made to fetch all pipelines
@@ -106,46 +104,112 @@
       hasCiEnabled() {
         return this.hasCi !== undefined;
       },
-      paths() {
-        return {
-          allPath: this.allPath,
-          pendingPath: this.pendingPath,
-          finishedPath: this.finishedPath,
-          runningPath: this.runningPath,
-          branchesPath: this.branchesPath,
-          tagsPath: this.tagsPath,
-        };
-      },
-      pageParameter() {
-        return getParameterByName('page') || this.pagenum;
-      },
-      scopeParameter() {
-        return getParameterByName('scope') || this.apiScope;
+
+      tabs() {
+        const { count } = this.state;
+        return [
+          {
+            name: 'All',
+            scope: 'all',
+            count: count.all,
+            isActive: this.scope === 'all',
+          },
+          {
+            name: 'Pending',
+            scope: 'pending',
+            count: count.pending,
+            isActive: this.scope === 'pending',
+          },
+          {
+            name: 'Running',
+            scope: 'running',
+            count: count.running,
+            isActive: this.scope === 'running',
+          },
+          {
+            name: 'Finished',
+            scope: 'finished',
+            count: count.finished,
+            isActive: this.scope === 'finished',
+          },
+          {
+            name: 'Branches',
+            scope: 'branches',
+            isActive: this.scope === 'branches',
+          },
+          {
+            name: 'Tags',
+            scope: 'tags',
+            isActive: this.scope === 'tags',
+          },
+        ];
       },
     },
     created() {
       this.service = new PipelinesService(this.endpoint);
-      this.requestData = { page: this.pageParameter, scope: this.scopeParameter };
+      this.requestData = { page: this.page, scope: this.scope };
     },
     methods: {
+      successCallback(resp) {
+        return resp.json().then((response) => {
+          // Because we are polling & the user is interacting verify if the response received
+          // matches the last request made
+          if (_.isEqual(parseQueryStringIntoObject(resp.url.split('?')[1]), this.requestData)) {
+            this.store.storeCount(response.count);
+            this.store.storePagination(resp.headers);
+            this.setCommonData(response.pipelines);
+          }
+        });
+      },
       /**
-       * Will change the page number and update the URL.
-       *
-       * @param  {Number} pageNumber desired page to go to.
+       * Handles URL and query parameter changes.
+       * When the user uses the pagination or the tabs,
+       *  - update URL
+       *  - Make API request to the server with new parameters
+       *  - Update the polling function
+       *  - Update the internal state
        */
-      change(pageNumber) {
-        const param = setParamInURL('page', pageNumber);
+      updateContent(parameters) {
+        // stop polling
+        this.poll.stop();
+
+        const queryString = Object.keys(parameters).map((parameter) => {
+          const value = parameters[parameter];
+          // update internal state for UI
+          this[parameter] = value;
+          return `${parameter}=${encodeURIComponent(value)}`;
+        }).join('&');
 
-        gl.utils.visitUrl(param);
-        return param;
+        // update polling parameters
+        this.requestData = parameters;
+
+        historyPushState(buildUrlWithCurrentLocation(`?${queryString}`));
+
+        this.isLoading = true;
+        // fetch new data
+        return this.service.getPipelines(this.requestData)
+          .then((response) => {
+            this.isLoading = false;
+            this.successCallback(response);
+
+            // restart polling
+            this.poll.restart({ data: this.requestData });
+          })
+          .catch(() => {
+            this.isLoading = false;
+            this.errorCallback();
+
+            // restart polling
+            this.poll.restart();
+          });
       },
 
-      successCallback(resp) {
-        return resp.json().then((response) => {
-          this.store.storeCount(response.count);
-          this.store.storePagination(resp.headers);
-          this.setCommonData(response.pipelines);
-        });
+      onChangeTab(scope) {
+        this.updateContent({ scope, page: '1' });
+      },
+      onChangePage(page) {
+      /* URLS parameters are strings, we need to parse to match types */
+        this.updateContent({ scope: this.scope, page: Number(page).toString() });
       },
     },
   };
@@ -154,7 +218,7 @@
   <div class="pipelines-container">
     <div
       class="top-area scrolling-tabs-container inner-page-scroll-tabs"
-      v-if="!isLoading && !shouldRenderEmptyState">
+      v-if="!shouldRenderEmptyState">
       <div class="fade-left">
         <i
           class="fa fa-angle-left"
@@ -167,17 +231,17 @@
           aria-hidden="true">
         </i>
       </div>
+
       <navigation-tabs
-        :scope="scope"
-        :count="state.count"
-        :paths="paths"
+        :tabs="tabs"
+        @onChangeTab="onChangeTab"
         />
 
       <navigation-controls
         :new-pipeline-path="newPipelinePath"
         :has-ci-enabled="hasCiEnabled"
         :help-page-path="helpPagePath"
-        :ciLintPath="ciLintPath"
+        :ci-lint-path="ciLintPath"
         :can-create-pipeline="canCreatePipelineParsed "
         />
     </div>
@@ -188,6 +252,7 @@
         label="Loading Pipelines"
         size="3"
         v-if="isLoading"
+        class="prepend-top-20"
         />
 
       <empty-state
@@ -221,8 +286,8 @@
 
       <table-pagination
         v-if="shouldRenderPagination"
-        :change="change"
-        :pageInfo="state.pageInfo"
+        :change="onChangePage"
+        :page-info="state.pageInfo"
         />
     </div>
   </div>
diff --git a/app/assets/javascripts/project.js b/app/assets/javascripts/project.js
index fe6602259e2..ddb78aaeea1 100644
--- a/app/assets/javascripts/project.js
+++ b/app/assets/javascripts/project.js
@@ -1,139 +1,131 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, quotes, consistent-return, no-new, prefer-arrow-callback, no-return-assign, one-var, one-var-declaration-per-line, object-shorthand, comma-dangle, no-else-return, newline-per-chained-call, no-shadow, vars-on-top, prefer-template, max-len */
+/* eslint-disable func-names, space-before-function-paren, no-var, consistent-return, no-new, prefer-arrow-callback, no-return-assign, one-var, one-var-declaration-per-line, object-shorthand, no-else-return, newline-per-chained-call, no-shadow, vars-on-top, prefer-template, max-len */
 /* global ProjectSelect */
 
 import Cookies from 'js-cookie';
 
-(function() {
-  this.Project = (function() {
-    function Project() {
-      const $cloneOptions = $('ul.clone-options-dropdown');
-      const $projectCloneField = $('#project_clone');
-      const $cloneBtnText = $('a.clone-dropdown-btn span');
+export default class Project {
+  constructor() {
+    const $cloneOptions = $('ul.clone-options-dropdown');
+    const $projectCloneField = $('#project_clone');
+    const $cloneBtnText = $('a.clone-dropdown-btn span');
 
-      const selectedCloneOption = $cloneBtnText.text().trim();
-      if (selectedCloneOption.length > 0) {
-        $(`a:contains('${selectedCloneOption}')`, $cloneOptions).addClass('is-active');
-      }
-
-      $('a', $cloneOptions).on('click', (e) => {
-        const $this = $(e.currentTarget);
-        const url = $this.attr('href');
-
-        e.preventDefault();
-
-        $('.is-active', $cloneOptions).not($this).removeClass('is-active');
-        $this.toggleClass('is-active');
-        $projectCloneField.val(url);
-        $cloneBtnText.text($this.text());
-
-        return $('.clone').text(url);
-      });
-      // Ref switcher
-      this.initRefSwitcher();
-      $('.project-refs-select').on('change', function() {
-        return $(this).parents('form').submit();
-      });
-      $('.hide-no-ssh-message').on('click', function(e) {
-        Cookies.set('hide_no_ssh_message', 'false');
-        $(this).parents('.no-ssh-key-message').remove();
-        return e.preventDefault();
-      });
-      $('.hide-no-password-message').on('click', function(e) {
-        Cookies.set('hide_no_password_message', 'false');
-        $(this).parents('.no-password-message').remove();
-        return e.preventDefault();
-      });
-      this.projectSelectDropdown();
+    const selectedCloneOption = $cloneBtnText.text().trim();
+    if (selectedCloneOption.length > 0) {
+      $(`a:contains('${selectedCloneOption}')`, $cloneOptions).addClass('is-active');
     }
 
-    Project.prototype.projectSelectDropdown = function() {
-      new ProjectSelect();
-      $('.project-item-select').on('click', (function(_this) {
-        return function(e) {
-          return _this.changeProject($(e.currentTarget).val());
-        };
-      })(this));
-    };
-
-    Project.prototype.changeProject = function(url) {
-      return window.location = url;
-    };
-
-    Project.prototype.initRefSwitcher = function() {
-      var refListItem = document.createElement('li');
-      var refLink = document.createElement('a');
-
-      refLink.href = '#';
-
-      return $('.js-project-refs-dropdown').each(function() {
-        var $dropdown, selected;
-        $dropdown = $(this);
-        selected = $dropdown.data('selected');
-        return $dropdown.glDropdown({
-          data: function(term, callback) {
-            return $.ajax({
-              url: $dropdown.data('refs-url'),
-              data: {
-                ref: $dropdown.data('ref'),
-                search: term
-              },
-              dataType: "json"
-            }).done(function(refs) {
-              return callback(refs);
-            });
-          },
-          selectable: true,
-          filterable: true,
-          filterRemote: true,
-          filterByText: true,
-          inputFieldName: $dropdown.data('input-field-name'),
-          fieldName: $dropdown.data('field-name'),
-          renderRow: function(ref) {
-            var li = refListItem.cloneNode(false);
-
-            if (ref.header != null) {
-              li.className = 'dropdown-header';
-              li.textContent = ref.header;
-            } else {
-              var link = refLink.cloneNode(false);
-
-              if (ref === selected) {
-                link.className = 'is-active';
-              }
-
-              link.textContent = ref;
-              link.dataset.ref = ref;
-
-              li.appendChild(link);
+    $('a', $cloneOptions).on('click', (e) => {
+      const $this = $(e.currentTarget);
+      const url = $this.attr('href');
+
+      e.preventDefault();
+
+      $('.is-active', $cloneOptions).not($this).removeClass('is-active');
+      $this.toggleClass('is-active');
+      $projectCloneField.val(url);
+      $cloneBtnText.text($this.text());
+
+      return $('.clone').text(url);
+    });
+    // Ref switcher
+    Project.initRefSwitcher();
+    $('.project-refs-select').on('change', function() {
+      return $(this).parents('form').submit();
+    });
+    $('.hide-no-ssh-message').on('click', function(e) {
+      Cookies.set('hide_no_ssh_message', 'false');
+      $(this).parents('.no-ssh-key-message').remove();
+      return e.preventDefault();
+    });
+    $('.hide-no-password-message').on('click', function(e) {
+      Cookies.set('hide_no_password_message', 'false');
+      $(this).parents('.no-password-message').remove();
+      return e.preventDefault();
+    });
+    Project.projectSelectDropdown();
+  }
+
+  static projectSelectDropdown () {
+    new ProjectSelect();
+    $('.project-item-select').on('click', e => Project.changeProject($(e.currentTarget).val()));
+  }
+
+  static changeProject(url) {
+    return window.location = url;
+  }
+
+  static initRefSwitcher() {
+    var refListItem = document.createElement('li');
+    var refLink = document.createElement('a');
+
+    refLink.href = '#';
+
+    return $('.js-project-refs-dropdown').each(function() {
+      var $dropdown, selected;
+      $dropdown = $(this);
+      selected = $dropdown.data('selected');
+      return $dropdown.glDropdown({
+        data: function(term, callback) {
+          return $.ajax({
+            url: $dropdown.data('refs-url'),
+            data: {
+              ref: $dropdown.data('ref'),
+              search: term,
+            },
+            dataType: 'json',
+          }).done(function(refs) {
+            return callback(refs);
+          });
+        },
+        selectable: true,
+        filterable: true,
+        filterRemote: true,
+        filterByText: true,
+        inputFieldName: $dropdown.data('input-field-name'),
+        fieldName: $dropdown.data('field-name'),
+        renderRow: function(ref) {
+          var li = refListItem.cloneNode(false);
+
+          if (ref.header != null) {
+            li.className = 'dropdown-header';
+            li.textContent = ref.header;
+          } else {
+            var link = refLink.cloneNode(false);
+
+            if (ref === selected) {
+              link.className = 'is-active';
             }
 
-            return li;
-          },
-          id: function(obj, $el) {
-            return $el.attr('data-ref');
-          },
-          toggleLabel: function(obj, $el) {
-            return $el.text().trim();
-          },
-          clicked: function(options) {
-            const { e } = options;
-            e.preventDefault();
-            if ($('input[name="ref"]').length) {
-              var $form = $dropdown.closest('form');
-
-              var $visit = $dropdown.data('visit');
-              var shouldVisit = $visit ? true : $visit;
-              var action = $form.attr('action');
-              var divider = action.indexOf('?') === -1 ? '?' : '&';
-              if (shouldVisit) {
-                gl.utils.visitUrl(`${action}${divider}${$form.serialize()}`);
-              }
+            link.textContent = ref;
+            link.dataset.ref = ref;
+
+            li.appendChild(link);
+          }
+
+          return li;
+        },
+        id: function(obj, $el) {
+          return $el.attr('data-ref');
+        },
+        toggleLabel: function(obj, $el) {
+          return $el.text().trim();
+        },
+        clicked: function(options) {
+          const { e } = options;
+          e.preventDefault();
+          if ($('input[name="ref"]').length) {
+            var $form = $dropdown.closest('form');
+
+            var $visit = $dropdown.data('visit');
+            var shouldVisit = $visit ? true : $visit;
+            var action = $form.attr('action');
+            var divider = action.indexOf('?') === -1 ? '?' : '&';
+            if (shouldVisit) {
+              gl.utils.visitUrl(`${action}${divider}${$form.serialize()}`);
             }
           }
-        });
+        },
       });
-    };
-
-    return Project;
-  })();
-}).call(window);
+    });
+  }
+}
diff --git a/app/assets/javascripts/project_avatar.js b/app/assets/javascripts/project_avatar.js
index aabdfbf65e2..56627aa155c 100644
--- a/app/assets/javascripts/project_avatar.js
+++ b/app/assets/javascripts/project_avatar.js
@@ -1,20 +1,13 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, one-var, one-var-declaration-per-line, no-useless-escape, max-len */
-(function() {
-  this.ProjectAvatar = (function() {
-    function ProjectAvatar() {
-      $('.js-choose-project-avatar-button').bind('click', function() {
-        var form;
-        form = $(this).closest('form');
-        return form.find('.js-project-avatar-input').click();
-      });
-      $('.js-project-avatar-input').bind('change', function() {
-        var filename, form;
-        form = $(this).closest('form');
-        filename = $(this).val().replace(/^.*[\\\/]/, '');
-        return form.find('.js-avatar-filename').text(filename);
-      });
-    }
+export default function projectAvatar() {
+  $('.js-choose-project-avatar-button').bind('click', function onClickAvatar() {
+    const form = $(this).closest('form');
+    return form.find('.js-project-avatar-input').click();
+  });
 
-    return ProjectAvatar;
-  })();
-}).call(window);
+  $('.js-project-avatar-input').bind('change', function onClickAvatarInput() {
+    const form = $(this).closest('form');
+    // eslint-disable-next-line no-useless-escape
+    const filename = $(this).val().replace(/^.*[\\\/]/, '');
+    return form.find('.js-avatar-filename').text(filename);
+  });
+}
diff --git a/app/assets/javascripts/project_import.js b/app/assets/javascripts/project_import.js
index 08334bf1ec5..d2d26d6f67e 100644
--- a/app/assets/javascripts/project_import.js
+++ b/app/assets/javascripts/project_import.js
@@ -1,13 +1,8 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, prefer-arrow-callback, max-len */
+import { visitUrl } from './lib/utils/url_utility';
 
-(function() {
-  this.ProjectImport = (function() {
-    function ProjectImport() {
-      setTimeout(function() {
-        return gl.utils.visitUrl(location.href);
-      }, 5000);
-    }
+export default function projectImport() {
+  setTimeout(() => {
+    visitUrl(location.href);
+  }, 5000);
+}
 
-    return ProjectImport;
-  })();
-}).call(window);
diff --git a/app/assets/javascripts/registry/components/table_registry.vue b/app/assets/javascripts/registry/components/table_registry.vue
index e917279947e..14d43e135fe 100644
--- a/app/assets/javascripts/registry/components/table_registry.vue
+++ b/app/assets/javascripts/registry/components/table_registry.vue
@@ -8,6 +8,7 @@
   import tooltip from '../../vue_shared/directives/tooltip';
   import timeagoMixin from '../../vue_shared/mixins/timeago';
   import { errorMessages, errorMessagesTypes } from '../constants';
+  import { numberToHumanSize } from '../../lib/utils/number_utils';
 
   export default {
     props: {
@@ -41,6 +42,10 @@
         return item.layers ? n__('%d layer', '%d layers', item.layers) : '';
       },
 
+      formatSize(size) {
+        return numberToHumanSize(size);
+      },
+
       handleDeleteRegistry(registry) {
         this.deleteRegistry(registry)
           .then(() => this.fetchList({ repo: this.repo }))
@@ -97,7 +102,7 @@
             </span>
         </td>
         <td>
-          {{item.size}}
+          {{formatSize(item.size)}}
           <template v-if="item.size && item.layers">
             &middot;
           </template>
diff --git a/app/assets/javascripts/repo/components/repo_file.vue b/app/assets/javascripts/repo/components/repo_file.vue
index 7a23154b340..5be47d568e7 100644
--- a/app/assets/javascripts/repo/components/repo_file.vue
+++ b/app/assets/javascripts/repo/components/repo_file.vue
@@ -1,11 +1,15 @@
 <script>
   import { mapActions, mapGetters } from 'vuex';
   import timeAgoMixin from '../../vue_shared/mixins/timeago';
+  import skeletonLoadingContainer from '../../vue_shared/components/skeleton_loading_container.vue';
 
   export default {
     mixins: [
       timeAgoMixin,
     ],
+    components: {
+      skeletonLoadingContainer,
+    },
     props: {
       file: {
         type: Object,
@@ -16,6 +20,9 @@
       ...mapGetters([
         'isCollapsed',
       ]),
+      isSubmodule() {
+        return this.file.type === 'submodule';
+      },
       fileIcon() {
         return {
           'fa-spinner fa-spin': this.file.loading,
@@ -31,6 +38,9 @@
       shortId() {
         return this.file.id.substr(0, 8);
       },
+      submoduleColSpan() {
+        return !this.isCollapsed && this.isSubmodule ? 3 : 1;
+      },
     },
     methods: {
       ...mapActions([
@@ -44,7 +54,10 @@
   <tr
     class="file"
     @click.prevent="clickedTreeRow(file)">
-    <td>
+    <td
+      class="multi-file-table-col-name"
+      :colspan="submoduleColSpan"
+    >
       <i
         class="fa fa-fw file-icon"
         :class="fileIcon"
@@ -58,7 +71,7 @@
       >
         {{ file.name }}
       </a>
-      <template v-if="file.type === 'submodule' && file.id">
+      <template v-if="isSubmodule && file.id">
         @
         <span class="commit-sha">
           <a
@@ -71,15 +84,20 @@
       </template>
     </td>
 
-    <template v-if="!isCollapsed">
+    <template v-if="!isCollapsed && !isSubmodule">
       <td class="hidden-sm hidden-xs">
         <a
+          v-if="file.lastCommit.message"
           @click.stop
           :href="file.lastCommit.url"
           class="commit-message"
         >
           {{ file.lastCommit.message }}
         </a>
+        <skeleton-loading-container
+          v-else
+          :small="true"
+        />
       </td>
 
       <td class="commit-update hidden-xs text-right">
@@ -89,6 +107,11 @@
         >
           {{ timeFormated(file.lastCommit.updatedAt) }}
         </span>
+        <skeleton-loading-container
+          v-else
+          class="animation-container-right"
+          :small="true"
+        />
       </td>
     </template>
   </tr>
diff --git a/app/assets/javascripts/repo/components/repo_loading_file.vue b/app/assets/javascripts/repo/components/repo_loading_file.vue
index 1e6c405f292..8fa637d771f 100644
--- a/app/assets/javascripts/repo/components/repo_loading_file.vue
+++ b/app/assets/javascripts/repo/components/repo_loading_file.vue
@@ -1,17 +1,16 @@
 <script>
   import { mapGetters } from 'vuex';
+  import skeletonLoadingContainer from '../../vue_shared/components/skeleton_loading_container.vue';
 
   export default {
+    components: {
+      skeletonLoadingContainer,
+    },
     computed: {
       ...mapGetters([
         'isCollapsed',
       ]),
     },
-    methods: {
-      lineOfCode(n) {
-        return `skeleton-line-${n}`;
-      },
-    },
   };
 </script>
 
@@ -20,37 +19,25 @@
     class="loading-file"
     aria-label="Loading files"
   >
-    <td>
-      <div
-        class="animation-container animation-container-small">
-        <div
-          v-for="n in 6"
-          :key="n"
-          :class="lineOfCode(n)">
-        </div>
-      </div>
+    <td class="multi-file-table-col-name">
+      <skeleton-loading-container
+        :small="true"
+      />
     </td>
     <template v-if="!isCollapsed">
       <td
         class="hidden-sm hidden-xs">
-        <div class="animation-container">
-          <div
-            v-for="n in 6"
-            :key="n"
-            :class="lineOfCode(n)">
-          </div>
-        </div>
+        <skeleton-loading-container
+          :small="true"
+        />
       </td>
 
       <td
         class="hidden-xs">
-        <div class="animation-container animation-container-small animation-container-right">
-          <div
-            v-for="n in 6"
-            :key="n"
-            :class="lineOfCode(n)">
-          </div>
-        </div>
+        <skeleton-loading-container
+          class="animation-container-right"
+          :small="true"
+        />
       </td>
     </template>
   </tr>
diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue
index 63c0d70f5c0..9365b09326f 100644
--- a/app/assets/javascripts/repo/components/repo_sidebar.vue
+++ b/app/assets/javascripts/repo/components/repo_sidebar.vue
@@ -57,7 +57,7 @@ export default {
           </strong>
         </th>
         <template v-else>
-          <th class="name">
+          <th class="name multi-file-table-col-name">
             Name
           </th>
           <th class="hidden-sm hidden-xs last-commit">
@@ -80,7 +80,7 @@ export default {
       />
       <repo-file
         v-for="(file, index) in treeList"
-        :key="index"
+        :key="file.key"
         :file="file"
       />
     </tbody>
diff --git a/app/assets/javascripts/repo/services/index.js b/app/assets/javascripts/repo/services/index.js
index dc222ccac01..2fb45dcb03c 100644
--- a/app/assets/javascripts/repo/services/index.js
+++ b/app/assets/javascripts/repo/services/index.js
@@ -30,4 +30,11 @@ export default {
   commit(projectId, payload) {
     return Api.commitMultiple(projectId, payload);
   },
+  getTreeLastCommit(endpoint) {
+    return Vue.http.get(endpoint, {
+      params: {
+        format: 'json',
+      },
+    });
+  },
 };
diff --git a/app/assets/javascripts/repo/stores/actions.js b/app/assets/javascripts/repo/stores/actions.js
index ca2f2a5ce7a..120ce96f44d 100644
--- a/app/assets/javascripts/repo/stores/actions.js
+++ b/app/assets/javascripts/repo/stores/actions.js
@@ -3,7 +3,7 @@ import flash from '../../flash';
 import service from '../services';
 import * as types from './mutation_types';
 
-export const redirectToUrl = url => gl.utils.visitUrl(url);
+export const redirectToUrl = (_, url) => gl.utils.visitUrl(url);
 
 export const setInitialData = ({ commit }, data) => commit(types.SET_INITIAL_DATA, data);
 
@@ -64,7 +64,7 @@ export const checkCommitStatus = ({ state }) => service.getBranchData(
   })
   .catch(() => flash('Error checking branch data. Please try again.'));
 
-export const commitChanges = ({ commit, state, dispatch }, { payload, newMr }) =>
+export const commitChanges = ({ commit, state, dispatch, getters }, { payload, newMr }) =>
   service.commit(state.project.id, payload)
   .then((data) => {
     const { branch } = payload;
@@ -73,12 +73,28 @@ export const commitChanges = ({ commit, state, dispatch }, { payload, newMr }) =
       return;
     }
 
+    const lastCommit = {
+      commit_path: `${state.project.url}/commit/${data.id}`,
+      commit: {
+        message: data.message,
+        authored_date: data.committed_date,
+      },
+    };
+
     flash(`Your changes have been committed. Commit ${data.short_id} with ${data.stats.additions} additions, ${data.stats.deletions} deletions.`, 'notice');
 
     if (newMr) {
-      redirectToUrl(`${state.endpoints.newMergeRequestUrl}${branch}`);
+      dispatch('redirectToUrl', `${state.endpoints.newMergeRequestUrl}${branch}`);
     } else {
       commit(types.SET_COMMIT_REF, data.id);
+
+      getters.changedFiles.forEach((entry) => {
+        commit(types.SET_LAST_COMMIT_DATA, {
+          entry,
+          lastCommit,
+        });
+      });
+
       dispatch('discardAllChanges');
       dispatch('closeAllFiles');
       dispatch('toggleEditMode');
diff --git a/app/assets/javascripts/repo/stores/actions/branch.js b/app/assets/javascripts/repo/stores/actions/branch.js
index b81a70dfd1e..61d9a5af3e3 100644
--- a/app/assets/javascripts/repo/stores/actions/branch.js
+++ b/app/assets/javascripts/repo/stores/actions/branch.js
@@ -3,16 +3,16 @@ import * as types from '../mutation_types';
 import { pushState } from '../utils';
 
 // eslint-disable-next-line import/prefer-default-export
-export const createNewBranch = ({ rootState, commit }, branch) => service.createBranch(
-  rootState.project.id,
+export const createNewBranch = ({ state, commit }, branch) => service.createBranch(
+  state.project.id,
   {
     branch,
-    ref: rootState.currentBranch,
+    ref: state.currentBranch,
   },
 ).then(res => res.json())
 .then((data) => {
   const branchName = data.name;
-  const url = location.href.replace(rootState.currentBranch, branchName);
+  const url = location.href.replace(state.currentBranch, branchName);
 
   pushState(url);
 
diff --git a/app/assets/javascripts/repo/stores/actions/file.js b/app/assets/javascripts/repo/stores/actions/file.js
index afbe0b78a82..5bae4fa826a 100644
--- a/app/assets/javascripts/repo/stores/actions/file.js
+++ b/app/assets/javascripts/repo/stores/actions/file.js
@@ -27,6 +27,8 @@ export const closeFile = ({ commit, state, dispatch }, { file, force = false })
   } else if (!state.openFiles.length) {
     pushState(file.parentTreeUrl);
   }
+
+  dispatch('getLastCommitData');
 };
 
 export const setFileActive = ({ commit, state, getters, dispatch }, file) => {
diff --git a/app/assets/javascripts/repo/stores/actions/tree.js b/app/assets/javascripts/repo/stores/actions/tree.js
index 129743c66c2..aa830e946a2 100644
--- a/app/assets/javascripts/repo/stores/actions/tree.js
+++ b/app/assets/javascripts/repo/stores/actions/tree.js
@@ -7,10 +7,11 @@ import {
   setPageTitle,
   findEntry,
   createTemp,
+  createOrMergeEntry,
 } from '../utils';
 
 export const getTreeData = (
-  { commit, state },
+  { commit, state, dispatch },
   { endpoint = state.endpoints.rootEndpoint, tree = state } = {},
 ) => {
   commit(types.TOGGLE_LOADING, tree);
@@ -24,14 +25,20 @@ export const getTreeData = (
       return res.json();
     })
     .then((data) => {
+      const prevLastCommitPath = tree.lastCommitPath;
       if (!state.isInitialRoot) {
         commit(types.SET_ROOT, data.path === '/');
       }
 
-      commit(types.SET_DIRECTORY_DATA, { data, tree });
+      dispatch('updateDirectoryData', { data, tree });
       commit(types.SET_PARENT_TREE_URL, data.parent_tree_url);
+      commit(types.SET_LAST_COMMIT_URL, { tree, url: data.last_commit_path });
       commit(types.TOGGLE_LOADING, tree);
 
+      if (prevLastCommitPath !== null) {
+        dispatch('getLastCommitData', tree);
+      }
+
       pushState(endpoint);
     })
     .catch(() => {
@@ -48,7 +55,7 @@ export const toggleTreeOpen = ({ commit, dispatch }, { endpoint, tree }) => {
     pushState(tree.parentTreeUrl);
 
     commit(types.SET_PREVIOUS_URL, tree.parentTreeUrl);
-    commit(types.SET_DIRECTORY_DATA, { data, tree });
+    dispatch('updateDirectoryData', { data, tree });
   } else {
     commit(types.SET_PREVIOUS_URL, endpoint);
     dispatch('getTreeData', { endpoint, tree });
@@ -108,3 +115,48 @@ export const createTempTree = ({ state, commit, dispatch }, name) => {
     });
   }
 };
+
+export const getLastCommitData = ({ state, commit, dispatch, getters }, tree = state) => {
+  if (tree.lastCommitPath === null || getters.isCollapsed) return;
+
+  service.getTreeLastCommit(tree.lastCommitPath)
+    .then((res) => {
+      const lastCommitPath = normalizeHeaders(res.headers)['MORE-LOGS-URL'] || null;
+
+      commit(types.SET_LAST_COMMIT_URL, { tree, url: lastCommitPath });
+
+      return res.json();
+    })
+    .then((data) => {
+      data.forEach((lastCommit) => {
+        const entry = findEntry(tree, lastCommit.type, lastCommit.file_name);
+
+        if (entry) {
+          commit(types.SET_LAST_COMMIT_DATA, { entry, lastCommit });
+        }
+      });
+
+      dispatch('getLastCommitData', tree);
+    })
+    .catch(() => flash('Error fetching log data.'));
+};
+
+export const updateDirectoryData = ({ commit, state }, { data, tree }) => {
+  const level = tree.level !== undefined ? tree.level + 1 : 0;
+  const parentTreeUrl = data.parent_tree_url ? `${data.parent_tree_url}${data.path}` : state.endpoints.rootUrl;
+  const createEntry = (entry, type) => createOrMergeEntry({
+    tree,
+    entry,
+    level,
+    type,
+    parentTreeUrl,
+  });
+
+  const formattedData = [
+    ...data.trees.map(t => createEntry(t, 'tree')),
+    ...data.submodules.map(m => createEntry(m, 'submodule')),
+    ...data.blobs.map(b => createEntry(b, 'blob')),
+  ];
+
+  commit(types.SET_DIRECTORY_DATA, { tree, data: formattedData });
+};
diff --git a/app/assets/javascripts/repo/stores/mutation_types.js b/app/assets/javascripts/repo/stores/mutation_types.js
index 4722a7dd0df..bc3390f1506 100644
--- a/app/assets/javascripts/repo/stores/mutation_types.js
+++ b/app/assets/javascripts/repo/stores/mutation_types.js
@@ -4,11 +4,13 @@ export const SET_COMMIT_REF = 'SET_COMMIT_REF';
 export const SET_PARENT_TREE_URL = 'SET_PARENT_TREE_URL';
 export const SET_ROOT = 'SET_ROOT';
 export const SET_PREVIOUS_URL = 'SET_PREVIOUS_URL';
+export const SET_LAST_COMMIT_DATA = 'SET_LAST_COMMIT_DATA';
 
 // Tree mutation types
 export const SET_DIRECTORY_DATA = 'SET_DIRECTORY_DATA';
 export const TOGGLE_TREE_OPEN = 'TOGGLE_TREE_OPEN';
 export const CREATE_TMP_TREE = 'CREATE_TMP_TREE';
+export const SET_LAST_COMMIT_URL = 'SET_LAST_COMMIT_URL';
 
 // File mutation types
 export const SET_FILE_DATA = 'SET_FILE_DATA';
diff --git a/app/assets/javascripts/repo/stores/mutations.js b/app/assets/javascripts/repo/stores/mutations.js
index 2f9b038322b..ae2ba5bedf7 100644
--- a/app/assets/javascripts/repo/stores/mutations.js
+++ b/app/assets/javascripts/repo/stores/mutations.js
@@ -48,6 +48,13 @@ export default {
       previousUrl,
     });
   },
+  [types.SET_LAST_COMMIT_DATA](state, { entry, lastCommit }) {
+    Object.assign(entry.lastCommit, {
+      url: lastCommit.commit_path,
+      message: lastCommit.commit.message,
+      updatedAt: lastCommit.commit.authored_date,
+    });
+  },
   ...fileMutations,
   ...treeMutations,
   ...branchMutations,
diff --git a/app/assets/javascripts/repo/stores/mutations/tree.js b/app/assets/javascripts/repo/stores/mutations/tree.js
index 52be2673107..130221c9fda 100644
--- a/app/assets/javascripts/repo/stores/mutations/tree.js
+++ b/app/assets/javascripts/repo/stores/mutations/tree.js
@@ -1,5 +1,4 @@
 import * as types from '../mutation_types';
-import * as utils from '../utils';
 
 export default {
   [types.TOGGLE_TREE_OPEN](state, tree) {
@@ -8,30 +7,8 @@ export default {
     });
   },
   [types.SET_DIRECTORY_DATA](state, { data, tree }) {
-    const level = tree.level !== undefined ? tree.level + 1 : 0;
-    const parentTreeUrl = data.parent_tree_url ? `${data.parent_tree_url}${data.path}` : state.endpoints.rootUrl;
-
     Object.assign(tree, {
-      tree: [
-        ...data.trees.map(t => utils.decorateData({
-          ...t,
-          type: 'tree',
-          parentTreeUrl,
-          level,
-        }, state.project.url)),
-        ...data.submodules.map(m => utils.decorateData({
-          ...m,
-          type: 'submodule',
-          parentTreeUrl,
-          level,
-        }, state.project.url)),
-        ...data.blobs.map(b => utils.decorateData({
-          ...b,
-          type: 'blob',
-          parentTreeUrl,
-          level,
-        }, state.project.url)),
-      ],
+      tree: data,
     });
   },
   [types.SET_PARENT_TREE_URL](state, url) {
@@ -39,6 +16,11 @@ export default {
       parentTreeUrl: url,
     });
   },
+  [types.SET_LAST_COMMIT_URL](state, { tree = state, url }) {
+    Object.assign(tree, {
+      lastCommitPath: url,
+    });
+  },
   [types.CREATE_TMP_TREE](state, { parent, tmpEntry }) {
     parent.tree.push(tmpEntry);
   },
diff --git a/app/assets/javascripts/repo/stores/state.js b/app/assets/javascripts/repo/stores/state.js
index aab74754f02..0068834831e 100644
--- a/app/assets/javascripts/repo/stores/state.js
+++ b/app/assets/javascripts/repo/stores/state.js
@@ -8,6 +8,7 @@ export default () => ({
   endpoints: {},
   isRoot: false,
   isInitialRoot: false,
+  lastCommitPath: '',
   loading: false,
   onTopOfBranch: false,
   openFiles: [],
diff --git a/app/assets/javascripts/repo/stores/utils.js b/app/assets/javascripts/repo/stores/utils.js
index 797c2b1e5b9..fae1f4439a9 100644
--- a/app/assets/javascripts/repo/stores/utils.js
+++ b/app/assets/javascripts/repo/stores/utils.js
@@ -1,5 +1,6 @@
 export const dataStructure = () => ({
   id: '',
+  key: '',
   type: '',
   name: '',
   url: '',
@@ -12,7 +13,12 @@ export const dataStructure = () => ({
   opened: false,
   active: false,
   changed: false,
-  lastCommit: {},
+  lastCommitPath: '',
+  lastCommit: {
+    url: '',
+    message: '',
+    updatedAt: '',
+  },
   tree_url: '',
   blamePath: '',
   commitsPath: '',
@@ -27,14 +33,13 @@ export const dataStructure = () => ({
   base64: false,
 });
 
-export const decorateData = (entity, projectUrl = '') => {
+export const decorateData = (entity) => {
   const {
     id,
     type,
     url,
     name,
     icon,
-    last_commit,
     tree_url,
     path,
     renderError,
@@ -51,6 +56,7 @@ export const decorateData = (entity, projectUrl = '') => {
   return {
     ...dataStructure(),
     id,
+    key: `${name}-${type}-${id}`,
     type,
     name,
     url,
@@ -66,12 +72,6 @@ export const decorateData = (entity, projectUrl = '') => {
     renderError,
     content,
     base64,
-    // eslint-disable-next-line camelcase
-    lastCommit: last_commit ? {
-      url: `${projectUrl}/commit/${last_commit.id}`,
-      message: last_commit.message,
-      updatedAt: last_commit.committed_date,
-    } : {},
   };
 };
 
@@ -106,3 +106,22 @@ export const createTemp = ({ name, path, type, level, changed, content, base64 }
     renderError: base64,
   });
 };
+
+export const createOrMergeEntry = ({ tree, entry, type, parentTreeUrl, level }) => {
+  const found = findEntry(tree, type, entry.name);
+
+  if (found) {
+    return Object.assign({}, found, {
+      id: entry.id,
+      url: entry.url,
+      tempFile: false,
+    });
+  }
+
+  return decorateData({
+    ...entry,
+    type,
+    parentTreeUrl,
+    level,
+  });
+};
diff --git a/app/assets/javascripts/search_autocomplete.js b/app/assets/javascripts/search_autocomplete.js
index f15452ec683..9dec5d7645a 100644
--- a/app/assets/javascripts/search_autocomplete.js
+++ b/app/assets/javascripts/search_autocomplete.js
@@ -162,13 +162,19 @@ import { isInGroupsPage, isInProjectPage, getGroupSlug, getProjectSlug } from '.
       items = [
         {
           header: "" + name
-        }, {
+        }
+      ];
+      const issueItems = [
+        {
           text: 'Issues assigned to me',
           url: issuesPath + "/?assignee_username=" + userName
         }, {
           text: "Issues I've created",
           url: issuesPath + "/?author_username=" + userName
-        }, 'separator', {
+        }
+      ];
+      const mergeRequestItems = [
+        {
           text: 'Merge requests assigned to me',
           url: mrPath + "/?assignee_username=" + userName
         }, {
@@ -176,6 +182,11 @@ import { isInGroupsPage, isInProjectPage, getGroupSlug, getProjectSlug } from '.
           url: mrPath + "/?author_username=" + userName
         }
       ];
+      if (options.issuesDisabled) {
+        items = items.concat(mergeRequestItems);
+      } else {
+        items = items.concat(...issueItems, 'separator', ...mergeRequestItems);
+      }
       if (!name) {
         items.splice(0, 1);
       }
@@ -408,6 +419,7 @@ import { isInGroupsPage, isInProjectPage, getGroupSlug, getProjectSlug } from '.
       gl.projectOptions[projectPath] = {
         name: $projectOptionsDataEl.data('name'),
         issuesPath: $projectOptionsDataEl.data('issues-path'),
+        issuesDisabled: $projectOptionsDataEl.data('issues-disabled'),
         mrPath: $projectOptionsDataEl.data('mr-path')
       };
     }
diff --git a/app/assets/javascripts/shortcuts_issuable.js b/app/assets/javascripts/shortcuts_issuable.js
index fc97938e3d1..4f4f606d293 100644
--- a/app/assets/javascripts/shortcuts_issuable.js
+++ b/app/assets/javascripts/shortcuts_issuable.js
@@ -4,6 +4,7 @@
 import _ from 'underscore';
 import 'mousetrap';
 import ShortcutsNavigation from './shortcuts_navigation';
+import { CopyAsGFM } from './behaviors/copy_as_gfm';
 
 export default class ShortcutsIssuable extends ShortcutsNavigation {
   constructor(isMergeRequest) {
@@ -33,8 +34,8 @@ export default class ShortcutsIssuable extends ShortcutsNavigation {
       return false;
     }
 
-    const el = window.gl.CopyAsGFM.transformGFMSelection(documentFragment.cloneNode(true));
-    const selected = window.gl.CopyAsGFM.nodeToGFM(el);
+    const el = CopyAsGFM.transformGFMSelection(documentFragment.cloneNode(true));
+    const selected = CopyAsGFM.nodeToGFM(el);
 
     if (selected.trim() === '') {
       return false;
diff --git a/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue b/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
index 22a9a34dda3..6ee4d487c0b 100644
--- a/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
+++ b/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
@@ -1,10 +1,12 @@
 <script>
 import Flash from '../../../flash';
 import editForm from './edit_form.vue';
+import Icon from '../../../vue_shared/components/icon.vue';
 
 export default {
   components: {
     editForm,
+    Icon,
   },
   props: {
     isConfidential: {
@@ -26,11 +28,8 @@ export default {
     };
   },
   computed: {
-    faEye() {
-      const eye = this.isConfidential ? 'fa-eye-slash' : 'fa-eye';
-      return {
-        [eye]: true,
-      };
+    confidentialityIcon() {
+      return this.isConfidential ? 'eye-slash' : 'eye';
     },
   },
   methods: {
@@ -49,7 +48,11 @@ export default {
 <template>
   <div class="block issuable-sidebar-item confidentiality">
     <div class="sidebar-collapsed-icon">
-      <i class="fa" :class="faEye" aria-hidden="true"></i>
+      <icon
+        :name="confidentialityIcon"
+        :size="16"
+        aria-hidden="true">
+      </icon>
     </div>
     <div class="title hide-collapsed">
       Confidentiality
@@ -70,11 +73,21 @@ export default {
         :update-confidential-attribute="updateConfidentialAttribute"
       />
       <div v-if="!isConfidential" class="no-value sidebar-item-value">
-        <i class="fa fa-eye sidebar-item-icon"></i>
+        <icon
+          name="eye"
+          :size="16"
+          aria-hidden="true"
+          class="sidebar-item-icon inline">
+        </icon>
         Not confidential
       </div>
       <div v-else class="value sidebar-item-value hide-collapsed">
-        <i aria-hidden="true" class="fa fa-eye-slash sidebar-item-icon is-active"></i>
+        <icon
+          name="eye-slash"
+          :size="16"
+          aria-hidden="true"
+          class="sidebar-item-icon inline is-active">
+        </icon>
         This issue is confidential
       </div>
     </div>
diff --git a/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue b/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue
index c4b2900e020..9aff53cf8af 100644
--- a/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue
+++ b/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue
@@ -2,6 +2,7 @@
 /* global Flash */
 import editForm from './edit_form.vue';
 import issuableMixin from '../../../vue_shared/mixins/issuable';
+import Icon from '../../../vue_shared/components/icon.vue';
 
 export default {
   props: {
@@ -35,11 +36,12 @@ export default {
 
   components: {
     editForm,
+    Icon,
   },
 
   computed: {
-    lockIconClass() {
-      return this.isLocked ? 'fa-lock' : 'fa-unlock';
+    lockIcon() {
+      return this.isLocked ? 'lock' : 'lock-open';
     },
 
     isLockDialogOpen() {
@@ -66,11 +68,12 @@ export default {
 <template>
   <div class="block issuable-sidebar-item lock">
     <div class="sidebar-collapsed-icon">
-      <i
-        class="fa"
-        :class="lockIconClass"
+      <icon
+        :name="lockIcon"
+        :size="16"
         aria-hidden="true"
-      ></i>
+        class="sidebar-item-icon is-active">
+      </icon>
     </div>
 
     <div class="title hide-collapsed">
@@ -98,10 +101,12 @@ export default {
         v-if="isLocked"
         class="value sidebar-item-value"
       >
-        <i
+        <icon
+          name="lock"
+          :size="16"
           aria-hidden="true"
-          class="fa fa-lock sidebar-item-icon is-active"
-        ></i>
+          class="sidebar-item-icon inline is-active">
+        </icon>
         {{ __('Locked') }}
       </div>
 
@@ -109,10 +114,12 @@ export default {
         v-else
         class="no-value sidebar-item-value hide-collapsed"
       >
-        <i
+        <icon
+          name="lock-open"
+          :size="16"
           aria-hidden="true"
-          class="fa fa-unlock sidebar-item-icon"
-        ></i>
+          class="sidebar-item-icon inline">
+        </icon>
         {{ __('Unlocked') }}
       </div>
     </div>
diff --git a/app/assets/javascripts/smart_interval.js b/app/assets/javascripts/smart_interval.js
index 2bf7a3a5d61..8e931995fc6 100644
--- a/app/assets/javascripts/smart_interval.js
+++ b/app/assets/javascripts/smart_interval.js
@@ -3,9 +3,10 @@
  * and controllable by a public API.
  */
 
-class SmartInterval {
+export default class SmartInterval {
   /**
-   * @param { function } opts.callback Function to be called on each iteration (required)
+   * @param { function } opts.callback Function that returns a promise, called on each iteration
+   *                     unless still in progress (required)
    * @param { milliseconds } opts.startingInterval `currentInterval` is set to this initially
    * @param { milliseconds } opts.maxInterval `currentInterval` will be incremented to this
    * @param { milliseconds } opts.hiddenInterval `currentInterval` is set to this
@@ -42,13 +43,16 @@ class SmartInterval {
     const cfg = this.cfg;
     const state = this.state;
 
-    if (cfg.immediateExecution) {
+    if (cfg.immediateExecution && !this.isLoading) {
       cfg.immediateExecution = false;
-      cfg.callback();
+      this.triggerCallback();
     }
 
     state.intervalId = window.setInterval(() => {
-      cfg.callback();
+      if (this.isLoading) {
+        return;
+      }
+      this.triggerCallback();
 
       if (this.getCurrentInterval() === cfg.maxInterval) {
         return;
@@ -76,7 +80,7 @@ class SmartInterval {
 
   // start a timer, using the existing interval
   resume() {
-    this.stopTimer(); // stop exsiting timer, in case timer was not previously stopped
+    this.stopTimer(); // stop existing timer, in case timer was not previously stopped
     this.start();
   }
 
@@ -104,6 +108,18 @@ class SmartInterval {
     this.initPageUnloadHandling();
   }
 
+  triggerCallback() {
+    this.isLoading = true;
+    this.cfg.callback()
+      .then(() => {
+        this.isLoading = false;
+      })
+      .catch((err) => {
+        this.isLoading = false;
+        throw err;
+      });
+  }
+
   initVisibilityChangeHandling() {
     // cancel interval when tab no longer shown (prevents cached pages from polling)
     document.addEventListener('visibilitychange', this.handleVisibilityChange.bind(this));
@@ -154,4 +170,3 @@ class SmartInterval {
   }
 }
 
-window.gl.SmartInterval = SmartInterval;
diff --git a/app/assets/javascripts/users_select.js b/app/assets/javascripts/users_select.js
index a0883b32593..759cc9925f4 100644
--- a/app/assets/javascripts/users_select.js
+++ b/app/assets/javascripts/users_select.js
@@ -6,7 +6,7 @@ import _ from 'underscore';
 // TODO: remove eventHub hack after code splitting refactor
 window.emitSidebarEvent = window.emitSidebarEvent || $.noop;
 
-function UsersSelect(currentUser, els) {
+function UsersSelect(currentUser, els, options = {}) {
   var $els;
   this.users = this.users.bind(this);
   this.user = this.user.bind(this);
@@ -20,6 +20,8 @@ function UsersSelect(currentUser, els) {
     }
   }
 
+  const { handleClick } = options;
+
   $els = $(els);
 
   if (!els) {
@@ -442,6 +444,9 @@ function UsersSelect(currentUser, els) {
           }
           if ($el.closest('.add-issues-modal').length) {
             gl.issueBoards.ModalStore.store.filter[$dropdown.data('field-name')] = user.id;
+          } else if (handleClick) {
+            e.preventDefault();
+            handleClick(user, isMarking);
           } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
             return Issuable.filterResults($dropdown.closest('form'));
           } else if ($dropdown.hasClass('js-filter-submit')) {
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js
index 219ff94924e..13e4cb5717e 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js
+++ b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_header.js
@@ -1,5 +1,5 @@
 import tooltip from '../../vue_shared/directives/tooltip';
-import '../../lib/utils/text_utility';
+import { pluralize } from '../../lib/utils/text_utility';
 
 export default {
   name: 'MRWidgetHeader',
@@ -14,7 +14,7 @@ export default {
       return this.mr.divergedCommitsCount > 0;
     },
     commitsText() {
-      return gl.text.pluralize('commit', this.mr.divergedCommitsCount);
+      return pluralize('commit', this.mr.divergedCommitsCount);
     },
     branchNameClipboardData() {
       // This supports code in app/assets/javascripts/copy_to_clipboard.js that
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.js b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.js
deleted file mode 100644
index 029832bdd27..00000000000
--- a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.js
+++ /dev/null
@@ -1,90 +0,0 @@
-import PipelineStage from '../../pipelines/components/stage.vue';
-import ciIcon from '../../vue_shared/components/ci_icon.vue';
-import icon from '../../vue_shared/components/icon.vue';
-
-export default {
-  name: 'MRWidgetPipeline',
-  props: {
-    mr: { type: Object, required: true },
-  },
-  components: {
-    'pipeline-stage': PipelineStage,
-    ciIcon,
-    icon,
-  },
-  computed: {
-    hasPipeline() {
-      return this.mr.pipeline && Object.keys(this.mr.pipeline).length > 0;
-    },
-    hasCIError() {
-      const { hasCI, ciStatus } = this.mr;
-
-      return hasCI && !ciStatus;
-    },
-    stageText() {
-      return this.mr.pipeline.details.stages.length > 1 ? 'stages' : 'stage';
-    },
-    status() {
-      return this.mr.pipeline.details.status || {};
-    },
-  },
-  template: `
-    <div
-      v-if="hasPipeline || hasCIError"
-      class="mr-widget-heading">
-      <div class="ci-widget media">
-        <template v-if="hasCIError">
-          <div class="ci-status-icon ci-status-icon-failed ci-error js-ci-error append-right-10">
-            <span
-              aria-hidden="true">
-              <icon
-                name="status_failed"/>
-            </span>
-          </div>
-          <div class="media-body">
-            Could not connect to the CI server. Please check your settings and try again
-          </div>
-        </template>
-        <template v-else-if="hasPipeline">
-          <div class="ci-status-icon append-right-10">
-            <a
-              class="icon-link"
-              :href="this.status.details_path">
-              <ci-icon :status="status" />
-            </a>
-          </div>
-          <div class="media-body">
-            <span>
-              Pipeline
-              <a
-                :href="mr.pipeline.path"
-                class="pipeline-id">#{{mr.pipeline.id}}</a>
-            </span>
-            <span class="mr-widget-pipeline-graph">
-              <span class="stage-cell">
-                <div
-                  v-if="mr.pipeline.details.stages.length > 0"
-                  v-for="stage in mr.pipeline.details.stages"
-                  class="stage-container dropdown js-mini-pipeline-graph">
-                  <pipeline-stage :stage="stage" />
-                </div>
-              </span>
-            </span>
-            <span>
-              {{mr.pipeline.details.status.label}} for
-              <a
-                :href="mr.pipeline.commit.commit_path"
-                class="commit-sha js-commit-link">
-                {{mr.pipeline.commit.short_id}}</a>.
-            </span>
-            <span
-              v-if="mr.pipeline.coverage"
-              class="js-mr-coverage">
-              Coverage {{mr.pipeline.coverage}}%
-            </span>
-          </div>
-        </template>
-      </div>
-    </div>
-  `,
-};
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.vue b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.vue
new file mode 100644
index 00000000000..dbc65462377
--- /dev/null
+++ b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.vue
@@ -0,0 +1,104 @@
+<script>
+  import pipelineStage from '../../pipelines/components/stage.vue';
+  import ciIcon from '../../vue_shared/components/ci_icon.vue';
+  import icon from '../../vue_shared/components/icon.vue';
+
+  export default {
+    name: 'MRWidgetPipeline',
+    props: {
+      pipeline: {
+        type: Object,
+        required: true,
+      },
+      // This prop needs to be camelCase, html attributes are case insensive
+      // https://vuejs.org/v2/guide/components.html#camelCase-vs-kebab-case
+      hasCi: {
+        type: Boolean,
+        required: false,
+      },
+      ciStatus: {
+        type: String,
+        required: false,
+      },
+    },
+    components: {
+      pipelineStage,
+      ciIcon,
+      icon,
+    },
+    computed: {
+      hasPipeline() {
+        return this.pipeline && Object.keys(this.pipeline).length > 0;
+      },
+      hasCIError() {
+        return this.hasCi && !this.ciStatus;
+      },
+      status() {
+        return this.pipeline.details &&
+          this.pipeline.details.status ? this.pipeline.details.status : {};
+      },
+      hasStages() {
+        return this.pipeline.details &&
+          this.pipeline.details.stages &&
+          this.pipeline.details.stages.length;
+      },
+    },
+  };
+</script>
+
+<template>
+  <div
+    v-if="hasPipeline || hasCIError"
+    class="mr-widget-heading">
+    <div class="ci-widget media">
+      <template v-if="hasCIError">
+        <div class="ci-status-icon ci-status-icon-failed ci-error js-ci-error append-right-10">
+          <icon name="status_failed" />
+        </div>
+        <div class="media-body">
+          Could not connect to the CI server. Please check your settings and try again
+        </div>
+      </template>
+      <template v-else-if="hasPipeline">
+        <a
+          class="append-right-10"
+          :href="this.status.details_path">
+          <ci-icon :status="status" />
+        </a>
+
+        <div class="media-body">
+          Pipeline
+          <a
+            :href="pipeline.path"
+            class="pipeline-id">
+            #{{pipeline.id}}
+          </a>
+
+          {{pipeline.details.status.label}} for
+
+          <a
+            :href="pipeline.commit.commit_path"
+            class="commit-sha js-commit-link">
+            {{pipeline.commit.short_id}}</a>.
+
+          <span class="mr-widget-pipeline-graph">
+            <span class="stage-cell">
+              <div
+                v-if="hasStages"
+                v-for="(stage, i) in pipeline.details.stages"
+                :key="i"
+                class="stage-container dropdown js-mini-pipeline-graph">
+                <pipeline-stage :stage="stage" />
+              </div>
+            </span>
+          </span>
+
+          <template v-if="pipeline.coverage">
+            Coverage {{pipeline.coverage}}%
+          </template>
+
+        </div>
+      </template>
+    </div>
+  </div>
+</template>
diff --git a/app/assets/javascripts/vue_merge_request_widget/dependencies.js b/app/assets/javascripts/vue_merge_request_widget/dependencies.js
index 49340c232c8..5bd8b99420a 100644
--- a/app/assets/javascripts/vue_merge_request_widget/dependencies.js
+++ b/app/assets/javascripts/vue_merge_request_widget/dependencies.js
@@ -13,7 +13,7 @@ export { default as Vue } from 'vue';
 export { default as SmartInterval } from '~/smart_interval';
 export { default as WidgetHeader } from './components/mr_widget_header';
 export { default as WidgetMergeHelp } from './components/mr_widget_merge_help';
-export { default as WidgetPipeline } from './components/mr_widget_pipeline';
+export { default as WidgetPipeline } from './components/mr_widget_pipeline.vue';
 export { default as WidgetDeployment } from './components/mr_widget_deployment';
 export { default as WidgetRelatedLinks } from './components/mr_widget_related_links';
 export { default as MergedState } from './components/states/mr_widget_merged';
diff --git a/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js b/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
index 4f497b204a3..1274db2c4c8 100644
--- a/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
+++ b/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
@@ -1,3 +1,4 @@
+import SmartInterval from '~/smart_interval';
 import Flash from '../flash';
 import {
   WidgetHeader,
@@ -60,7 +61,7 @@ export default {
       return this.mr.hasCI;
     },
     shouldRenderRelatedLinks() {
-      return this.mr.relatedLinks;
+      return !!this.mr.relatedLinks;
     },
     shouldRenderDeployments() {
       return this.mr.deployments.length;
@@ -81,7 +82,7 @@ export default {
       return new MRWidgetService(endpoints);
     },
     checkStatus(cb) {
-      this.service.checkStatus()
+      return this.service.checkStatus()
         .then(res => res.json())
         .then((res) => {
           this.handleNotification(res);
@@ -97,7 +98,7 @@ export default {
         });
     },
     initPolling() {
-      this.pollingInterval = new gl.SmartInterval({
+      this.pollingInterval = new SmartInterval({
         callback: this.checkStatus,
         startingInterval: 10000,
         maxInterval: 30000,
@@ -106,7 +107,7 @@ export default {
       });
     },
     initDeploymentsPolling() {
-      this.deploymentsInterval = new gl.SmartInterval({
+      this.deploymentsInterval = new SmartInterval({
         callback: this.fetchDeployments,
         startingInterval: 30000,
         maxInterval: 120000,
@@ -121,7 +122,7 @@ export default {
       }
     },
     fetchDeployments() {
-      this.service.fetchDeployments()
+      return this.service.fetchDeployments()
         .then(res => res.json())
         .then((res) => {
           if (res.length) {
@@ -235,7 +236,10 @@ export default {
       <mr-widget-header :mr="mr" />
       <mr-widget-pipeline
         v-if="shouldRenderPipelines"
-        :mr="mr" />
+        :pipeline="mr.pipeline"
+        :ci-status="mr.ciStatus"
+        :has-ci="mr.hasCI"
+        />
       <mr-widget-deployment
         v-if="shouldRenderDeployments"
         :mr="mr"
diff --git a/app/assets/javascripts/vue_shared/components/issue/issue_warning.vue b/app/assets/javascripts/vue_shared/components/issue/issue_warning.vue
index 16c0a8efcd2..564fc5029af 100644
--- a/app/assets/javascripts/vue_shared/components/issue/issue_warning.vue
+++ b/app/assets/javascripts/vue_shared/components/issue/issue_warning.vue
@@ -1,4 +1,6 @@
 <script>
+  import Icon from '../../../vue_shared/components/icon.vue';
+
   export default {
     props: {
       isLocked: {
@@ -14,12 +16,16 @@
       },
     },
 
+    components: {
+      Icon,
+    },
+
     computed: {
-      iconClass() {
-        return {
-          'fa-eye-slash': this.isConfidential,
-          'fa-lock': this.isLocked,
-        };
+      warningIcon() {
+        if (this.isConfidential) return 'eye-slash';
+        if (this.isLocked) return 'lock';
+
+        return '';
       },
 
       isLockedAndConfidential() {
@@ -30,12 +36,13 @@
 </script>
 <template>
   <div class="issuable-note-warning">
-    <i
-      aria-hidden="true"
-      class="fa icon"
-      :class="iconClass"
-      v-if="!isLockedAndConfidential"
-    ></i>
+    <icon
+        :name="warningIcon"
+        :size="16"
+        class="icon inline"
+        aria-hidden="true"
+        v-if="!isLockedAndConfidential">
+    </icon>
 
     <span v-if="isLockedAndConfidential">
       {{ __('This issue is confidential and locked.') }}
diff --git a/app/assets/javascripts/vue_shared/components/loading_button.vue b/app/assets/javascripts/vue_shared/components/loading_button.vue
index 6670b554faf..247943f83e6 100644
--- a/app/assets/javascripts/vue_shared/components/loading_button.vue
+++ b/app/assets/javascripts/vue_shared/components/loading_button.vue
@@ -26,10 +26,20 @@ export default {
       required: false,
       default: false,
     },
+    disabled: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
     label: {
       type: String,
       required: false,
     },
+    containerClass: {
+      type: String,
+      required: false,
+      default: 'btn btn-align-content',
+    },
   },
   components: {
     loadingIcon,
@@ -44,10 +54,10 @@ export default {
 
 <template>
   <button
-    class="btn btn-align-content"
     @click="onClick"
     type="button"
-    :disabled="loading"
+    :class="containerClass"
+    :disabled="loading || disabled"
   >
       <transition name="fade">
         <loading-icon
diff --git a/app/assets/javascripts/vue_shared/components/markdown/field.vue b/app/assets/javascripts/vue_shared/components/markdown/field.vue
index 6511828e982..a873e00d0f3 100644
--- a/app/assets/javascripts/vue_shared/components/markdown/field.vue
+++ b/app/assets/javascripts/vue_shared/components/markdown/field.vue
@@ -47,8 +47,10 @@
       },
     },
     methods: {
-      toggleMarkdownPreview() {
-        this.previewMarkdown = !this.previewMarkdown;
+      showPreviewTab() {
+        if (this.previewMarkdown) return;
+
+        this.previewMarkdown = true;
 
         /*
           Can't use `$refs` as the component is technically in the parent component
@@ -56,20 +58,22 @@
         */
         const text = this.$slots.textarea[0].elm.value;
 
-        if (!this.previewMarkdown) {
-          this.markdownPreview = '';
-        } else if (text) {
+        if (text) {
           this.markdownPreviewLoading = true;
           this.$http.post(this.markdownPreviewPath, { text })
             .then(resp => resp.json())
-            .then((data) => {
-              this.renderMarkdown(data);
-            })
+            .then(data => this.renderMarkdown(data))
             .catch(() => new Flash('Error loading markdown preview'));
         } else {
           this.renderMarkdown();
         }
       },
+
+      showWriteTab() {
+        this.markdownPreview = '';
+        this.previewMarkdown = false;
+      },
+
       renderMarkdown(data = {}) {
         this.markdownPreviewLoading = false;
         this.markdownPreview = data.body || 'Nothing to preview.';
@@ -106,7 +110,8 @@
     ref="gl-form">
     <markdown-header
       :preview-markdown="previewMarkdown"
-      @toggle-markdown="toggleMarkdownPreview" />
+      @preview-markdown="showPreviewTab"
+      @write-markdown="showWriteTab" />
     <div
       class="md-write-holder"
       v-show="!previewMarkdown">
diff --git a/app/assets/javascripts/vue_shared/components/markdown/header.vue b/app/assets/javascripts/vue_shared/components/markdown/header.vue
index 7541731083b..70f5fc1d664 100644
--- a/app/assets/javascripts/vue_shared/components/markdown/header.vue
+++ b/app/assets/javascripts/vue_shared/components/markdown/header.vue
@@ -18,23 +18,31 @@
       icon,
     },
     methods: {
-      toggleMarkdownPreview(e, form) {
-        if (form && !form.find('.js-vue-markdown-field').length) {
-          return;
-        } else if (e.target.blur) {
-          e.target.blur();
-        }
+      isMarkdownForm(form) {
+        return form && !form.find('.js-vue-markdown-field').length;
+      },
+
+      previewMarkdownTab(event, form) {
+        if (event.target.blur) event.target.blur();
+        if (this.isMarkdownForm(form)) return;
+
+        this.$emit('preview-markdown');
+      },
+
+      writeMarkdownTab(event, form) {
+        if (event.target.blur) event.target.blur();
+        if (this.isMarkdownForm(form)) return;
 
-        this.$emit('toggle-markdown');
+        this.$emit('write-markdown');
       },
     },
     mounted() {
-      $(document).on('markdown-preview:show.vue', this.toggleMarkdownPreview);
-      $(document).on('markdown-preview:hide.vue', this.toggleMarkdownPreview);
+      $(document).on('markdown-preview:show.vue', this.previewMarkdownTab);
+      $(document).on('markdown-preview:hide.vue', this.writeMarkdownTab);
     },
     beforeDestroy() {
-      $(document).on('markdown-preview:show.vue', this.toggleMarkdownPreview);
-      $(document).off('markdown-preview:hide.vue', this.toggleMarkdownPreview);
+      $(document).off('markdown-preview:show.vue', this.previewMarkdownTab);
+      $(document).off('markdown-preview:hide.vue', this.writeMarkdownTab);
     },
   };
 </script>
@@ -44,17 +52,19 @@
     <ul class="nav-links clearfix">
       <li :class="{ active: !previewMarkdown }">
         <a
+          class="js-write-link"
           href="#md-write-holder"
           tabindex="-1"
-          @click.prevent="toggleMarkdownPreview($event)">
+          @click.prevent="writeMarkdownTab($event)">
           Write
         </a>
       </li>
       <li :class="{ active: previewMarkdown }">
         <a
+          class="js-preview-link"
           href="#md-preview-holder"
           tabindex="-1"
-          @click.prevent="toggleMarkdownPreview($event)">
+          @click.prevent="previewMarkdownTab($event)">
           Preview
         </a>
       </li>
diff --git a/app/assets/javascripts/vue_shared/components/popup_dialog.vue b/app/assets/javascripts/vue_shared/components/popup_dialog.vue
index 9e8c10bdc1a..47efee64c6e 100644
--- a/app/assets/javascripts/vue_shared/components/popup_dialog.vue
+++ b/app/assets/javascripts/vue_shared/components/popup_dialog.vue
@@ -5,17 +5,27 @@ export default {
   props: {
     title: {
       type: String,
-      required: true,
+      required: false,
     },
     text: {
       type: String,
       required: false,
     },
+    hideFooter: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
     kind: {
       type: String,
       required: false,
       default: 'primary',
     },
+    modalDialogClass: {
+      type: String,
+      required: false,
+      default: '',
+    },
     closeKind: {
       type: String,
       required: false,
@@ -30,6 +40,11 @@ export default {
       type: String,
       required: true,
     },
+    submitDisabled: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
 
   computed: {
@@ -57,43 +72,58 @@ export default {
 </script>
 
 <template>
-<div
-  class="modal popup-dialog"
-  role="dialog"
-  tabindex="-1">
-  <div class="modal-dialog" role="document">
-    <div class="modal-content">
-      <div class="modal-header">
-        <button type="button"
-          class="close"
-          @click="close"
-          aria-label="Close">
-          <span aria-hidden="true">&times;</span>
-        </button>
-        <h4 class="modal-title">{{this.title}}</h4>
-      </div>
-      <div class="modal-body">
-        <slot name="body" :text="text">
-          <p>{{text}}</p>
-        </slot>
-      </div>
-      <div class="modal-footer">
-        <button
-          type="button"
-          class="btn"
-          :class="btnCancelKindClass"
-          @click="close">
-          {{ closeButtonLabel }}
-        </button>
-        <button
-          type="button"
-          class="btn"
-          :class="btnKindClass"
-          @click="emitSubmit(true)">
-          {{ primaryButtonLabel }}
-        </button>
+<div class="modal-open">
+  <div
+    class="modal popup-dialog"
+    role="dialog"
+    tabindex="-1"
+  >
+    <div
+      :class="modalDialogClass"
+      class="modal-dialog"
+      role="document"
+    >
+      <div class="modal-content">
+        <div class="modal-header">
+          <slot name="header">
+            <h4 class="modal-title pull-left">
+              {{this.title}}
+            </h4>
+            <button
+              type="button"
+              class="close pull-right"
+              @click="close"
+              aria-label="Close"
+            >
+              <span aria-hidden="true">&times;</span>
+            </button>
+          </slot>
+        </div>
+        <div class="modal-body">
+          <slot name="body" :text="text">
+            <p>{{this.text}}</p>
+          </slot>
+        </div>
+        <div class="modal-footer" v-if="!hideFooter">
+          <button
+            type="button"
+            class="btn pull-left"
+            :class="btnCancelKindClass"
+            @click="close">
+            {{ closeButtonLabel }}
+          </button>
+          <button
+            type="button"
+            class="btn pull-right"
+            :disabled="submitDisabled"
+            :class="btnKindClass"
+            @click="emitSubmit(true)">
+            {{ primaryButtonLabel }}
+          </button>
+        </div>
       </div>
     </div>
   </div>
+  <div class="modal-backdrop fade in" />
 </div>
 </template>
diff --git a/app/assets/javascripts/vue_shared/components/skeleton_loading_container.vue b/app/assets/javascripts/vue_shared/components/skeleton_loading_container.vue
new file mode 100644
index 00000000000..b06493e6c66
--- /dev/null
+++ b/app/assets/javascripts/vue_shared/components/skeleton_loading_container.vue
@@ -0,0 +1,37 @@
+<script>
+  export default {
+    props: {
+      small: {
+        type: Boolean,
+        required: false,
+        default: false,
+      },
+      lines: {
+        type: Number,
+        required: false,
+        default: 6,
+      },
+    },
+    computed: {
+      lineClasses() {
+        return new Array(this.lines).fill().map((_, i) => `skeleton-line-${i + 1}`);
+      },
+    },
+  };
+</script>
+
+<template>
+  <div
+    class="animation-container"
+    :class="{
+      'animation-container-small': small,
+    }"
+  >
+    <div
+      v-for="(css, index) in lineClasses"
+      :key="index"
+      :class="css"
+    >
+    </div>
+  </div>
+</template>
diff --git a/app/assets/javascripts/wikis.js b/app/assets/javascripts/wikis.js
index a0025ddb598..7a865587444 100644
--- a/app/assets/javascripts/wikis.js
+++ b/app/assets/javascripts/wikis.js
@@ -1,4 +1,5 @@
 import bp from './breakpoints';
+import { slugify } from './lib/utils/text_utility';
 
 export default class Wikis {
   constructor() {
@@ -23,7 +24,7 @@ export default class Wikis {
     if (!this.newWikiForm) return;
 
     const slugInput = this.newWikiForm.querySelector('#new_wiki_path');
-    const slug = gl.text.slugify(slugInput.value);
+    const slug = slugify(slugInput.value);
 
     if (slug.length > 0) {
       const wikisPath = slugInput.getAttribute('data-wikis-path');
diff --git a/app/assets/stylesheets/framework.scss b/app/assets/stylesheets/framework.scss
index c334f39f416..66212be1b8f 100644
--- a/app/assets/stylesheets/framework.scss
+++ b/app/assets/stylesheets/framework.scss
@@ -34,6 +34,7 @@
 @import "framework/modal";
 @import "framework/pagination";
 @import "framework/panels";
+@import "framework/popup";
 @import "framework/secondary-navigation-elements";
 @import "framework/selects";
 @import "framework/sidebar";
diff --git a/app/assets/stylesheets/framework/animations.scss b/app/assets/stylesheets/framework/animations.scss
index 1b944831082..374988bb590 100644
--- a/app/assets/stylesheets/framework/animations.scss
+++ b/app/assets/stylesheets/framework/animations.scss
@@ -23,16 +23,6 @@
     @include webkit-prefix(animation-duration, 2s);
   }
 
-  &.spin-cw {
-    transform-origin: center;
-    animation: spin 4s linear infinite;
-  }
-
-  &.spin-ccw {
-    transform-origin: center;
-    animation: spin 4s linear infinite reverse;
-  }
-
   &.flipOutX,
   &.flipOutY,
   &.bounceIn,
@@ -281,9 +271,3 @@ a {
     transform: translateX(468px);
   }
 }
-
-@keyframes spin {
-  100% {
-    transform: rotate(360deg);
-  }
-}
diff --git a/app/assets/stylesheets/framework/avatar.scss b/app/assets/stylesheets/framework/avatar.scss
index f1aedc227f3..26db2386879 100644
--- a/app/assets/stylesheets/framework/avatar.scss
+++ b/app/assets/stylesheets/framework/avatar.scss
@@ -42,8 +42,7 @@
   &.avatar-inline {
     float: none;
     display: inline-block;
-    margin-left: 4px;
-    margin-bottom: 2px;
+    margin-left: 2px;
     flex-shrink: 0;
     -webkit-flex-shrink: 0;
 
@@ -59,7 +58,7 @@
 
   &.avatar-tile {
     border-radius: 0;
-    border: none;
+    border: 0;
   }
 
   &:not([href]):hover {
@@ -96,7 +95,7 @@
 
   .avatar {
     border-radius: 0;
-    border: none;
+    border: 0;
     height: auto;
     width: 100%;
     margin: 0;
diff --git a/app/assets/stylesheets/framework/blank.scss b/app/assets/stylesheets/framework/blank.scss
index 6bb096fc5bd..10f9e9b70b0 100644
--- a/app/assets/stylesheets/framework/blank.scss
+++ b/app/assets/stylesheets/framework/blank.scss
@@ -7,29 +7,67 @@
     width: 100%;
     height: 100%;
     padding-bottom: 25px;
-    border: 1px solid $border-color;
     border-radius: $border-radius-default;
   }
 }
 
-.blank-state {
-  padding-top: 20px;
-  padding-bottom: 20px;
+.blank-state-row {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-around;
+  height: 100%;
+}
+
+.blank-state-welcome {
   text-align: center;
+  padding: 20px 0 40px;
+
+  .blank-state-welcome-title {
+    font-size: 24px;
+  }
+
+  .blank-state-text {
+    margin-bottom: 0;
+  }
+}
 
-  &.blank-state-welcome {
-    .blank-state-welcome-title {
-      font-size: 24px;
+.blank-state-link {
+  display: block;
+  color: $gl-text-color;
+  flex: 0 0 100%;
+  margin-bottom: 15px;
+
+  @media (min-width: $screen-sm-min) {
+    flex: 0 0 49%;
+
+    &:nth-child(odd) {
+      margin-right: 5px;
     }
 
-    .blank-state-text {
-      margin-bottom: 0;
+    &:nth-child(even) {
+      margin-left: 5px;
     }
   }
 
-  .blank-state-icon {
-    padding-bottom: 20px;
+  &:hover {
+    background-color: $gray-light;
+    text-decoration: none;
+    color: $gl-text-color;
+  }
+}
+
+.blank-state {
+  padding: 20px;
+  border: 1px solid $border-color;
+  border-radius: $border-radius-default;
+
+  @media (min-width: $screen-sm-min) {
+    display: flex;
+    align-items: center;
+    padding: 50px 30px;
+  }
 
+  .blank-state-icon {
     svg {
       display: block;
       margin: auto;
@@ -38,13 +76,17 @@
 
   .blank-state-title {
     margin-top: 0;
-    margin-bottom: 10px;
     font-size: 18px;
   }
 
-  .blank-state-text {
-    max-width: $container-text-max-width;
-    margin: 0 auto $gl-padding;
-    font-size: 14px;
+  .blank-state-body {
+    @media (max-width: $screen-xs-max) {
+      text-align: center;
+      margin-top: 20px;
+    }
+
+    @media (min-width: $screen-sm-min) {
+      padding-left: 20px;
+    }
   }
 }
diff --git a/app/assets/stylesheets/framework/blocks.scss b/app/assets/stylesheets/framework/blocks.scss
index def986180fc..91976ca1f56 100644
--- a/app/assets/stylesheets/framework/blocks.scss
+++ b/app/assets/stylesheets/framework/blocks.scss
@@ -39,7 +39,7 @@
   }
 
   &.top-block {
-    border-top: none;
+    border-top: 0;
 
     .container-fluid {
       background-color: inherit;
@@ -63,7 +63,7 @@
 
   &.footer-block {
     margin-top: 0;
-    border-bottom: none;
+    border-bottom: 0;
     margin-bottom: -$gl-padding;
   }
 
@@ -100,7 +100,7 @@
 
   &.build-content {
     background-color: $white-light;
-    border-top: none;
+    border-top: 0;
   }
 }
 
@@ -287,12 +287,12 @@
     cursor: pointer;
     color: $blue-300;
     z-index: 1;
-    border: none;
+    border: 0;
     background-color: transparent;
 
     &:hover,
     &:focus {
-      border: none;
+      border: 0;
       color: $blue-400;
     }
   }
@@ -353,3 +353,7 @@
   display: -webkit-flex;
   display: flex;
 }
+
+.flex-right {
+  margin-left: auto;
+}
diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss
index 00a0e9cef67..b2f26cf7159 100644
--- a/app/assets/stylesheets/framework/buttons.scss
+++ b/app/assets/stylesheets/framework/buttons.scss
@@ -294,6 +294,7 @@
 
 .btn-align-content {
   display: flex;
+  justify-content: center;
   align-items: center;
 }
 
@@ -304,7 +305,7 @@
 }
 
 .btn-clipboard {
-  border: none;
+  border: 0;
   padding: 0 5px;
 }
 
diff --git a/app/assets/stylesheets/framework/common.scss b/app/assets/stylesheets/framework/common.scss
index ea3007f5e08..5f5b5657a2f 100644
--- a/app/assets/stylesheets/framework/common.scss
+++ b/app/assets/stylesheets/framework/common.scss
@@ -4,6 +4,9 @@
 .cred { color: $common-red; }
 .cgreen { color: $common-green; }
 .cdark { color: $common-gray-dark; }
+.text-secondary {
+  color: $gl-text-color-secondary;
+}
 
 .underlined-link { text-decoration: underline; }
 .hint { font-style: italic; color: $hint-color; }
@@ -28,7 +31,7 @@
 pre {
   &.clean {
     background: none;
-    border: none;
+    border: 0;
     margin: 0;
     padding: 0;
   }
@@ -142,7 +145,7 @@ li.note {
   img { max-width: 100%; }
   .note-title {
     li {
-      border-bottom: none !important;
+      border-bottom: 0 !important;
     }
   }
 }
@@ -187,7 +190,7 @@ li.note {
 
   pre {
     background: $white-light;
-    border: none;
+    border: 0;
     font-size: 12px;
   }
 }
@@ -386,7 +389,7 @@ img.emoji {
 }
 
 .hide-bottom-border {
-  border-bottom: none !important;
+  border-bottom: 0 !important;
 }
 
 .gl-accessibility {
diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index 08c603edd23..579bd48fac6 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -37,6 +37,7 @@
   .dropdown-menu-nav {
     @include set-visible;
     display: block;
+    min-height: 40px;
 
     @media (max-width: $screen-xs-max) {
       width: 100%;
diff --git a/app/assets/stylesheets/framework/emoji-sprites.scss b/app/assets/stylesheets/framework/emoji-sprites.scss
index 925415f84b1..0174e17b660 100644
--- a/app/assets/stylesheets/framework/emoji-sprites.scss
+++ b/app/assets/stylesheets/framework/emoji-sprites.scss
@@ -765,1031 +765,1033 @@
 .emoji-full_moon { background-position: -160px -540px; }
 .emoji-full_moon_with_face { background-position: -180px -540px; }
 .emoji-game_die { background-position: -200px -540px; }
-.emoji-gear { background-position: -220px -540px; }
-.emoji-gem { background-position: -240px -540px; }
-.emoji-gemini { background-position: -260px -540px; }
-.emoji-ghost { background-position: -280px -540px; }
-.emoji-gift { background-position: -300px -540px; }
-.emoji-gift_heart { background-position: -320px -540px; }
-.emoji-girl { background-position: -340px -540px; }
-.emoji-girl_tone1 { background-position: -360px -540px; }
-.emoji-girl_tone2 { background-position: -380px -540px; }
-.emoji-girl_tone3 { background-position: -400px -540px; }
-.emoji-girl_tone4 { background-position: -420px -540px; }
-.emoji-girl_tone5 { background-position: -440px -540px; }
-.emoji-globe_with_meridians { background-position: -460px -540px; }
-.emoji-goal { background-position: -480px -540px; }
-.emoji-goat { background-position: -500px -540px; }
-.emoji-golf { background-position: -520px -540px; }
-.emoji-golfer { background-position: -540px -540px; }
-.emoji-gorilla { background-position: -560px 0; }
-.emoji-grapes { background-position: -560px -20px; }
-.emoji-green_apple { background-position: -560px -40px; }
-.emoji-green_book { background-position: -560px -60px; }
-.emoji-green_heart { background-position: -560px -80px; }
-.emoji-grey_exclamation { background-position: -560px -100px; }
-.emoji-grey_question { background-position: -560px -120px; }
-.emoji-grimacing { background-position: -560px -140px; }
-.emoji-grin { background-position: -560px -160px; }
-.emoji-grinning { background-position: -560px -180px; }
-.emoji-guardsman { background-position: -560px -200px; }
-.emoji-guardsman_tone1 { background-position: -560px -220px; }
-.emoji-guardsman_tone2 { background-position: -560px -240px; }
-.emoji-guardsman_tone3 { background-position: -560px -260px; }
-.emoji-guardsman_tone4 { background-position: -560px -280px; }
-.emoji-guardsman_tone5 { background-position: -560px -300px; }
-.emoji-guitar { background-position: -560px -320px; }
-.emoji-gun { background-position: -560px -340px; }
-.emoji-haircut { background-position: -560px -360px; }
-.emoji-haircut_tone1 { background-position: -560px -380px; }
-.emoji-haircut_tone2 { background-position: -560px -400px; }
-.emoji-haircut_tone3 { background-position: -560px -420px; }
-.emoji-haircut_tone4 { background-position: -560px -440px; }
-.emoji-haircut_tone5 { background-position: -560px -460px; }
-.emoji-hamburger { background-position: -560px -480px; }
-.emoji-hammer { background-position: -560px -500px; }
-.emoji-hammer_pick { background-position: -560px -520px; }
-.emoji-hamster { background-position: -560px -540px; }
-.emoji-hand_splayed { background-position: 0 -560px; }
-.emoji-hand_splayed_tone1 { background-position: -20px -560px; }
-.emoji-hand_splayed_tone2 { background-position: -40px -560px; }
-.emoji-hand_splayed_tone3 { background-position: -60px -560px; }
-.emoji-hand_splayed_tone4 { background-position: -80px -560px; }
-.emoji-hand_splayed_tone5 { background-position: -100px -560px; }
-.emoji-handbag { background-position: -120px -560px; }
-.emoji-handball { background-position: -140px -560px; }
-.emoji-handball_tone1 { background-position: -160px -560px; }
-.emoji-handball_tone2 { background-position: -180px -560px; }
-.emoji-handball_tone3 { background-position: -200px -560px; }
-.emoji-handball_tone4 { background-position: -220px -560px; }
-.emoji-handball_tone5 { background-position: -240px -560px; }
-.emoji-handshake { background-position: -260px -560px; }
-.emoji-handshake_tone1 { background-position: -280px -560px; }
-.emoji-handshake_tone2 { background-position: -300px -560px; }
-.emoji-handshake_tone3 { background-position: -320px -560px; }
-.emoji-handshake_tone4 { background-position: -340px -560px; }
-.emoji-handshake_tone5 { background-position: -360px -560px; }
-.emoji-hash { background-position: -380px -560px; }
-.emoji-hatched_chick { background-position: -400px -560px; }
-.emoji-hatching_chick { background-position: -420px -560px; }
-.emoji-head_bandage { background-position: -440px -560px; }
-.emoji-headphones { background-position: -460px -560px; }
-.emoji-hear_no_evil { background-position: -480px -560px; }
-.emoji-heart { background-position: -500px -560px; }
-.emoji-heart_decoration { background-position: -520px -560px; }
-.emoji-heart_exclamation { background-position: -540px -560px; }
-.emoji-heart_eyes { background-position: -560px -560px; }
-.emoji-heart_eyes_cat { background-position: -580px 0; }
-.emoji-heartbeat { background-position: -580px -20px; }
-.emoji-heartpulse { background-position: -580px -40px; }
-.emoji-hearts { background-position: -580px -60px; }
-.emoji-heavy_check_mark { background-position: -580px -80px; }
-.emoji-heavy_division_sign { background-position: -580px -100px; }
-.emoji-heavy_dollar_sign { background-position: -580px -120px; }
-.emoji-heavy_minus_sign { background-position: -580px -140px; }
-.emoji-heavy_multiplication_x { background-position: -580px -160px; }
-.emoji-heavy_plus_sign { background-position: -580px -180px; }
-.emoji-helicopter { background-position: -580px -200px; }
-.emoji-helmet_with_cross { background-position: -580px -220px; }
-.emoji-herb { background-position: -580px -240px; }
-.emoji-hibiscus { background-position: -580px -260px; }
-.emoji-high_brightness { background-position: -580px -280px; }
-.emoji-high_heel { background-position: -580px -300px; }
-.emoji-hockey { background-position: -580px -320px; }
-.emoji-hole { background-position: -580px -340px; }
-.emoji-homes { background-position: -580px -360px; }
-.emoji-honey_pot { background-position: -580px -380px; }
-.emoji-horse { background-position: -580px -400px; }
-.emoji-horse_racing { background-position: -580px -420px; }
-.emoji-horse_racing_tone1 { background-position: -580px -440px; }
-.emoji-horse_racing_tone2 { background-position: -580px -460px; }
-.emoji-horse_racing_tone3 { background-position: -580px -480px; }
-.emoji-horse_racing_tone4 { background-position: -580px -500px; }
-.emoji-horse_racing_tone5 { background-position: -580px -520px; }
-.emoji-hospital { background-position: -580px -540px; }
-.emoji-hot_pepper { background-position: -580px -560px; }
-.emoji-hotdog { background-position: 0 -580px; }
-.emoji-hotel { background-position: -20px -580px; }
-.emoji-hotsprings { background-position: -40px -580px; }
-.emoji-hourglass { background-position: -60px -580px; }
-.emoji-hourglass_flowing_sand { background-position: -80px -580px; }
-.emoji-house { background-position: -100px -580px; }
-.emoji-house_abandoned { background-position: -120px -580px; }
-.emoji-house_with_garden { background-position: -140px -580px; }
-.emoji-hugging { background-position: -160px -580px; }
-.emoji-hushed { background-position: -180px -580px; }
-.emoji-ice_cream { background-position: -200px -580px; }
-.emoji-ice_skate { background-position: -220px -580px; }
-.emoji-icecream { background-position: -240px -580px; }
-.emoji-id { background-position: -260px -580px; }
-.emoji-ideograph_advantage { background-position: -280px -580px; }
-.emoji-imp { background-position: -300px -580px; }
-.emoji-inbox_tray { background-position: -320px -580px; }
-.emoji-incoming_envelope { background-position: -340px -580px; }
-.emoji-information_desk_person { background-position: -360px -580px; }
-.emoji-information_desk_person_tone1 { background-position: -380px -580px; }
-.emoji-information_desk_person_tone2 { background-position: -400px -580px; }
-.emoji-information_desk_person_tone3 { background-position: -420px -580px; }
-.emoji-information_desk_person_tone4 { background-position: -440px -580px; }
-.emoji-information_desk_person_tone5 { background-position: -460px -580px; }
-.emoji-information_source { background-position: -480px -580px; }
-.emoji-innocent { background-position: -500px -580px; }
-.emoji-interrobang { background-position: -520px -580px; }
-.emoji-iphone { background-position: -540px -580px; }
-.emoji-island { background-position: -560px -580px; }
-.emoji-izakaya_lantern { background-position: -580px -580px; }
-.emoji-jack_o_lantern { background-position: -600px 0; }
-.emoji-japan { background-position: -600px -20px; }
-.emoji-japanese_castle { background-position: -600px -40px; }
-.emoji-japanese_goblin { background-position: -600px -60px; }
-.emoji-japanese_ogre { background-position: -600px -80px; }
-.emoji-jeans { background-position: -600px -100px; }
-.emoji-joy { background-position: -600px -120px; }
-.emoji-joy_cat { background-position: -600px -140px; }
-.emoji-joystick { background-position: -600px -160px; }
-.emoji-juggling { background-position: -600px -180px; }
-.emoji-juggling_tone1 { background-position: -600px -200px; }
-.emoji-juggling_tone2 { background-position: -600px -220px; }
-.emoji-juggling_tone3 { background-position: -600px -240px; }
-.emoji-juggling_tone4 { background-position: -600px -260px; }
-.emoji-juggling_tone5 { background-position: -600px -280px; }
-.emoji-kaaba { background-position: -600px -300px; }
-.emoji-key { background-position: -600px -320px; }
-.emoji-key2 { background-position: -600px -340px; }
-.emoji-keyboard { background-position: -600px -360px; }
-.emoji-kimono { background-position: -600px -380px; }
-.emoji-kiss { background-position: -600px -400px; }
-.emoji-kiss_mm { background-position: -600px -420px; }
-.emoji-kiss_ww { background-position: -600px -440px; }
-.emoji-kissing { background-position: -600px -460px; }
-.emoji-kissing_cat { background-position: -600px -480px; }
-.emoji-kissing_closed_eyes { background-position: -600px -500px; }
-.emoji-kissing_heart { background-position: -600px -520px; }
-.emoji-kissing_smiling_eyes { background-position: -600px -540px; }
-.emoji-kiwi { background-position: -600px -560px; }
-.emoji-knife { background-position: -600px -580px; }
-.emoji-koala { background-position: 0 -600px; }
-.emoji-koko { background-position: -20px -600px; }
-.emoji-label { background-position: -40px -600px; }
-.emoji-large_blue_circle { background-position: -60px -600px; }
-.emoji-large_blue_diamond { background-position: -80px -600px; }
-.emoji-large_orange_diamond { background-position: -100px -600px; }
-.emoji-last_quarter_moon { background-position: -120px -600px; }
-.emoji-last_quarter_moon_with_face { background-position: -140px -600px; }
-.emoji-laughing { background-position: -160px -600px; }
-.emoji-leaves { background-position: -180px -600px; }
-.emoji-ledger { background-position: -200px -600px; }
-.emoji-left_facing_fist { background-position: -220px -600px; }
-.emoji-left_facing_fist_tone1 { background-position: -240px -600px; }
-.emoji-left_facing_fist_tone2 { background-position: -260px -600px; }
-.emoji-left_facing_fist_tone3 { background-position: -280px -600px; }
-.emoji-left_facing_fist_tone4 { background-position: -300px -600px; }
-.emoji-left_facing_fist_tone5 { background-position: -320px -600px; }
-.emoji-left_luggage { background-position: -340px -600px; }
-.emoji-left_right_arrow { background-position: -360px -600px; }
-.emoji-leftwards_arrow_with_hook { background-position: -380px -600px; }
-.emoji-lemon { background-position: -400px -600px; }
-.emoji-leo { background-position: -420px -600px; }
-.emoji-leopard { background-position: -440px -600px; }
-.emoji-level_slider { background-position: -460px -600px; }
-.emoji-levitate { background-position: -480px -600px; }
-.emoji-libra { background-position: -500px -600px; }
-.emoji-lifter { background-position: -520px -600px; }
-.emoji-lifter_tone1 { background-position: -540px -600px; }
-.emoji-lifter_tone2 { background-position: -560px -600px; }
-.emoji-lifter_tone3 { background-position: -580px -600px; }
-.emoji-lifter_tone4 { background-position: -600px -600px; }
-.emoji-lifter_tone5 { background-position: -620px 0; }
-.emoji-light_rail { background-position: -620px -20px; }
-.emoji-link { background-position: -620px -40px; }
-.emoji-lion_face { background-position: -620px -60px; }
-.emoji-lips { background-position: -620px -80px; }
-.emoji-lipstick { background-position: -620px -100px; }
-.emoji-lizard { background-position: -620px -120px; }
-.emoji-lock { background-position: -620px -140px; }
-.emoji-lock_with_ink_pen { background-position: -620px -160px; }
-.emoji-lollipop { background-position: -620px -180px; }
-.emoji-loop { background-position: -620px -200px; }
-.emoji-loud_sound { background-position: -620px -220px; }
-.emoji-loudspeaker { background-position: -620px -240px; }
-.emoji-love_hotel { background-position: -620px -260px; }
-.emoji-love_letter { background-position: -620px -280px; }
-.emoji-low_brightness { background-position: -620px -300px; }
-.emoji-lying_face { background-position: -620px -320px; }
-.emoji-m { background-position: -620px -340px; }
-.emoji-mag { background-position: -620px -360px; }
-.emoji-mag_right { background-position: -620px -380px; }
-.emoji-mahjong { background-position: -620px -400px; }
-.emoji-mailbox { background-position: -620px -420px; }
-.emoji-mailbox_closed { background-position: -620px -440px; }
-.emoji-mailbox_with_mail { background-position: -620px -460px; }
-.emoji-mailbox_with_no_mail { background-position: -620px -480px; }
-.emoji-man { background-position: -620px -500px; }
-.emoji-man_dancing { background-position: -620px -520px; }
-.emoji-man_dancing_tone1 { background-position: -620px -540px; }
-.emoji-man_dancing_tone2 { background-position: -620px -560px; }
-.emoji-man_dancing_tone3 { background-position: -620px -580px; }
-.emoji-man_dancing_tone4 { background-position: -620px -600px; }
-.emoji-man_dancing_tone5 { background-position: 0 -620px; }
-.emoji-man_in_tuxedo { background-position: -20px -620px; }
-.emoji-man_in_tuxedo_tone1 { background-position: -40px -620px; }
-.emoji-man_in_tuxedo_tone2 { background-position: -60px -620px; }
-.emoji-man_in_tuxedo_tone3 { background-position: -80px -620px; }
-.emoji-man_in_tuxedo_tone4 { background-position: -100px -620px; }
-.emoji-man_in_tuxedo_tone5 { background-position: -120px -620px; }
-.emoji-man_tone1 { background-position: -140px -620px; }
-.emoji-man_tone2 { background-position: -160px -620px; }
-.emoji-man_tone3 { background-position: -180px -620px; }
-.emoji-man_tone4 { background-position: -200px -620px; }
-.emoji-man_tone5 { background-position: -220px -620px; }
-.emoji-man_with_gua_pi_mao { background-position: -240px -620px; }
-.emoji-man_with_gua_pi_mao_tone1 { background-position: -260px -620px; }
-.emoji-man_with_gua_pi_mao_tone2 { background-position: -280px -620px; }
-.emoji-man_with_gua_pi_mao_tone3 { background-position: -300px -620px; }
-.emoji-man_with_gua_pi_mao_tone4 { background-position: -320px -620px; }
-.emoji-man_with_gua_pi_mao_tone5 { background-position: -340px -620px; }
-.emoji-man_with_turban { background-position: -360px -620px; }
-.emoji-man_with_turban_tone1 { background-position: -380px -620px; }
-.emoji-man_with_turban_tone2 { background-position: -400px -620px; }
-.emoji-man_with_turban_tone3 { background-position: -420px -620px; }
-.emoji-man_with_turban_tone4 { background-position: -440px -620px; }
-.emoji-man_with_turban_tone5 { background-position: -460px -620px; }
-.emoji-mans_shoe { background-position: -480px -620px; }
-.emoji-map { background-position: -500px -620px; }
-.emoji-maple_leaf { background-position: -520px -620px; }
-.emoji-martial_arts_uniform { background-position: -540px -620px; }
-.emoji-mask { background-position: -560px -620px; }
-.emoji-massage { background-position: -580px -620px; }
-.emoji-massage_tone1 { background-position: -600px -620px; }
-.emoji-massage_tone2 { background-position: -620px -620px; }
-.emoji-massage_tone3 { background-position: -640px 0; }
-.emoji-massage_tone4 { background-position: -640px -20px; }
-.emoji-massage_tone5 { background-position: -640px -40px; }
-.emoji-meat_on_bone { background-position: -640px -60px; }
-.emoji-medal { background-position: -640px -80px; }
-.emoji-mega { background-position: -640px -100px; }
-.emoji-melon { background-position: -640px -120px; }
-.emoji-menorah { background-position: -640px -140px; }
-.emoji-mens { background-position: -640px -160px; }
-.emoji-metal { background-position: -640px -180px; }
-.emoji-metal_tone1 { background-position: -640px -200px; }
-.emoji-metal_tone2 { background-position: -640px -220px; }
-.emoji-metal_tone3 { background-position: -640px -240px; }
-.emoji-metal_tone4 { background-position: -640px -260px; }
-.emoji-metal_tone5 { background-position: -640px -280px; }
-.emoji-metro { background-position: -640px -300px; }
-.emoji-microphone { background-position: -640px -320px; }
-.emoji-microphone2 { background-position: -640px -340px; }
-.emoji-microscope { background-position: -640px -360px; }
-.emoji-middle_finger { background-position: -640px -380px; }
-.emoji-middle_finger_tone1 { background-position: -640px -400px; }
-.emoji-middle_finger_tone2 { background-position: -640px -420px; }
-.emoji-middle_finger_tone3 { background-position: -640px -440px; }
-.emoji-middle_finger_tone4 { background-position: -640px -460px; }
-.emoji-middle_finger_tone5 { background-position: -640px -480px; }
-.emoji-military_medal { background-position: -640px -500px; }
-.emoji-milk { background-position: -640px -520px; }
-.emoji-milky_way { background-position: -640px -540px; }
-.emoji-minibus { background-position: -640px -560px; }
-.emoji-minidisc { background-position: -640px -580px; }
-.emoji-mobile_phone_off { background-position: -640px -600px; }
-.emoji-money_mouth { background-position: -640px -620px; }
-.emoji-money_with_wings { background-position: 0 -640px; }
-.emoji-moneybag { background-position: -20px -640px; }
-.emoji-monkey { background-position: -40px -640px; }
-.emoji-monkey_face { background-position: -60px -640px; }
-.emoji-monorail { background-position: -80px -640px; }
-.emoji-mortar_board { background-position: -100px -640px; }
-.emoji-mosque { background-position: -120px -640px; }
-.emoji-motor_scooter { background-position: -140px -640px; }
-.emoji-motorboat { background-position: -160px -640px; }
-.emoji-motorcycle { background-position: -180px -640px; }
-.emoji-motorway { background-position: -200px -640px; }
-.emoji-mount_fuji { background-position: -220px -640px; }
-.emoji-mountain { background-position: -240px -640px; }
-.emoji-mountain_bicyclist { background-position: -260px -640px; }
-.emoji-mountain_bicyclist_tone1 { background-position: -280px -640px; }
-.emoji-mountain_bicyclist_tone2 { background-position: -300px -640px; }
-.emoji-mountain_bicyclist_tone3 { background-position: -320px -640px; }
-.emoji-mountain_bicyclist_tone4 { background-position: -340px -640px; }
-.emoji-mountain_bicyclist_tone5 { background-position: -360px -640px; }
-.emoji-mountain_cableway { background-position: -380px -640px; }
-.emoji-mountain_railway { background-position: -400px -640px; }
-.emoji-mountain_snow { background-position: -420px -640px; }
-.emoji-mouse { background-position: -440px -640px; }
-.emoji-mouse2 { background-position: -460px -640px; }
-.emoji-mouse_three_button { background-position: -480px -640px; }
-.emoji-movie_camera { background-position: -500px -640px; }
-.emoji-moyai { background-position: -520px -640px; }
-.emoji-mrs_claus { background-position: -540px -640px; }
-.emoji-mrs_claus_tone1 { background-position: -560px -640px; }
-.emoji-mrs_claus_tone2 { background-position: -580px -640px; }
-.emoji-mrs_claus_tone3 { background-position: -600px -640px; }
-.emoji-mrs_claus_tone4 { background-position: -620px -640px; }
-.emoji-mrs_claus_tone5 { background-position: -640px -640px; }
-.emoji-muscle { background-position: -660px 0; }
-.emoji-muscle_tone1 { background-position: -660px -20px; }
-.emoji-muscle_tone2 { background-position: -660px -40px; }
-.emoji-muscle_tone3 { background-position: -660px -60px; }
-.emoji-muscle_tone4 { background-position: -660px -80px; }
-.emoji-muscle_tone5 { background-position: -660px -100px; }
-.emoji-mushroom { background-position: -660px -120px; }
-.emoji-musical_keyboard { background-position: -660px -140px; }
-.emoji-musical_note { background-position: -660px -160px; }
-.emoji-musical_score { background-position: -660px -180px; }
-.emoji-mute { background-position: -660px -200px; }
-.emoji-nail_care { background-position: -660px -220px; }
-.emoji-nail_care_tone1 { background-position: -660px -240px; }
-.emoji-nail_care_tone2 { background-position: -660px -260px; }
-.emoji-nail_care_tone3 { background-position: -660px -280px; }
-.emoji-nail_care_tone4 { background-position: -660px -300px; }
-.emoji-nail_care_tone5 { background-position: -660px -320px; }
-.emoji-name_badge { background-position: -660px -340px; }
-.emoji-nauseated_face { background-position: -660px -360px; }
-.emoji-necktie { background-position: -660px -380px; }
-.emoji-negative_squared_cross_mark { background-position: -660px -400px; }
-.emoji-nerd { background-position: -660px -420px; }
-.emoji-neutral_face { background-position: -660px -440px; }
-.emoji-new { background-position: -660px -460px; }
-.emoji-new_moon { background-position: -660px -480px; }
-.emoji-new_moon_with_face { background-position: -660px -500px; }
-.emoji-newspaper { background-position: -660px -520px; }
-.emoji-newspaper2 { background-position: -660px -540px; }
-.emoji-ng { background-position: -660px -560px; }
-.emoji-night_with_stars { background-position: -660px -580px; }
-.emoji-nine { background-position: -660px -600px; }
-.emoji-no_bell { background-position: -660px -620px; }
-.emoji-no_bicycles { background-position: -660px -640px; }
-.emoji-no_entry { background-position: 0 -660px; }
-.emoji-no_entry_sign { background-position: -20px -660px; }
-.emoji-no_good { background-position: -40px -660px; }
-.emoji-no_good_tone1 { background-position: -60px -660px; }
-.emoji-no_good_tone2 { background-position: -80px -660px; }
-.emoji-no_good_tone3 { background-position: -100px -660px; }
-.emoji-no_good_tone4 { background-position: -120px -660px; }
-.emoji-no_good_tone5 { background-position: -140px -660px; }
-.emoji-no_mobile_phones { background-position: -160px -660px; }
-.emoji-no_mouth { background-position: -180px -660px; }
-.emoji-no_pedestrians { background-position: -200px -660px; }
-.emoji-no_smoking { background-position: -220px -660px; }
-.emoji-non-potable_water { background-position: -240px -660px; }
-.emoji-nose { background-position: -260px -660px; }
-.emoji-nose_tone1 { background-position: -280px -660px; }
-.emoji-nose_tone2 { background-position: -300px -660px; }
-.emoji-nose_tone3 { background-position: -320px -660px; }
-.emoji-nose_tone4 { background-position: -340px -660px; }
-.emoji-nose_tone5 { background-position: -360px -660px; }
-.emoji-notebook { background-position: -380px -660px; }
-.emoji-notebook_with_decorative_cover { background-position: -400px -660px; }
-.emoji-notepad_spiral { background-position: -420px -660px; }
-.emoji-notes { background-position: -440px -660px; }
-.emoji-nut_and_bolt { background-position: -460px -660px; }
-.emoji-o { background-position: -480px -660px; }
-.emoji-o2 { background-position: -500px -660px; }
-.emoji-ocean { background-position: -520px -660px; }
-.emoji-octagonal_sign { background-position: -540px -660px; }
-.emoji-octopus { background-position: -560px -660px; }
-.emoji-oden { background-position: -580px -660px; }
-.emoji-office { background-position: -600px -660px; }
-.emoji-oil { background-position: -620px -660px; }
-.emoji-ok { background-position: -640px -660px; }
-.emoji-ok_hand { background-position: -660px -660px; }
-.emoji-ok_hand_tone1 { background-position: -680px 0; }
-.emoji-ok_hand_tone2 { background-position: -680px -20px; }
-.emoji-ok_hand_tone3 { background-position: -680px -40px; }
-.emoji-ok_hand_tone4 { background-position: -680px -60px; }
-.emoji-ok_hand_tone5 { background-position: -680px -80px; }
-.emoji-ok_woman { background-position: -680px -100px; }
-.emoji-ok_woman_tone1 { background-position: -680px -120px; }
-.emoji-ok_woman_tone2 { background-position: -680px -140px; }
-.emoji-ok_woman_tone3 { background-position: -680px -160px; }
-.emoji-ok_woman_tone4 { background-position: -680px -180px; }
-.emoji-ok_woman_tone5 { background-position: -680px -200px; }
-.emoji-older_man { background-position: -680px -220px; }
-.emoji-older_man_tone1 { background-position: -680px -240px; }
-.emoji-older_man_tone2 { background-position: -680px -260px; }
-.emoji-older_man_tone3 { background-position: -680px -280px; }
-.emoji-older_man_tone4 { background-position: -680px -300px; }
-.emoji-older_man_tone5 { background-position: -680px -320px; }
-.emoji-older_woman { background-position: -680px -340px; }
-.emoji-older_woman_tone1 { background-position: -680px -360px; }
-.emoji-older_woman_tone2 { background-position: -680px -380px; }
-.emoji-older_woman_tone3 { background-position: -680px -400px; }
-.emoji-older_woman_tone4 { background-position: -680px -420px; }
-.emoji-older_woman_tone5 { background-position: -680px -440px; }
-.emoji-om_symbol { background-position: -680px -460px; }
-.emoji-on { background-position: -680px -480px; }
-.emoji-oncoming_automobile { background-position: -680px -500px; }
-.emoji-oncoming_bus { background-position: -680px -520px; }
-.emoji-oncoming_police_car { background-position: -680px -540px; }
-.emoji-oncoming_taxi { background-position: -680px -560px; }
-.emoji-one { background-position: -680px -580px; }
-.emoji-open_file_folder { background-position: -680px -600px; }
-.emoji-open_hands { background-position: -680px -620px; }
-.emoji-open_hands_tone1 { background-position: -680px -640px; }
-.emoji-open_hands_tone2 { background-position: -680px -660px; }
-.emoji-open_hands_tone3 { background-position: 0 -680px; }
-.emoji-open_hands_tone4 { background-position: -20px -680px; }
-.emoji-open_hands_tone5 { background-position: -40px -680px; }
-.emoji-open_mouth { background-position: -60px -680px; }
-.emoji-ophiuchus { background-position: -80px -680px; }
-.emoji-orange_book { background-position: -100px -680px; }
-.emoji-orthodox_cross { background-position: -120px -680px; }
-.emoji-outbox_tray { background-position: -140px -680px; }
-.emoji-owl { background-position: -160px -680px; }
-.emoji-ox { background-position: -180px -680px; }
-.emoji-package { background-position: -200px -680px; }
-.emoji-page_facing_up { background-position: -220px -680px; }
-.emoji-page_with_curl { background-position: -240px -680px; }
-.emoji-pager { background-position: -260px -680px; }
-.emoji-paintbrush { background-position: -280px -680px; }
-.emoji-palm_tree { background-position: -300px -680px; }
-.emoji-pancakes { background-position: -320px -680px; }
-.emoji-panda_face { background-position: -340px -680px; }
-.emoji-paperclip { background-position: -360px -680px; }
-.emoji-paperclips { background-position: -380px -680px; }
-.emoji-park { background-position: -400px -680px; }
-.emoji-parking { background-position: -420px -680px; }
-.emoji-part_alternation_mark { background-position: -440px -680px; }
-.emoji-partly_sunny { background-position: -460px -680px; }
-.emoji-passport_control { background-position: -480px -680px; }
-.emoji-pause_button { background-position: -500px -680px; }
-.emoji-peace { background-position: -520px -680px; }
-.emoji-peach { background-position: -540px -680px; }
-.emoji-peanuts { background-position: -560px -680px; }
-.emoji-pear { background-position: -580px -680px; }
-.emoji-pen_ballpoint { background-position: -600px -680px; }
-.emoji-pen_fountain { background-position: -620px -680px; }
-.emoji-pencil { background-position: -640px -680px; }
-.emoji-pencil2 { background-position: -660px -680px; }
-.emoji-penguin { background-position: -680px -680px; }
-.emoji-pensive { background-position: -700px 0; }
-.emoji-performing_arts { background-position: -700px -20px; }
-.emoji-persevere { background-position: -700px -40px; }
-.emoji-person_frowning { background-position: -700px -60px; }
-.emoji-person_frowning_tone1 { background-position: -700px -80px; }
-.emoji-person_frowning_tone2 { background-position: -700px -100px; }
-.emoji-person_frowning_tone3 { background-position: -700px -120px; }
-.emoji-person_frowning_tone4 { background-position: -700px -140px; }
-.emoji-person_frowning_tone5 { background-position: -700px -160px; }
-.emoji-person_with_blond_hair { background-position: -700px -180px; }
-.emoji-person_with_blond_hair_tone1 { background-position: -700px -200px; }
-.emoji-person_with_blond_hair_tone2 { background-position: -700px -220px; }
-.emoji-person_with_blond_hair_tone3 { background-position: -700px -240px; }
-.emoji-person_with_blond_hair_tone4 { background-position: -700px -260px; }
-.emoji-person_with_blond_hair_tone5 { background-position: -700px -280px; }
-.emoji-person_with_pouting_face { background-position: -700px -300px; }
-.emoji-person_with_pouting_face_tone1 { background-position: -700px -320px; }
-.emoji-person_with_pouting_face_tone2 { background-position: -700px -340px; }
-.emoji-person_with_pouting_face_tone3 { background-position: -700px -360px; }
-.emoji-person_with_pouting_face_tone4 { background-position: -700px -380px; }
-.emoji-person_with_pouting_face_tone5 { background-position: -700px -400px; }
-.emoji-pick { background-position: -700px -420px; }
-.emoji-pig { background-position: -700px -440px; }
-.emoji-pig2 { background-position: -700px -460px; }
-.emoji-pig_nose { background-position: -700px -480px; }
-.emoji-pill { background-position: -700px -500px; }
-.emoji-pineapple { background-position: -700px -520px; }
-.emoji-ping_pong { background-position: -700px -540px; }
-.emoji-pisces { background-position: -700px -560px; }
-.emoji-pizza { background-position: -700px -580px; }
-.emoji-place_of_worship { background-position: -700px -600px; }
-.emoji-play_pause { background-position: -700px -620px; }
-.emoji-point_down { background-position: -700px -640px; }
-.emoji-point_down_tone1 { background-position: -700px -660px; }
-.emoji-point_down_tone2 { background-position: -700px -680px; }
-.emoji-point_down_tone3 { background-position: 0 -700px; }
-.emoji-point_down_tone4 { background-position: -20px -700px; }
-.emoji-point_down_tone5 { background-position: -40px -700px; }
-.emoji-point_left { background-position: -60px -700px; }
-.emoji-point_left_tone1 { background-position: -80px -700px; }
-.emoji-point_left_tone2 { background-position: -100px -700px; }
-.emoji-point_left_tone3 { background-position: -120px -700px; }
-.emoji-point_left_tone4 { background-position: -140px -700px; }
-.emoji-point_left_tone5 { background-position: -160px -700px; }
-.emoji-point_right { background-position: -180px -700px; }
-.emoji-point_right_tone1 { background-position: -200px -700px; }
-.emoji-point_right_tone2 { background-position: -220px -700px; }
-.emoji-point_right_tone3 { background-position: -240px -700px; }
-.emoji-point_right_tone4 { background-position: -260px -700px; }
-.emoji-point_right_tone5 { background-position: -280px -700px; }
-.emoji-point_up { background-position: -300px -700px; }
-.emoji-point_up_2 { background-position: -320px -700px; }
-.emoji-point_up_2_tone1 { background-position: -340px -700px; }
-.emoji-point_up_2_tone2 { background-position: -360px -700px; }
-.emoji-point_up_2_tone3 { background-position: -380px -700px; }
-.emoji-point_up_2_tone4 { background-position: -400px -700px; }
-.emoji-point_up_2_tone5 { background-position: -420px -700px; }
-.emoji-point_up_tone1 { background-position: -440px -700px; }
-.emoji-point_up_tone2 { background-position: -460px -700px; }
-.emoji-point_up_tone3 { background-position: -480px -700px; }
-.emoji-point_up_tone4 { background-position: -500px -700px; }
-.emoji-point_up_tone5 { background-position: -520px -700px; }
-.emoji-police_car { background-position: -540px -700px; }
-.emoji-poodle { background-position: -560px -700px; }
-.emoji-poop { background-position: -580px -700px; }
-.emoji-popcorn { background-position: -600px -700px; }
-.emoji-post_office { background-position: -620px -700px; }
-.emoji-postal_horn { background-position: -640px -700px; }
-.emoji-postbox { background-position: -660px -700px; }
-.emoji-potable_water { background-position: -680px -700px; }
-.emoji-potato { background-position: -700px -700px; }
-.emoji-pouch { background-position: -720px 0; }
-.emoji-poultry_leg { background-position: -720px -20px; }
-.emoji-pound { background-position: -720px -40px; }
-.emoji-pouting_cat { background-position: -720px -60px; }
-.emoji-pray { background-position: -720px -80px; }
-.emoji-pray_tone1 { background-position: -720px -100px; }
-.emoji-pray_tone2 { background-position: -720px -120px; }
-.emoji-pray_tone3 { background-position: -720px -140px; }
-.emoji-pray_tone4 { background-position: -720px -160px; }
-.emoji-pray_tone5 { background-position: -720px -180px; }
-.emoji-prayer_beads { background-position: -720px -200px; }
-.emoji-pregnant_woman { background-position: -720px -220px; }
-.emoji-pregnant_woman_tone1 { background-position: -720px -240px; }
-.emoji-pregnant_woman_tone2 { background-position: -720px -260px; }
-.emoji-pregnant_woman_tone3 { background-position: -720px -280px; }
-.emoji-pregnant_woman_tone4 { background-position: -720px -300px; }
-.emoji-pregnant_woman_tone5 { background-position: -720px -320px; }
-.emoji-prince { background-position: -720px -340px; }
-.emoji-prince_tone1 { background-position: -720px -360px; }
-.emoji-prince_tone2 { background-position: -720px -380px; }
-.emoji-prince_tone3 { background-position: -720px -400px; }
-.emoji-prince_tone4 { background-position: -720px -420px; }
-.emoji-prince_tone5 { background-position: -720px -440px; }
-.emoji-princess { background-position: -720px -460px; }
-.emoji-princess_tone1 { background-position: -720px -480px; }
-.emoji-princess_tone2 { background-position: -720px -500px; }
-.emoji-princess_tone3 { background-position: -720px -520px; }
-.emoji-princess_tone4 { background-position: -720px -540px; }
-.emoji-princess_tone5 { background-position: -720px -560px; }
-.emoji-printer { background-position: -720px -580px; }
-.emoji-projector { background-position: -720px -600px; }
-.emoji-punch { background-position: -720px -620px; }
-.emoji-punch_tone1 { background-position: -720px -640px; }
-.emoji-punch_tone2 { background-position: -720px -660px; }
-.emoji-punch_tone3 { background-position: -720px -680px; }
-.emoji-punch_tone4 { background-position: -720px -700px; }
-.emoji-punch_tone5 { background-position: 0 -720px; }
-.emoji-purple_heart { background-position: -20px -720px; }
-.emoji-purse { background-position: -40px -720px; }
-.emoji-pushpin { background-position: -60px -720px; }
-.emoji-put_litter_in_its_place { background-position: -80px -720px; }
-.emoji-question { background-position: -100px -720px; }
-.emoji-rabbit { background-position: -120px -720px; }
-.emoji-rabbit2 { background-position: -140px -720px; }
-.emoji-race_car { background-position: -160px -720px; }
-.emoji-racehorse { background-position: -180px -720px; }
-.emoji-radio { background-position: -200px -720px; }
-.emoji-radio_button { background-position: -220px -720px; }
-.emoji-radioactive { background-position: -240px -720px; }
-.emoji-rage { background-position: -260px -720px; }
-.emoji-railway_car { background-position: -280px -720px; }
-.emoji-railway_track { background-position: -300px -720px; }
-.emoji-rainbow { background-position: -320px -720px; }
-.emoji-raised_back_of_hand { background-position: -340px -720px; }
-.emoji-raised_back_of_hand_tone1 { background-position: -360px -720px; }
-.emoji-raised_back_of_hand_tone2 { background-position: -380px -720px; }
-.emoji-raised_back_of_hand_tone3 { background-position: -400px -720px; }
-.emoji-raised_back_of_hand_tone4 { background-position: -420px -720px; }
-.emoji-raised_back_of_hand_tone5 { background-position: -440px -720px; }
-.emoji-raised_hand { background-position: -460px -720px; }
-.emoji-raised_hand_tone1 { background-position: -480px -720px; }
-.emoji-raised_hand_tone2 { background-position: -500px -720px; }
-.emoji-raised_hand_tone3 { background-position: -520px -720px; }
-.emoji-raised_hand_tone4 { background-position: -540px -720px; }
-.emoji-raised_hand_tone5 { background-position: -560px -720px; }
-.emoji-raised_hands { background-position: -580px -720px; }
-.emoji-raised_hands_tone1 { background-position: -600px -720px; }
-.emoji-raised_hands_tone2 { background-position: -620px -720px; }
-.emoji-raised_hands_tone3 { background-position: -640px -720px; }
-.emoji-raised_hands_tone4 { background-position: -660px -720px; }
-.emoji-raised_hands_tone5 { background-position: -680px -720px; }
-.emoji-raising_hand { background-position: -700px -720px; }
-.emoji-raising_hand_tone1 { background-position: -720px -720px; }
-.emoji-raising_hand_tone2 { background-position: -740px 0; }
-.emoji-raising_hand_tone3 { background-position: -740px -20px; }
-.emoji-raising_hand_tone4 { background-position: -740px -40px; }
-.emoji-raising_hand_tone5 { background-position: -740px -60px; }
-.emoji-ram { background-position: -740px -80px; }
-.emoji-ramen { background-position: -740px -100px; }
-.emoji-rat { background-position: -740px -120px; }
-.emoji-record_button { background-position: -740px -140px; }
-.emoji-recycle { background-position: -740px -160px; }
-.emoji-red_car { background-position: -740px -180px; }
-.emoji-red_circle { background-position: -740px -200px; }
-.emoji-registered { background-position: -740px -220px; }
-.emoji-relaxed { background-position: -740px -240px; }
-.emoji-relieved { background-position: -740px -260px; }
-.emoji-reminder_ribbon { background-position: -740px -280px; }
-.emoji-repeat { background-position: -740px -300px; }
-.emoji-repeat_one { background-position: -740px -320px; }
-.emoji-restroom { background-position: -740px -340px; }
-.emoji-revolving_hearts { background-position: -740px -360px; }
-.emoji-rewind { background-position: -740px -380px; }
-.emoji-rhino { background-position: -740px -400px; }
-.emoji-ribbon { background-position: -740px -420px; }
-.emoji-rice { background-position: -740px -440px; }
-.emoji-rice_ball { background-position: -740px -460px; }
-.emoji-rice_cracker { background-position: -740px -480px; }
-.emoji-rice_scene { background-position: -740px -500px; }
-.emoji-right_facing_fist { background-position: -740px -520px; }
-.emoji-right_facing_fist_tone1 { background-position: -740px -540px; }
-.emoji-right_facing_fist_tone2 { background-position: -740px -560px; }
-.emoji-right_facing_fist_tone3 { background-position: -740px -580px; }
-.emoji-right_facing_fist_tone4 { background-position: -740px -600px; }
-.emoji-right_facing_fist_tone5 { background-position: -740px -620px; }
-.emoji-ring { background-position: -740px -640px; }
-.emoji-robot { background-position: -740px -660px; }
-.emoji-rocket { background-position: -740px -680px; }
-.emoji-rofl { background-position: -740px -700px; }
-.emoji-roller_coaster { background-position: -740px -720px; }
-.emoji-rolling_eyes { background-position: 0 -740px; }
-.emoji-rooster { background-position: -20px -740px; }
-.emoji-rose { background-position: -40px -740px; }
-.emoji-rosette { background-position: -60px -740px; }
-.emoji-rotating_light { background-position: -80px -740px; }
-.emoji-round_pushpin { background-position: -100px -740px; }
-.emoji-rowboat { background-position: -120px -740px; }
-.emoji-rowboat_tone1 { background-position: -140px -740px; }
-.emoji-rowboat_tone2 { background-position: -160px -740px; }
-.emoji-rowboat_tone3 { background-position: -180px -740px; }
-.emoji-rowboat_tone4 { background-position: -200px -740px; }
-.emoji-rowboat_tone5 { background-position: -220px -740px; }
-.emoji-rugby_football { background-position: -240px -740px; }
-.emoji-runner { background-position: -260px -740px; }
-.emoji-runner_tone1 { background-position: -280px -740px; }
-.emoji-runner_tone2 { background-position: -300px -740px; }
-.emoji-runner_tone3 { background-position: -320px -740px; }
-.emoji-runner_tone4 { background-position: -340px -740px; }
-.emoji-runner_tone5 { background-position: -360px -740px; }
-.emoji-running_shirt_with_sash { background-position: -380px -740px; }
-.emoji-sa { background-position: -400px -740px; }
-.emoji-sagittarius { background-position: -420px -740px; }
-.emoji-sailboat { background-position: -440px -740px; }
-.emoji-sake { background-position: -460px -740px; }
-.emoji-salad { background-position: -480px -740px; }
-.emoji-sandal { background-position: -500px -740px; }
-.emoji-santa { background-position: -520px -740px; }
-.emoji-santa_tone1 { background-position: -540px -740px; }
-.emoji-santa_tone2 { background-position: -560px -740px; }
-.emoji-santa_tone3 { background-position: -580px -740px; }
-.emoji-santa_tone4 { background-position: -600px -740px; }
-.emoji-santa_tone5 { background-position: -620px -740px; }
-.emoji-satellite { background-position: -640px -740px; }
-.emoji-satellite_orbital { background-position: -660px -740px; }
-.emoji-saxophone { background-position: -680px -740px; }
-.emoji-scales { background-position: -700px -740px; }
-.emoji-school { background-position: -720px -740px; }
-.emoji-school_satchel { background-position: -740px -740px; }
-.emoji-scissors { background-position: -760px 0; }
-.emoji-scooter { background-position: -760px -20px; }
-.emoji-scorpion { background-position: -760px -40px; }
-.emoji-scorpius { background-position: -760px -60px; }
-.emoji-scream { background-position: -760px -80px; }
-.emoji-scream_cat { background-position: -760px -100px; }
-.emoji-scroll { background-position: -760px -120px; }
-.emoji-seat { background-position: -760px -140px; }
-.emoji-second_place { background-position: -760px -160px; }
-.emoji-secret { background-position: -760px -180px; }
-.emoji-see_no_evil { background-position: -760px -200px; }
-.emoji-seedling { background-position: -760px -220px; }
-.emoji-selfie { background-position: -760px -240px; }
-.emoji-selfie_tone1 { background-position: -760px -260px; }
-.emoji-selfie_tone2 { background-position: -760px -280px; }
-.emoji-selfie_tone3 { background-position: -760px -300px; }
-.emoji-selfie_tone4 { background-position: -760px -320px; }
-.emoji-selfie_tone5 { background-position: -760px -340px; }
-.emoji-seven { background-position: -760px -360px; }
-.emoji-shallow_pan_of_food { background-position: -760px -380px; }
-.emoji-shamrock { background-position: -760px -400px; }
-.emoji-shark { background-position: -760px -420px; }
-.emoji-shaved_ice { background-position: -760px -440px; }
-.emoji-sheep { background-position: -760px -460px; }
-.emoji-shell { background-position: -760px -480px; }
-.emoji-shield { background-position: -760px -500px; }
-.emoji-shinto_shrine { background-position: -760px -520px; }
-.emoji-ship { background-position: -760px -540px; }
-.emoji-shirt { background-position: -760px -560px; }
-.emoji-shopping_bags { background-position: -760px -580px; }
-.emoji-shopping_cart { background-position: -760px -600px; }
-.emoji-shower { background-position: -760px -620px; }
-.emoji-shrimp { background-position: -760px -640px; }
-.emoji-shrug { background-position: -760px -660px; }
-.emoji-shrug_tone1 { background-position: -760px -680px; }
-.emoji-shrug_tone2 { background-position: -760px -700px; }
-.emoji-shrug_tone3 { background-position: -760px -720px; }
-.emoji-shrug_tone4 { background-position: -760px -740px; }
-.emoji-shrug_tone5 { background-position: 0 -760px; }
-.emoji-signal_strength { background-position: -20px -760px; }
-.emoji-six { background-position: -40px -760px; }
-.emoji-six_pointed_star { background-position: -60px -760px; }
-.emoji-ski { background-position: -80px -760px; }
-.emoji-skier { background-position: -100px -760px; }
-.emoji-skull { background-position: -120px -760px; }
-.emoji-skull_crossbones { background-position: -140px -760px; }
-.emoji-sleeping { background-position: -160px -760px; }
-.emoji-sleeping_accommodation { background-position: -180px -760px; }
-.emoji-sleepy { background-position: -200px -760px; }
-.emoji-slight_frown { background-position: -220px -760px; }
-.emoji-slight_smile { background-position: -240px -760px; }
-.emoji-slot_machine { background-position: -260px -760px; }
-.emoji-small_blue_diamond { background-position: -280px -760px; }
-.emoji-small_orange_diamond { background-position: -300px -760px; }
-.emoji-small_red_triangle { background-position: -320px -760px; }
-.emoji-small_red_triangle_down { background-position: -340px -760px; }
-.emoji-smile { background-position: -360px -760px; }
-.emoji-smile_cat { background-position: -380px -760px; }
-.emoji-smiley { background-position: -400px -760px; }
-.emoji-smiley_cat { background-position: -420px -760px; }
-.emoji-smiling_imp { background-position: -440px -760px; }
-.emoji-smirk { background-position: -460px -760px; }
-.emoji-smirk_cat { background-position: -480px -760px; }
-.emoji-smoking { background-position: -500px -760px; }
-.emoji-snail { background-position: -520px -760px; }
-.emoji-snake { background-position: -540px -760px; }
-.emoji-sneezing_face { background-position: -560px -760px; }
-.emoji-snowboarder { background-position: -580px -760px; }
-.emoji-snowflake { background-position: -600px -760px; }
-.emoji-snowman { background-position: -620px -760px; }
-.emoji-snowman2 { background-position: -640px -760px; }
-.emoji-sob { background-position: -660px -760px; }
-.emoji-soccer { background-position: -680px -760px; }
-.emoji-soon { background-position: -700px -760px; }
-.emoji-sos { background-position: -720px -760px; }
-.emoji-sound { background-position: -740px -760px; }
-.emoji-space_invader { background-position: -760px -760px; }
-.emoji-spades { background-position: -780px 0; }
-.emoji-spaghetti { background-position: -780px -20px; }
-.emoji-sparkle { background-position: -780px -40px; }
-.emoji-sparkler { background-position: -780px -60px; }
-.emoji-sparkles { background-position: -780px -80px; }
-.emoji-sparkling_heart { background-position: -780px -100px; }
-.emoji-speak_no_evil { background-position: -780px -120px; }
-.emoji-speaker { background-position: -780px -140px; }
-.emoji-speaking_head { background-position: -780px -160px; }
-.emoji-speech_balloon { background-position: -780px -180px; }
-.emoji-speedboat { background-position: -780px -200px; }
-.emoji-spider { background-position: -780px -220px; }
-.emoji-spider_web { background-position: -780px -240px; }
-.emoji-spoon { background-position: -780px -260px; }
-.emoji-spy { background-position: -780px -280px; }
-.emoji-spy_tone1 { background-position: -780px -300px; }
-.emoji-spy_tone2 { background-position: -780px -320px; }
-.emoji-spy_tone3 { background-position: -780px -340px; }
-.emoji-spy_tone4 { background-position: -780px -360px; }
-.emoji-spy_tone5 { background-position: -780px -380px; }
-.emoji-squid { background-position: -780px -400px; }
-.emoji-stadium { background-position: -780px -420px; }
-.emoji-star { background-position: -780px -440px; }
-.emoji-star2 { background-position: -780px -460px; }
-.emoji-star_and_crescent { background-position: -780px -480px; }
-.emoji-star_of_david { background-position: -780px -500px; }
-.emoji-stars { background-position: -780px -520px; }
-.emoji-station { background-position: -780px -540px; }
-.emoji-statue_of_liberty { background-position: -780px -560px; }
-.emoji-steam_locomotive { background-position: -780px -580px; }
-.emoji-stew { background-position: -780px -600px; }
-.emoji-stop_button { background-position: -780px -620px; }
-.emoji-stopwatch { background-position: -780px -640px; }
-.emoji-straight_ruler { background-position: -780px -660px; }
-.emoji-strawberry { background-position: -780px -680px; }
-.emoji-stuck_out_tongue { background-position: -780px -700px; }
-.emoji-stuck_out_tongue_closed_eyes { background-position: -780px -720px; }
-.emoji-stuck_out_tongue_winking_eye { background-position: -780px -740px; }
-.emoji-stuffed_flatbread { background-position: -780px -760px; }
-.emoji-sun_with_face { background-position: 0 -780px; }
-.emoji-sunflower { background-position: -20px -780px; }
-.emoji-sunglasses { background-position: -40px -780px; }
-.emoji-sunny { background-position: -60px -780px; }
-.emoji-sunrise { background-position: -80px -780px; }
-.emoji-sunrise_over_mountains { background-position: -100px -780px; }
-.emoji-surfer { background-position: -120px -780px; }
-.emoji-surfer_tone1 { background-position: -140px -780px; }
-.emoji-surfer_tone2 { background-position: -160px -780px; }
-.emoji-surfer_tone3 { background-position: -180px -780px; }
-.emoji-surfer_tone4 { background-position: -200px -780px; }
-.emoji-surfer_tone5 { background-position: -220px -780px; }
-.emoji-sushi { background-position: -240px -780px; }
-.emoji-suspension_railway { background-position: -260px -780px; }
-.emoji-sweat { background-position: -280px -780px; }
-.emoji-sweat_drops { background-position: -300px -780px; }
-.emoji-sweat_smile { background-position: -320px -780px; }
-.emoji-sweet_potato { background-position: -340px -780px; }
-.emoji-swimmer { background-position: -360px -780px; }
-.emoji-swimmer_tone1 { background-position: -380px -780px; }
-.emoji-swimmer_tone2 { background-position: -400px -780px; }
-.emoji-swimmer_tone3 { background-position: -420px -780px; }
-.emoji-swimmer_tone4 { background-position: -440px -780px; }
-.emoji-swimmer_tone5 { background-position: -460px -780px; }
-.emoji-symbols { background-position: -480px -780px; }
-.emoji-synagogue { background-position: -500px -780px; }
-.emoji-syringe { background-position: -520px -780px; }
-.emoji-taco { background-position: -540px -780px; }
-.emoji-tada { background-position: -560px -780px; }
-.emoji-tanabata_tree { background-position: -580px -780px; }
-.emoji-tangerine { background-position: -600px -780px; }
-.emoji-taurus { background-position: -620px -780px; }
-.emoji-taxi { background-position: -640px -780px; }
-.emoji-tea { background-position: -660px -780px; }
-.emoji-telephone { background-position: -680px -780px; }
-.emoji-telephone_receiver { background-position: -700px -780px; }
-.emoji-telescope { background-position: -720px -780px; }
-.emoji-ten { background-position: -740px -780px; }
-.emoji-tennis { background-position: -760px -780px; }
-.emoji-tent { background-position: -780px -780px; }
-.emoji-thermometer { background-position: -800px 0; }
-.emoji-thermometer_face { background-position: -800px -20px; }
-.emoji-thinking { background-position: -800px -40px; }
-.emoji-third_place { background-position: -800px -60px; }
-.emoji-thought_balloon { background-position: -800px -80px; }
-.emoji-three { background-position: -800px -100px; }
-.emoji-thumbsdown { background-position: -800px -120px; }
-.emoji-thumbsdown_tone1 { background-position: -800px -140px; }
-.emoji-thumbsdown_tone2 { background-position: -800px -160px; }
-.emoji-thumbsdown_tone3 { background-position: -800px -180px; }
-.emoji-thumbsdown_tone4 { background-position: -800px -200px; }
-.emoji-thumbsdown_tone5 { background-position: -800px -220px; }
-.emoji-thumbsup { background-position: -800px -240px; }
-.emoji-thumbsup_tone1 { background-position: -800px -260px; }
-.emoji-thumbsup_tone2 { background-position: -800px -280px; }
-.emoji-thumbsup_tone3 { background-position: -800px -300px; }
-.emoji-thumbsup_tone4 { background-position: -800px -320px; }
-.emoji-thumbsup_tone5 { background-position: -800px -340px; }
-.emoji-thunder_cloud_rain { background-position: -800px -360px; }
-.emoji-ticket { background-position: -800px -380px; }
-.emoji-tickets { background-position: -800px -400px; }
-.emoji-tiger { background-position: -800px -420px; }
-.emoji-tiger2 { background-position: -800px -440px; }
-.emoji-timer { background-position: -800px -460px; }
-.emoji-tired_face { background-position: -800px -480px; }
-.emoji-tm { background-position: -800px -500px; }
-.emoji-toilet { background-position: -800px -520px; }
-.emoji-tokyo_tower { background-position: -800px -540px; }
-.emoji-tomato { background-position: -800px -560px; }
-.emoji-tone1 { background-position: -800px -580px; }
-.emoji-tone2 { background-position: -800px -600px; }
-.emoji-tone3 { background-position: -800px -620px; }
-.emoji-tone4 { background-position: -800px -640px; }
-.emoji-tone5 { background-position: -800px -660px; }
-.emoji-tongue { background-position: -800px -680px; }
-.emoji-tools { background-position: -800px -700px; }
-.emoji-top { background-position: -800px -720px; }
-.emoji-tophat { background-position: -800px -740px; }
-.emoji-track_next { background-position: -800px -760px; }
-.emoji-track_previous { background-position: -800px -780px; }
-.emoji-trackball { background-position: 0 -800px; }
-.emoji-tractor { background-position: -20px -800px; }
-.emoji-traffic_light { background-position: -40px -800px; }
-.emoji-train { background-position: -60px -800px; }
-.emoji-train2 { background-position: -80px -800px; }
-.emoji-tram { background-position: -100px -800px; }
-.emoji-triangular_flag_on_post { background-position: -120px -800px; }
-.emoji-triangular_ruler { background-position: -140px -800px; }
-.emoji-trident { background-position: -160px -800px; }
-.emoji-triumph { background-position: -180px -800px; }
-.emoji-trolleybus { background-position: -200px -800px; }
-.emoji-trophy { background-position: -220px -800px; }
-.emoji-tropical_drink { background-position: -240px -800px; }
-.emoji-tropical_fish { background-position: -260px -800px; }
-.emoji-truck { background-position: -280px -800px; }
-.emoji-trumpet { background-position: -300px -800px; }
-.emoji-tulip { background-position: -320px -800px; }
-.emoji-tumbler_glass { background-position: -340px -800px; }
-.emoji-turkey { background-position: -360px -800px; }
-.emoji-turtle { background-position: -380px -800px; }
-.emoji-tv { background-position: -400px -800px; }
-.emoji-twisted_rightwards_arrows { background-position: -420px -800px; }
-.emoji-two { background-position: -440px -800px; }
-.emoji-two_hearts { background-position: -460px -800px; }
-.emoji-two_men_holding_hands { background-position: -480px -800px; }
-.emoji-two_women_holding_hands { background-position: -500px -800px; }
-.emoji-u5272 { background-position: -520px -800px; }
-.emoji-u5408 { background-position: -540px -800px; }
-.emoji-u55b6 { background-position: -560px -800px; }
-.emoji-u6307 { background-position: -580px -800px; }
-.emoji-u6708 { background-position: -600px -800px; }
-.emoji-u6709 { background-position: -620px -800px; }
-.emoji-u6e80 { background-position: -640px -800px; }
-.emoji-u7121 { background-position: -660px -800px; }
-.emoji-u7533 { background-position: -680px -800px; }
-.emoji-u7981 { background-position: -700px -800px; }
-.emoji-u7a7a { background-position: -720px -800px; }
-.emoji-umbrella { background-position: -740px -800px; }
-.emoji-umbrella2 { background-position: -760px -800px; }
-.emoji-unamused { background-position: -780px -800px; }
-.emoji-underage { background-position: -800px -800px; }
-.emoji-unicorn { background-position: -820px 0; }
-.emoji-unlock { background-position: -820px -20px; }
-.emoji-up { background-position: -820px -40px; }
-.emoji-upside_down { background-position: -820px -60px; }
-.emoji-urn { background-position: -820px -80px; }
-.emoji-v { background-position: -820px -100px; }
-.emoji-v_tone1 { background-position: -820px -120px; }
-.emoji-v_tone2 { background-position: -820px -140px; }
-.emoji-v_tone3 { background-position: -820px -160px; }
-.emoji-v_tone4 { background-position: -820px -180px; }
-.emoji-v_tone5 { background-position: -820px -200px; }
-.emoji-vertical_traffic_light { background-position: -820px -220px; }
-.emoji-vhs { background-position: -820px -240px; }
-.emoji-vibration_mode { background-position: -820px -260px; }
-.emoji-video_camera { background-position: -820px -280px; }
-.emoji-video_game { background-position: -820px -300px; }
-.emoji-violin { background-position: -820px -320px; }
-.emoji-virgo { background-position: -820px -340px; }
-.emoji-volcano { background-position: -820px -360px; }
-.emoji-volleyball { background-position: -820px -380px; }
-.emoji-vs { background-position: -820px -400px; }
-.emoji-vulcan { background-position: -820px -420px; }
-.emoji-vulcan_tone1 { background-position: -820px -440px; }
-.emoji-vulcan_tone2 { background-position: -820px -460px; }
-.emoji-vulcan_tone3 { background-position: -820px -480px; }
-.emoji-vulcan_tone4 { background-position: -820px -500px; }
-.emoji-vulcan_tone5 { background-position: -820px -520px; }
-.emoji-walking { background-position: -820px -540px; }
-.emoji-walking_tone1 { background-position: -820px -560px; }
-.emoji-walking_tone2 { background-position: -820px -580px; }
-.emoji-walking_tone3 { background-position: -820px -600px; }
-.emoji-walking_tone4 { background-position: -820px -620px; }
-.emoji-walking_tone5 { background-position: -820px -640px; }
-.emoji-waning_crescent_moon { background-position: -820px -660px; }
-.emoji-waning_gibbous_moon { background-position: -820px -680px; }
-.emoji-warning { background-position: -820px -700px; }
-.emoji-wastebasket { background-position: -820px -720px; }
-.emoji-watch { background-position: -820px -740px; }
-.emoji-water_buffalo { background-position: -820px -760px; }
-.emoji-water_polo { background-position: -820px -780px; }
-.emoji-water_polo_tone1 { background-position: -820px -800px; }
-.emoji-water_polo_tone2 { background-position: 0 -820px; }
-.emoji-water_polo_tone3 { background-position: -20px -820px; }
-.emoji-water_polo_tone4 { background-position: -40px -820px; }
-.emoji-water_polo_tone5 { background-position: -60px -820px; }
-.emoji-watermelon { background-position: -80px -820px; }
-.emoji-wave { background-position: -100px -820px; }
-.emoji-wave_tone1 { background-position: -120px -820px; }
-.emoji-wave_tone2 { background-position: -140px -820px; }
-.emoji-wave_tone3 { background-position: -160px -820px; }
-.emoji-wave_tone4 { background-position: -180px -820px; }
-.emoji-wave_tone5 { background-position: -200px -820px; }
-.emoji-wavy_dash { background-position: -220px -820px; }
-.emoji-waxing_crescent_moon { background-position: -240px -820px; }
-.emoji-waxing_gibbous_moon { background-position: -260px -820px; }
-.emoji-wc { background-position: -280px -820px; }
-.emoji-weary { background-position: -300px -820px; }
-.emoji-wedding { background-position: -320px -820px; }
-.emoji-whale { background-position: -340px -820px; }
-.emoji-whale2 { background-position: -360px -820px; }
-.emoji-wheel_of_dharma { background-position: -380px -820px; }
-.emoji-wheelchair { background-position: -400px -820px; }
-.emoji-white_check_mark { background-position: -420px -820px; }
-.emoji-white_circle { background-position: -440px -820px; }
-.emoji-white_flower { background-position: -460px -820px; }
-.emoji-white_large_square { background-position: -480px -820px; }
-.emoji-white_medium_small_square { background-position: -500px -820px; }
-.emoji-white_medium_square { background-position: -520px -820px; }
-.emoji-white_small_square { background-position: -540px -820px; }
-.emoji-white_square_button { background-position: -560px -820px; }
-.emoji-white_sun_cloud { background-position: -580px -820px; }
-.emoji-white_sun_rain_cloud { background-position: -600px -820px; }
-.emoji-white_sun_small_cloud { background-position: -620px -820px; }
-.emoji-wilted_rose { background-position: -640px -820px; }
-.emoji-wind_blowing_face { background-position: -660px -820px; }
-.emoji-wind_chime { background-position: -680px -820px; }
-.emoji-wine_glass { background-position: -700px -820px; }
-.emoji-wink { background-position: -720px -820px; }
-.emoji-wolf { background-position: -740px -820px; }
-.emoji-woman { background-position: -760px -820px; }
-.emoji-woman_tone1 { background-position: -780px -820px; }
-.emoji-woman_tone2 { background-position: -800px -820px; }
-.emoji-woman_tone3 { background-position: -820px -820px; }
-.emoji-woman_tone4 { background-position: -840px 0; }
-.emoji-woman_tone5 { background-position: -840px -20px; }
-.emoji-womans_clothes { background-position: -840px -40px; }
-.emoji-womans_hat { background-position: -840px -60px; }
-.emoji-womens { background-position: -840px -80px; }
-.emoji-worried { background-position: -840px -100px; }
-.emoji-wrench { background-position: -840px -120px; }
-.emoji-wrestlers { background-position: -840px -140px; }
-.emoji-wrestlers_tone1 { background-position: -840px -160px; }
-.emoji-wrestlers_tone2 { background-position: -840px -180px; }
-.emoji-wrestlers_tone3 { background-position: -840px -200px; }
-.emoji-wrestlers_tone4 { background-position: -840px -220px; }
-.emoji-wrestlers_tone5 { background-position: -840px -240px; }
-.emoji-writing_hand { background-position: -840px -260px; }
-.emoji-writing_hand_tone1 { background-position: -840px -280px; }
-.emoji-writing_hand_tone2 { background-position: -840px -300px; }
-.emoji-writing_hand_tone3 { background-position: -840px -320px; }
-.emoji-writing_hand_tone4 { background-position: -840px -340px; }
-.emoji-writing_hand_tone5 { background-position: -840px -360px; }
-.emoji-x { background-position: -840px -380px; }
-.emoji-yellow_heart { background-position: -840px -400px; }
-.emoji-yen { background-position: -840px -420px; }
-.emoji-yin_yang { background-position: -840px -440px; }
-.emoji-yum { background-position: -840px -460px; }
-.emoji-zap { background-position: -840px -480px; }
-.emoji-zero { background-position: -840px -500px; }
-.emoji-zipper_mouth { background-position: -840px -520px; }
-.emoji-100 { background-position: -840px -540px; }
+.emoji-gay_pride_flag { background-position: -220px -540px; }
+.emoji-gear { background-position: -240px -540px; }
+.emoji-gem { background-position: -260px -540px; }
+.emoji-gemini { background-position: -280px -540px; }
+.emoji-ghost { background-position: -300px -540px; }
+.emoji-gift { background-position: -320px -540px; }
+.emoji-gift_heart { background-position: -340px -540px; }
+.emoji-girl { background-position: -360px -540px; }
+.emoji-girl_tone1 { background-position: -380px -540px; }
+.emoji-girl_tone2 { background-position: -400px -540px; }
+.emoji-girl_tone3 { background-position: -420px -540px; }
+.emoji-girl_tone4 { background-position: -440px -540px; }
+.emoji-girl_tone5 { background-position: -460px -540px; }
+.emoji-globe_with_meridians { background-position: -480px -540px; }
+.emoji-goal { background-position: -500px -540px; }
+.emoji-goat { background-position: -520px -540px; }
+.emoji-golf { background-position: -540px -540px; }
+.emoji-golfer { background-position: -560px 0; }
+.emoji-gorilla { background-position: -560px -20px; }
+.emoji-grapes { background-position: -560px -40px; }
+.emoji-green_apple { background-position: -560px -60px; }
+.emoji-green_book { background-position: -560px -80px; }
+.emoji-green_heart { background-position: -560px -100px; }
+.emoji-grey_exclamation { background-position: -560px -120px; }
+.emoji-grey_question { background-position: -560px -140px; }
+.emoji-grimacing { background-position: -560px -160px; }
+.emoji-grin { background-position: -560px -180px; }
+.emoji-grinning { background-position: -560px -200px; }
+.emoji-guardsman { background-position: -560px -220px; }
+.emoji-guardsman_tone1 { background-position: -560px -240px; }
+.emoji-guardsman_tone2 { background-position: -560px -260px; }
+.emoji-guardsman_tone3 { background-position: -560px -280px; }
+.emoji-guardsman_tone4 { background-position: -560px -300px; }
+.emoji-guardsman_tone5 { background-position: -560px -320px; }
+.emoji-guitar { background-position: -560px -340px; }
+.emoji-gun { background-position: -560px -360px; }
+.emoji-haircut { background-position: -560px -380px; }
+.emoji-haircut_tone1 { background-position: -560px -400px; }
+.emoji-haircut_tone2 { background-position: -560px -420px; }
+.emoji-haircut_tone3 { background-position: -560px -440px; }
+.emoji-haircut_tone4 { background-position: -560px -460px; }
+.emoji-haircut_tone5 { background-position: -560px -480px; }
+.emoji-hamburger { background-position: -560px -500px; }
+.emoji-hammer { background-position: -560px -520px; }
+.emoji-hammer_pick { background-position: -560px -540px; }
+.emoji-hamster { background-position: 0 -560px; }
+.emoji-hand_splayed { background-position: -20px -560px; }
+.emoji-hand_splayed_tone1 { background-position: -40px -560px; }
+.emoji-hand_splayed_tone2 { background-position: -60px -560px; }
+.emoji-hand_splayed_tone3 { background-position: -80px -560px; }
+.emoji-hand_splayed_tone4 { background-position: -100px -560px; }
+.emoji-hand_splayed_tone5 { background-position: -120px -560px; }
+.emoji-handbag { background-position: -140px -560px; }
+.emoji-handball { background-position: -160px -560px; }
+.emoji-handball_tone1 { background-position: -180px -560px; }
+.emoji-handball_tone2 { background-position: -200px -560px; }
+.emoji-handball_tone3 { background-position: -220px -560px; }
+.emoji-handball_tone4 { background-position: -240px -560px; }
+.emoji-handball_tone5 { background-position: -260px -560px; }
+.emoji-handshake { background-position: -280px -560px; }
+.emoji-handshake_tone1 { background-position: -300px -560px; }
+.emoji-handshake_tone2 { background-position: -320px -560px; }
+.emoji-handshake_tone3 { background-position: -340px -560px; }
+.emoji-handshake_tone4 { background-position: -360px -560px; }
+.emoji-handshake_tone5 { background-position: -380px -560px; }
+.emoji-hash { background-position: -400px -560px; }
+.emoji-hatched_chick { background-position: -420px -560px; }
+.emoji-hatching_chick { background-position: -440px -560px; }
+.emoji-head_bandage { background-position: -460px -560px; }
+.emoji-headphones { background-position: -480px -560px; }
+.emoji-hear_no_evil { background-position: -500px -560px; }
+.emoji-heart { background-position: -520px -560px; }
+.emoji-heart_decoration { background-position: -540px -560px; }
+.emoji-heart_exclamation { background-position: -560px -560px; }
+.emoji-heart_eyes { background-position: -580px 0; }
+.emoji-heart_eyes_cat { background-position: -580px -20px; }
+.emoji-heartbeat { background-position: -580px -40px; }
+.emoji-heartpulse { background-position: -580px -60px; }
+.emoji-hearts { background-position: -580px -80px; }
+.emoji-heavy_check_mark { background-position: -580px -100px; }
+.emoji-heavy_division_sign { background-position: -580px -120px; }
+.emoji-heavy_dollar_sign { background-position: -580px -140px; }
+.emoji-heavy_minus_sign { background-position: -580px -160px; }
+.emoji-heavy_multiplication_x { background-position: -580px -180px; }
+.emoji-heavy_plus_sign { background-position: -580px -200px; }
+.emoji-helicopter { background-position: -580px -220px; }
+.emoji-helmet_with_cross { background-position: -580px -240px; }
+.emoji-herb { background-position: -580px -260px; }
+.emoji-hibiscus { background-position: -580px -280px; }
+.emoji-high_brightness { background-position: -580px -300px; }
+.emoji-high_heel { background-position: -580px -320px; }
+.emoji-hockey { background-position: -580px -340px; }
+.emoji-hole { background-position: -580px -360px; }
+.emoji-homes { background-position: -580px -380px; }
+.emoji-honey_pot { background-position: -580px -400px; }
+.emoji-horse { background-position: -580px -420px; }
+.emoji-horse_racing { background-position: -580px -440px; }
+.emoji-horse_racing_tone1 { background-position: -580px -460px; }
+.emoji-horse_racing_tone2 { background-position: -580px -480px; }
+.emoji-horse_racing_tone3 { background-position: -580px -500px; }
+.emoji-horse_racing_tone4 { background-position: -580px -520px; }
+.emoji-horse_racing_tone5 { background-position: -580px -540px; }
+.emoji-hospital { background-position: -580px -560px; }
+.emoji-hot_pepper { background-position: 0 -580px; }
+.emoji-hotdog { background-position: -20px -580px; }
+.emoji-hotel { background-position: -40px -580px; }
+.emoji-hotsprings { background-position: -60px -580px; }
+.emoji-hourglass { background-position: -80px -580px; }
+.emoji-hourglass_flowing_sand { background-position: -100px -580px; }
+.emoji-house { background-position: -120px -580px; }
+.emoji-house_abandoned { background-position: -140px -580px; }
+.emoji-house_with_garden { background-position: -160px -580px; }
+.emoji-hugging { background-position: -180px -580px; }
+.emoji-hushed { background-position: -200px -580px; }
+.emoji-ice_cream { background-position: -220px -580px; }
+.emoji-ice_skate { background-position: -240px -580px; }
+.emoji-icecream { background-position: -260px -580px; }
+.emoji-id { background-position: -280px -580px; }
+.emoji-ideograph_advantage { background-position: -300px -580px; }
+.emoji-imp { background-position: -320px -580px; }
+.emoji-inbox_tray { background-position: -340px -580px; }
+.emoji-incoming_envelope { background-position: -360px -580px; }
+.emoji-information_desk_person { background-position: -380px -580px; }
+.emoji-information_desk_person_tone1 { background-position: -400px -580px; }
+.emoji-information_desk_person_tone2 { background-position: -420px -580px; }
+.emoji-information_desk_person_tone3 { background-position: -440px -580px; }
+.emoji-information_desk_person_tone4 { background-position: -460px -580px; }
+.emoji-information_desk_person_tone5 { background-position: -480px -580px; }
+.emoji-information_source { background-position: -500px -580px; }
+.emoji-innocent { background-position: -520px -580px; }
+.emoji-interrobang { background-position: -540px -580px; }
+.emoji-iphone { background-position: -560px -580px; }
+.emoji-island { background-position: -580px -580px; }
+.emoji-izakaya_lantern { background-position: -600px 0; }
+.emoji-jack_o_lantern { background-position: -600px -20px; }
+.emoji-japan { background-position: -600px -40px; }
+.emoji-japanese_castle { background-position: -600px -60px; }
+.emoji-japanese_goblin { background-position: -600px -80px; }
+.emoji-japanese_ogre { background-position: -600px -100px; }
+.emoji-jeans { background-position: -600px -120px; }
+.emoji-joy { background-position: -600px -140px; }
+.emoji-joy_cat { background-position: -600px -160px; }
+.emoji-joystick { background-position: -600px -180px; }
+.emoji-juggling { background-position: -600px -200px; }
+.emoji-juggling_tone1 { background-position: -600px -220px; }
+.emoji-juggling_tone2 { background-position: -600px -240px; }
+.emoji-juggling_tone3 { background-position: -600px -260px; }
+.emoji-juggling_tone4 { background-position: -600px -280px; }
+.emoji-juggling_tone5 { background-position: -600px -300px; }
+.emoji-kaaba { background-position: -600px -320px; }
+.emoji-key { background-position: -600px -340px; }
+.emoji-key2 { background-position: -600px -360px; }
+.emoji-keyboard { background-position: -600px -380px; }
+.emoji-kimono { background-position: -600px -400px; }
+.emoji-kiss { background-position: -600px -420px; }
+.emoji-kiss_mm { background-position: -600px -440px; }
+.emoji-kiss_ww { background-position: -600px -460px; }
+.emoji-kissing { background-position: -600px -480px; }
+.emoji-kissing_cat { background-position: -600px -500px; }
+.emoji-kissing_closed_eyes { background-position: -600px -520px; }
+.emoji-kissing_heart { background-position: -600px -540px; }
+.emoji-kissing_smiling_eyes { background-position: -600px -560px; }
+.emoji-kiwi { background-position: -600px -580px; }
+.emoji-knife { background-position: 0 -600px; }
+.emoji-koala { background-position: -20px -600px; }
+.emoji-koko { background-position: -40px -600px; }
+.emoji-label { background-position: -60px -600px; }
+.emoji-large_blue_circle { background-position: -80px -600px; }
+.emoji-large_blue_diamond { background-position: -100px -600px; }
+.emoji-large_orange_diamond { background-position: -120px -600px; }
+.emoji-last_quarter_moon { background-position: -140px -600px; }
+.emoji-last_quarter_moon_with_face { background-position: -160px -600px; }
+.emoji-laughing { background-position: -180px -600px; }
+.emoji-leaves { background-position: -200px -600px; }
+.emoji-ledger { background-position: -220px -600px; }
+.emoji-left_facing_fist { background-position: -240px -600px; }
+.emoji-left_facing_fist_tone1 { background-position: -260px -600px; }
+.emoji-left_facing_fist_tone2 { background-position: -280px -600px; }
+.emoji-left_facing_fist_tone3 { background-position: -300px -600px; }
+.emoji-left_facing_fist_tone4 { background-position: -320px -600px; }
+.emoji-left_facing_fist_tone5 { background-position: -340px -600px; }
+.emoji-left_luggage { background-position: -360px -600px; }
+.emoji-left_right_arrow { background-position: -380px -600px; }
+.emoji-leftwards_arrow_with_hook { background-position: -400px -600px; }
+.emoji-lemon { background-position: -420px -600px; }
+.emoji-leo { background-position: -440px -600px; }
+.emoji-leopard { background-position: -460px -600px; }
+.emoji-level_slider { background-position: -480px -600px; }
+.emoji-levitate { background-position: -500px -600px; }
+.emoji-libra { background-position: -520px -600px; }
+.emoji-lifter { background-position: -540px -600px; }
+.emoji-lifter_tone1 { background-position: -560px -600px; }
+.emoji-lifter_tone2 { background-position: -580px -600px; }
+.emoji-lifter_tone3 { background-position: -600px -600px; }
+.emoji-lifter_tone4 { background-position: -620px 0; }
+.emoji-lifter_tone5 { background-position: -620px -20px; }
+.emoji-light_rail { background-position: -620px -40px; }
+.emoji-link { background-position: -620px -60px; }
+.emoji-lion_face { background-position: -620px -80px; }
+.emoji-lips { background-position: -620px -100px; }
+.emoji-lipstick { background-position: -620px -120px; }
+.emoji-lizard { background-position: -620px -140px; }
+.emoji-lock { background-position: -620px -160px; }
+.emoji-lock_with_ink_pen { background-position: -620px -180px; }
+.emoji-lollipop { background-position: -620px -200px; }
+.emoji-loop { background-position: -620px -220px; }
+.emoji-loud_sound { background-position: -620px -240px; }
+.emoji-loudspeaker { background-position: -620px -260px; }
+.emoji-love_hotel { background-position: -620px -280px; }
+.emoji-love_letter { background-position: -620px -300px; }
+.emoji-low_brightness { background-position: -620px -320px; }
+.emoji-lying_face { background-position: -620px -340px; }
+.emoji-m { background-position: -620px -360px; }
+.emoji-mag { background-position: -620px -380px; }
+.emoji-mag_right { background-position: -620px -400px; }
+.emoji-mahjong { background-position: -620px -420px; }
+.emoji-mailbox { background-position: -620px -440px; }
+.emoji-mailbox_closed { background-position: -620px -460px; }
+.emoji-mailbox_with_mail { background-position: -620px -480px; }
+.emoji-mailbox_with_no_mail { background-position: -620px -500px; }
+.emoji-man { background-position: -620px -520px; }
+.emoji-man_dancing { background-position: -620px -540px; }
+.emoji-man_dancing_tone1 { background-position: -620px -560px; }
+.emoji-man_dancing_tone2 { background-position: -620px -580px; }
+.emoji-man_dancing_tone3 { background-position: -620px -600px; }
+.emoji-man_dancing_tone4 { background-position: 0 -620px; }
+.emoji-man_dancing_tone5 { background-position: -20px -620px; }
+.emoji-man_in_tuxedo { background-position: -40px -620px; }
+.emoji-man_in_tuxedo_tone1 { background-position: -60px -620px; }
+.emoji-man_in_tuxedo_tone2 { background-position: -80px -620px; }
+.emoji-man_in_tuxedo_tone3 { background-position: -100px -620px; }
+.emoji-man_in_tuxedo_tone4 { background-position: -120px -620px; }
+.emoji-man_in_tuxedo_tone5 { background-position: -140px -620px; }
+.emoji-man_tone1 { background-position: -160px -620px; }
+.emoji-man_tone2 { background-position: -180px -620px; }
+.emoji-man_tone3 { background-position: -200px -620px; }
+.emoji-man_tone4 { background-position: -220px -620px; }
+.emoji-man_tone5 { background-position: -240px -620px; }
+.emoji-man_with_gua_pi_mao { background-position: -260px -620px; }
+.emoji-man_with_gua_pi_mao_tone1 { background-position: -280px -620px; }
+.emoji-man_with_gua_pi_mao_tone2 { background-position: -300px -620px; }
+.emoji-man_with_gua_pi_mao_tone3 { background-position: -320px -620px; }
+.emoji-man_with_gua_pi_mao_tone4 { background-position: -340px -620px; }
+.emoji-man_with_gua_pi_mao_tone5 { background-position: -360px -620px; }
+.emoji-man_with_turban { background-position: -380px -620px; }
+.emoji-man_with_turban_tone1 { background-position: -400px -620px; }
+.emoji-man_with_turban_tone2 { background-position: -420px -620px; }
+.emoji-man_with_turban_tone3 { background-position: -440px -620px; }
+.emoji-man_with_turban_tone4 { background-position: -460px -620px; }
+.emoji-man_with_turban_tone5 { background-position: -480px -620px; }
+.emoji-mans_shoe { background-position: -500px -620px; }
+.emoji-map { background-position: -520px -620px; }
+.emoji-maple_leaf { background-position: -540px -620px; }
+.emoji-martial_arts_uniform { background-position: -560px -620px; }
+.emoji-mask { background-position: -580px -620px; }
+.emoji-massage { background-position: -600px -620px; }
+.emoji-massage_tone1 { background-position: -620px -620px; }
+.emoji-massage_tone2 { background-position: -640px 0; }
+.emoji-massage_tone3 { background-position: -640px -20px; }
+.emoji-massage_tone4 { background-position: -640px -40px; }
+.emoji-massage_tone5 { background-position: -640px -60px; }
+.emoji-meat_on_bone { background-position: -640px -80px; }
+.emoji-medal { background-position: -640px -100px; }
+.emoji-mega { background-position: -640px -120px; }
+.emoji-melon { background-position: -640px -140px; }
+.emoji-menorah { background-position: -640px -160px; }
+.emoji-mens { background-position: -640px -180px; }
+.emoji-metal { background-position: -640px -200px; }
+.emoji-metal_tone1 { background-position: -640px -220px; }
+.emoji-metal_tone2 { background-position: -640px -240px; }
+.emoji-metal_tone3 { background-position: -640px -260px; }
+.emoji-metal_tone4 { background-position: -640px -280px; }
+.emoji-metal_tone5 { background-position: -640px -300px; }
+.emoji-metro { background-position: -640px -320px; }
+.emoji-microphone { background-position: -640px -340px; }
+.emoji-microphone2 { background-position: -640px -360px; }
+.emoji-microscope { background-position: -640px -380px; }
+.emoji-middle_finger { background-position: -640px -400px; }
+.emoji-middle_finger_tone1 { background-position: -640px -420px; }
+.emoji-middle_finger_tone2 { background-position: -640px -440px; }
+.emoji-middle_finger_tone3 { background-position: -640px -460px; }
+.emoji-middle_finger_tone4 { background-position: -640px -480px; }
+.emoji-middle_finger_tone5 { background-position: -640px -500px; }
+.emoji-military_medal { background-position: -640px -520px; }
+.emoji-milk { background-position: -640px -540px; }
+.emoji-milky_way { background-position: -640px -560px; }
+.emoji-minibus { background-position: -640px -580px; }
+.emoji-minidisc { background-position: -640px -600px; }
+.emoji-mobile_phone_off { background-position: -640px -620px; }
+.emoji-money_mouth { background-position: 0 -640px; }
+.emoji-money_with_wings { background-position: -20px -640px; }
+.emoji-moneybag { background-position: -40px -640px; }
+.emoji-monkey { background-position: -60px -640px; }
+.emoji-monkey_face { background-position: -80px -640px; }
+.emoji-monorail { background-position: -100px -640px; }
+.emoji-mortar_board { background-position: -120px -640px; }
+.emoji-mosque { background-position: -140px -640px; }
+.emoji-motor_scooter { background-position: -160px -640px; }
+.emoji-motorboat { background-position: -180px -640px; }
+.emoji-motorcycle { background-position: -200px -640px; }
+.emoji-motorway { background-position: -220px -640px; }
+.emoji-mount_fuji { background-position: -240px -640px; }
+.emoji-mountain { background-position: -260px -640px; }
+.emoji-mountain_bicyclist { background-position: -280px -640px; }
+.emoji-mountain_bicyclist_tone1 { background-position: -300px -640px; }
+.emoji-mountain_bicyclist_tone2 { background-position: -320px -640px; }
+.emoji-mountain_bicyclist_tone3 { background-position: -340px -640px; }
+.emoji-mountain_bicyclist_tone4 { background-position: -360px -640px; }
+.emoji-mountain_bicyclist_tone5 { background-position: -380px -640px; }
+.emoji-mountain_cableway { background-position: -400px -640px; }
+.emoji-mountain_railway { background-position: -420px -640px; }
+.emoji-mountain_snow { background-position: -440px -640px; }
+.emoji-mouse { background-position: -460px -640px; }
+.emoji-mouse2 { background-position: -480px -640px; }
+.emoji-mouse_three_button { background-position: -500px -640px; }
+.emoji-movie_camera { background-position: -520px -640px; }
+.emoji-moyai { background-position: -540px -640px; }
+.emoji-mrs_claus { background-position: -560px -640px; }
+.emoji-mrs_claus_tone1 { background-position: -580px -640px; }
+.emoji-mrs_claus_tone2 { background-position: -600px -640px; }
+.emoji-mrs_claus_tone3 { background-position: -620px -640px; }
+.emoji-mrs_claus_tone4 { background-position: -640px -640px; }
+.emoji-mrs_claus_tone5 { background-position: -660px 0; }
+.emoji-muscle { background-position: -660px -20px; }
+.emoji-muscle_tone1 { background-position: -660px -40px; }
+.emoji-muscle_tone2 { background-position: -660px -60px; }
+.emoji-muscle_tone3 { background-position: -660px -80px; }
+.emoji-muscle_tone4 { background-position: -660px -100px; }
+.emoji-muscle_tone5 { background-position: -660px -120px; }
+.emoji-mushroom { background-position: -660px -140px; }
+.emoji-musical_keyboard { background-position: -660px -160px; }
+.emoji-musical_note { background-position: -660px -180px; }
+.emoji-musical_score { background-position: -660px -200px; }
+.emoji-mute { background-position: -660px -220px; }
+.emoji-nail_care { background-position: -660px -240px; }
+.emoji-nail_care_tone1 { background-position: -660px -260px; }
+.emoji-nail_care_tone2 { background-position: -660px -280px; }
+.emoji-nail_care_tone3 { background-position: -660px -300px; }
+.emoji-nail_care_tone4 { background-position: -660px -320px; }
+.emoji-nail_care_tone5 { background-position: -660px -340px; }
+.emoji-name_badge { background-position: -660px -360px; }
+.emoji-nauseated_face { background-position: -660px -380px; }
+.emoji-necktie { background-position: -660px -400px; }
+.emoji-negative_squared_cross_mark { background-position: -660px -420px; }
+.emoji-nerd { background-position: -660px -440px; }
+.emoji-neutral_face { background-position: -660px -460px; }
+.emoji-new { background-position: -660px -480px; }
+.emoji-new_moon { background-position: -660px -500px; }
+.emoji-new_moon_with_face { background-position: -660px -520px; }
+.emoji-newspaper { background-position: -660px -540px; }
+.emoji-newspaper2 { background-position: -660px -560px; }
+.emoji-ng { background-position: -660px -580px; }
+.emoji-night_with_stars { background-position: -660px -600px; }
+.emoji-nine { background-position: -660px -620px; }
+.emoji-no_bell { background-position: -660px -640px; }
+.emoji-no_bicycles { background-position: 0 -660px; }
+.emoji-no_entry { background-position: -20px -660px; }
+.emoji-no_entry_sign { background-position: -40px -660px; }
+.emoji-no_good { background-position: -60px -660px; }
+.emoji-no_good_tone1 { background-position: -80px -660px; }
+.emoji-no_good_tone2 { background-position: -100px -660px; }
+.emoji-no_good_tone3 { background-position: -120px -660px; }
+.emoji-no_good_tone4 { background-position: -140px -660px; }
+.emoji-no_good_tone5 { background-position: -160px -660px; }
+.emoji-no_mobile_phones { background-position: -180px -660px; }
+.emoji-no_mouth { background-position: -200px -660px; }
+.emoji-no_pedestrians { background-position: -220px -660px; }
+.emoji-no_smoking { background-position: -240px -660px; }
+.emoji-non-potable_water { background-position: -260px -660px; }
+.emoji-nose { background-position: -280px -660px; }
+.emoji-nose_tone1 { background-position: -300px -660px; }
+.emoji-nose_tone2 { background-position: -320px -660px; }
+.emoji-nose_tone3 { background-position: -340px -660px; }
+.emoji-nose_tone4 { background-position: -360px -660px; }
+.emoji-nose_tone5 { background-position: -380px -660px; }
+.emoji-notebook { background-position: -400px -660px; }
+.emoji-notebook_with_decorative_cover { background-position: -420px -660px; }
+.emoji-notepad_spiral { background-position: -440px -660px; }
+.emoji-notes { background-position: -460px -660px; }
+.emoji-nut_and_bolt { background-position: -480px -660px; }
+.emoji-o { background-position: -500px -660px; }
+.emoji-o2 { background-position: -520px -660px; }
+.emoji-ocean { background-position: -540px -660px; }
+.emoji-octagonal_sign { background-position: -560px -660px; }
+.emoji-octopus { background-position: -580px -660px; }
+.emoji-oden { background-position: -600px -660px; }
+.emoji-office { background-position: -620px -660px; }
+.emoji-oil { background-position: -640px -660px; }
+.emoji-ok { background-position: -660px -660px; }
+.emoji-ok_hand { background-position: -680px 0; }
+.emoji-ok_hand_tone1 { background-position: -680px -20px; }
+.emoji-ok_hand_tone2 { background-position: -680px -40px; }
+.emoji-ok_hand_tone3 { background-position: -680px -60px; }
+.emoji-ok_hand_tone4 { background-position: -680px -80px; }
+.emoji-ok_hand_tone5 { background-position: -680px -100px; }
+.emoji-ok_woman { background-position: -680px -120px; }
+.emoji-ok_woman_tone1 { background-position: -680px -140px; }
+.emoji-ok_woman_tone2 { background-position: -680px -160px; }
+.emoji-ok_woman_tone3 { background-position: -680px -180px; }
+.emoji-ok_woman_tone4 { background-position: -680px -200px; }
+.emoji-ok_woman_tone5 { background-position: -680px -220px; }
+.emoji-older_man { background-position: -680px -240px; }
+.emoji-older_man_tone1 { background-position: -680px -260px; }
+.emoji-older_man_tone2 { background-position: -680px -280px; }
+.emoji-older_man_tone3 { background-position: -680px -300px; }
+.emoji-older_man_tone4 { background-position: -680px -320px; }
+.emoji-older_man_tone5 { background-position: -680px -340px; }
+.emoji-older_woman { background-position: -680px -360px; }
+.emoji-older_woman_tone1 { background-position: -680px -380px; }
+.emoji-older_woman_tone2 { background-position: -680px -400px; }
+.emoji-older_woman_tone3 { background-position: -680px -420px; }
+.emoji-older_woman_tone4 { background-position: -680px -440px; }
+.emoji-older_woman_tone5 { background-position: -680px -460px; }
+.emoji-om_symbol { background-position: -680px -480px; }
+.emoji-on { background-position: -680px -500px; }
+.emoji-oncoming_automobile { background-position: -680px -520px; }
+.emoji-oncoming_bus { background-position: -680px -540px; }
+.emoji-oncoming_police_car { background-position: -680px -560px; }
+.emoji-oncoming_taxi { background-position: -680px -580px; }
+.emoji-one { background-position: -680px -600px; }
+.emoji-open_file_folder { background-position: -680px -620px; }
+.emoji-open_hands { background-position: -680px -640px; }
+.emoji-open_hands_tone1 { background-position: -680px -660px; }
+.emoji-open_hands_tone2 { background-position: 0 -680px; }
+.emoji-open_hands_tone3 { background-position: -20px -680px; }
+.emoji-open_hands_tone4 { background-position: -40px -680px; }
+.emoji-open_hands_tone5 { background-position: -60px -680px; }
+.emoji-open_mouth { background-position: -80px -680px; }
+.emoji-ophiuchus { background-position: -100px -680px; }
+.emoji-orange_book { background-position: -120px -680px; }
+.emoji-orthodox_cross { background-position: -140px -680px; }
+.emoji-outbox_tray { background-position: -160px -680px; }
+.emoji-owl { background-position: -180px -680px; }
+.emoji-ox { background-position: -200px -680px; }
+.emoji-package { background-position: -220px -680px; }
+.emoji-page_facing_up { background-position: -240px -680px; }
+.emoji-page_with_curl { background-position: -260px -680px; }
+.emoji-pager { background-position: -280px -680px; }
+.emoji-paintbrush { background-position: -300px -680px; }
+.emoji-palm_tree { background-position: -320px -680px; }
+.emoji-pancakes { background-position: -340px -680px; }
+.emoji-panda_face { background-position: -360px -680px; }
+.emoji-paperclip { background-position: -380px -680px; }
+.emoji-paperclips { background-position: -400px -680px; }
+.emoji-park { background-position: -420px -680px; }
+.emoji-parking { background-position: -440px -680px; }
+.emoji-part_alternation_mark { background-position: -460px -680px; }
+.emoji-partly_sunny { background-position: -480px -680px; }
+.emoji-passport_control { background-position: -500px -680px; }
+.emoji-pause_button { background-position: -520px -680px; }
+.emoji-peace { background-position: -540px -680px; }
+.emoji-peach { background-position: -560px -680px; }
+.emoji-peanuts { background-position: -580px -680px; }
+.emoji-pear { background-position: -600px -680px; }
+.emoji-pen_ballpoint { background-position: -620px -680px; }
+.emoji-pen_fountain { background-position: -640px -680px; }
+.emoji-pencil { background-position: -660px -680px; }
+.emoji-pencil2 { background-position: -680px -680px; }
+.emoji-penguin { background-position: -700px 0; }
+.emoji-pensive { background-position: -700px -20px; }
+.emoji-performing_arts { background-position: -700px -40px; }
+.emoji-persevere { background-position: -700px -60px; }
+.emoji-person_frowning { background-position: -700px -80px; }
+.emoji-person_frowning_tone1 { background-position: -700px -100px; }
+.emoji-person_frowning_tone2 { background-position: -700px -120px; }
+.emoji-person_frowning_tone3 { background-position: -700px -140px; }
+.emoji-person_frowning_tone4 { background-position: -700px -160px; }
+.emoji-person_frowning_tone5 { background-position: -700px -180px; }
+.emoji-person_with_blond_hair { background-position: -700px -200px; }
+.emoji-person_with_blond_hair_tone1 { background-position: -700px -220px; }
+.emoji-person_with_blond_hair_tone2 { background-position: -700px -240px; }
+.emoji-person_with_blond_hair_tone3 { background-position: -700px -260px; }
+.emoji-person_with_blond_hair_tone4 { background-position: -700px -280px; }
+.emoji-person_with_blond_hair_tone5 { background-position: -700px -300px; }
+.emoji-person_with_pouting_face { background-position: -700px -320px; }
+.emoji-person_with_pouting_face_tone1 { background-position: -700px -340px; }
+.emoji-person_with_pouting_face_tone2 { background-position: -700px -360px; }
+.emoji-person_with_pouting_face_tone3 { background-position: -700px -380px; }
+.emoji-person_with_pouting_face_tone4 { background-position: -700px -400px; }
+.emoji-person_with_pouting_face_tone5 { background-position: -700px -420px; }
+.emoji-pick { background-position: -700px -440px; }
+.emoji-pig { background-position: -700px -460px; }
+.emoji-pig2 { background-position: -700px -480px; }
+.emoji-pig_nose { background-position: -700px -500px; }
+.emoji-pill { background-position: -700px -520px; }
+.emoji-pineapple { background-position: -700px -540px; }
+.emoji-ping_pong { background-position: -700px -560px; }
+.emoji-pisces { background-position: -700px -580px; }
+.emoji-pizza { background-position: -700px -600px; }
+.emoji-place_of_worship { background-position: -700px -620px; }
+.emoji-play_pause { background-position: -700px -640px; }
+.emoji-point_down { background-position: -700px -660px; }
+.emoji-point_down_tone1 { background-position: -700px -680px; }
+.emoji-point_down_tone2 { background-position: 0 -700px; }
+.emoji-point_down_tone3 { background-position: -20px -700px; }
+.emoji-point_down_tone4 { background-position: -40px -700px; }
+.emoji-point_down_tone5 { background-position: -60px -700px; }
+.emoji-point_left { background-position: -80px -700px; }
+.emoji-point_left_tone1 { background-position: -100px -700px; }
+.emoji-point_left_tone2 { background-position: -120px -700px; }
+.emoji-point_left_tone3 { background-position: -140px -700px; }
+.emoji-point_left_tone4 { background-position: -160px -700px; }
+.emoji-point_left_tone5 { background-position: -180px -700px; }
+.emoji-point_right { background-position: -200px -700px; }
+.emoji-point_right_tone1 { background-position: -220px -700px; }
+.emoji-point_right_tone2 { background-position: -240px -700px; }
+.emoji-point_right_tone3 { background-position: -260px -700px; }
+.emoji-point_right_tone4 { background-position: -280px -700px; }
+.emoji-point_right_tone5 { background-position: -300px -700px; }
+.emoji-point_up { background-position: -320px -700px; }
+.emoji-point_up_2 { background-position: -340px -700px; }
+.emoji-point_up_2_tone1 { background-position: -360px -700px; }
+.emoji-point_up_2_tone2 { background-position: -380px -700px; }
+.emoji-point_up_2_tone3 { background-position: -400px -700px; }
+.emoji-point_up_2_tone4 { background-position: -420px -700px; }
+.emoji-point_up_2_tone5 { background-position: -440px -700px; }
+.emoji-point_up_tone1 { background-position: -460px -700px; }
+.emoji-point_up_tone2 { background-position: -480px -700px; }
+.emoji-point_up_tone3 { background-position: -500px -700px; }
+.emoji-point_up_tone4 { background-position: -520px -700px; }
+.emoji-point_up_tone5 { background-position: -540px -700px; }
+.emoji-police_car { background-position: -560px -700px; }
+.emoji-poodle { background-position: -580px -700px; }
+.emoji-poop { background-position: -600px -700px; }
+.emoji-popcorn { background-position: -620px -700px; }
+.emoji-post_office { background-position: -640px -700px; }
+.emoji-postal_horn { background-position: -660px -700px; }
+.emoji-postbox { background-position: -680px -700px; }
+.emoji-potable_water { background-position: -700px -700px; }
+.emoji-potato { background-position: -720px 0; }
+.emoji-pouch { background-position: -720px -20px; }
+.emoji-poultry_leg { background-position: -720px -40px; }
+.emoji-pound { background-position: -720px -60px; }
+.emoji-pouting_cat { background-position: -720px -80px; }
+.emoji-pray { background-position: -720px -100px; }
+.emoji-pray_tone1 { background-position: -720px -120px; }
+.emoji-pray_tone2 { background-position: -720px -140px; }
+.emoji-pray_tone3 { background-position: -720px -160px; }
+.emoji-pray_tone4 { background-position: -720px -180px; }
+.emoji-pray_tone5 { background-position: -720px -200px; }
+.emoji-prayer_beads { background-position: -720px -220px; }
+.emoji-pregnant_woman { background-position: -720px -240px; }
+.emoji-pregnant_woman_tone1 { background-position: -720px -260px; }
+.emoji-pregnant_woman_tone2 { background-position: -720px -280px; }
+.emoji-pregnant_woman_tone3 { background-position: -720px -300px; }
+.emoji-pregnant_woman_tone4 { background-position: -720px -320px; }
+.emoji-pregnant_woman_tone5 { background-position: -720px -340px; }
+.emoji-prince { background-position: -720px -360px; }
+.emoji-prince_tone1 { background-position: -720px -380px; }
+.emoji-prince_tone2 { background-position: -720px -400px; }
+.emoji-prince_tone3 { background-position: -720px -420px; }
+.emoji-prince_tone4 { background-position: -720px -440px; }
+.emoji-prince_tone5 { background-position: -720px -460px; }
+.emoji-princess { background-position: -720px -480px; }
+.emoji-princess_tone1 { background-position: -720px -500px; }
+.emoji-princess_tone2 { background-position: -720px -520px; }
+.emoji-princess_tone3 { background-position: -720px -540px; }
+.emoji-princess_tone4 { background-position: -720px -560px; }
+.emoji-princess_tone5 { background-position: -720px -580px; }
+.emoji-printer { background-position: -720px -600px; }
+.emoji-projector { background-position: -720px -620px; }
+.emoji-punch { background-position: -720px -640px; }
+.emoji-punch_tone1 { background-position: -720px -660px; }
+.emoji-punch_tone2 { background-position: -720px -680px; }
+.emoji-punch_tone3 { background-position: -720px -700px; }
+.emoji-punch_tone4 { background-position: 0 -720px; }
+.emoji-punch_tone5 { background-position: -20px -720px; }
+.emoji-purple_heart { background-position: -40px -720px; }
+.emoji-purse { background-position: -60px -720px; }
+.emoji-pushpin { background-position: -80px -720px; }
+.emoji-put_litter_in_its_place { background-position: -100px -720px; }
+.emoji-question { background-position: -120px -720px; }
+.emoji-rabbit { background-position: -140px -720px; }
+.emoji-rabbit2 { background-position: -160px -720px; }
+.emoji-race_car { background-position: -180px -720px; }
+.emoji-racehorse { background-position: -200px -720px; }
+.emoji-radio { background-position: -220px -720px; }
+.emoji-radio_button { background-position: -240px -720px; }
+.emoji-radioactive { background-position: -260px -720px; }
+.emoji-rage { background-position: -280px -720px; }
+.emoji-railway_car { background-position: -300px -720px; }
+.emoji-railway_track { background-position: -320px -720px; }
+.emoji-rainbow { background-position: -340px -720px; }
+.emoji-raised_back_of_hand { background-position: -360px -720px; }
+.emoji-raised_back_of_hand_tone1 { background-position: -380px -720px; }
+.emoji-raised_back_of_hand_tone2 { background-position: -400px -720px; }
+.emoji-raised_back_of_hand_tone3 { background-position: -420px -720px; }
+.emoji-raised_back_of_hand_tone4 { background-position: -440px -720px; }
+.emoji-raised_back_of_hand_tone5 { background-position: -460px -720px; }
+.emoji-raised_hand { background-position: -480px -720px; }
+.emoji-raised_hand_tone1 { background-position: -500px -720px; }
+.emoji-raised_hand_tone2 { background-position: -520px -720px; }
+.emoji-raised_hand_tone3 { background-position: -540px -720px; }
+.emoji-raised_hand_tone4 { background-position: -560px -720px; }
+.emoji-raised_hand_tone5 { background-position: -580px -720px; }
+.emoji-raised_hands { background-position: -600px -720px; }
+.emoji-raised_hands_tone1 { background-position: -620px -720px; }
+.emoji-raised_hands_tone2 { background-position: -640px -720px; }
+.emoji-raised_hands_tone3 { background-position: -660px -720px; }
+.emoji-raised_hands_tone4 { background-position: -680px -720px; }
+.emoji-raised_hands_tone5 { background-position: -700px -720px; }
+.emoji-raising_hand { background-position: -720px -720px; }
+.emoji-raising_hand_tone1 { background-position: -740px 0; }
+.emoji-raising_hand_tone2 { background-position: -740px -20px; }
+.emoji-raising_hand_tone3 { background-position: -740px -40px; }
+.emoji-raising_hand_tone4 { background-position: -740px -60px; }
+.emoji-raising_hand_tone5 { background-position: -740px -80px; }
+.emoji-ram { background-position: -740px -100px; }
+.emoji-ramen { background-position: -740px -120px; }
+.emoji-rat { background-position: -740px -140px; }
+.emoji-record_button { background-position: -740px -160px; }
+.emoji-recycle { background-position: -740px -180px; }
+.emoji-red_car { background-position: -740px -200px; }
+.emoji-red_circle { background-position: -740px -220px; }
+.emoji-registered { background-position: -740px -240px; }
+.emoji-relaxed { background-position: -740px -260px; }
+.emoji-relieved { background-position: -740px -280px; }
+.emoji-reminder_ribbon { background-position: -740px -300px; }
+.emoji-repeat { background-position: -740px -320px; }
+.emoji-repeat_one { background-position: -740px -340px; }
+.emoji-restroom { background-position: -740px -360px; }
+.emoji-revolving_hearts { background-position: -740px -380px; }
+.emoji-rewind { background-position: -740px -400px; }
+.emoji-rhino { background-position: -740px -420px; }
+.emoji-ribbon { background-position: -740px -440px; }
+.emoji-rice { background-position: -740px -460px; }
+.emoji-rice_ball { background-position: -740px -480px; }
+.emoji-rice_cracker { background-position: -740px -500px; }
+.emoji-rice_scene { background-position: -740px -520px; }
+.emoji-right_facing_fist { background-position: -740px -540px; }
+.emoji-right_facing_fist_tone1 { background-position: -740px -560px; }
+.emoji-right_facing_fist_tone2 { background-position: -740px -580px; }
+.emoji-right_facing_fist_tone3 { background-position: -740px -600px; }
+.emoji-right_facing_fist_tone4 { background-position: -740px -620px; }
+.emoji-right_facing_fist_tone5 { background-position: -740px -640px; }
+.emoji-ring { background-position: -740px -660px; }
+.emoji-robot { background-position: -740px -680px; }
+.emoji-rocket { background-position: -740px -700px; }
+.emoji-rofl { background-position: -740px -720px; }
+.emoji-roller_coaster { background-position: 0 -740px; }
+.emoji-rolling_eyes { background-position: -20px -740px; }
+.emoji-rooster { background-position: -40px -740px; }
+.emoji-rose { background-position: -60px -740px; }
+.emoji-rosette { background-position: -80px -740px; }
+.emoji-rotating_light { background-position: -100px -740px; }
+.emoji-round_pushpin { background-position: -120px -740px; }
+.emoji-rowboat { background-position: -140px -740px; }
+.emoji-rowboat_tone1 { background-position: -160px -740px; }
+.emoji-rowboat_tone2 { background-position: -180px -740px; }
+.emoji-rowboat_tone3 { background-position: -200px -740px; }
+.emoji-rowboat_tone4 { background-position: -220px -740px; }
+.emoji-rowboat_tone5 { background-position: -240px -740px; }
+.emoji-rugby_football { background-position: -260px -740px; }
+.emoji-runner { background-position: -280px -740px; }
+.emoji-runner_tone1 { background-position: -300px -740px; }
+.emoji-runner_tone2 { background-position: -320px -740px; }
+.emoji-runner_tone3 { background-position: -340px -740px; }
+.emoji-runner_tone4 { background-position: -360px -740px; }
+.emoji-runner_tone5 { background-position: -380px -740px; }
+.emoji-running_shirt_with_sash { background-position: -400px -740px; }
+.emoji-sa { background-position: -420px -740px; }
+.emoji-sagittarius { background-position: -440px -740px; }
+.emoji-sailboat { background-position: -460px -740px; }
+.emoji-sake { background-position: -480px -740px; }
+.emoji-salad { background-position: -500px -740px; }
+.emoji-sandal { background-position: -520px -740px; }
+.emoji-santa { background-position: -540px -740px; }
+.emoji-santa_tone1 { background-position: -560px -740px; }
+.emoji-santa_tone2 { background-position: -580px -740px; }
+.emoji-santa_tone3 { background-position: -600px -740px; }
+.emoji-santa_tone4 { background-position: -620px -740px; }
+.emoji-santa_tone5 { background-position: -640px -740px; }
+.emoji-satellite { background-position: -660px -740px; }
+.emoji-satellite_orbital { background-position: -680px -740px; }
+.emoji-saxophone { background-position: -700px -740px; }
+.emoji-scales { background-position: -720px -740px; }
+.emoji-school { background-position: -740px -740px; }
+.emoji-school_satchel { background-position: -760px 0; }
+.emoji-scissors { background-position: -760px -20px; }
+.emoji-scooter { background-position: -760px -40px; }
+.emoji-scorpion { background-position: -760px -60px; }
+.emoji-scorpius { background-position: -760px -80px; }
+.emoji-scream { background-position: -760px -100px; }
+.emoji-scream_cat { background-position: -760px -120px; }
+.emoji-scroll { background-position: -760px -140px; }
+.emoji-seat { background-position: -760px -160px; }
+.emoji-second_place { background-position: -760px -180px; }
+.emoji-secret { background-position: -760px -200px; }
+.emoji-see_no_evil { background-position: -760px -220px; }
+.emoji-seedling { background-position: -760px -240px; }
+.emoji-selfie { background-position: -760px -260px; }
+.emoji-selfie_tone1 { background-position: -760px -280px; }
+.emoji-selfie_tone2 { background-position: -760px -300px; }
+.emoji-selfie_tone3 { background-position: -760px -320px; }
+.emoji-selfie_tone4 { background-position: -760px -340px; }
+.emoji-selfie_tone5 { background-position: -760px -360px; }
+.emoji-seven { background-position: -760px -380px; }
+.emoji-shallow_pan_of_food { background-position: -760px -400px; }
+.emoji-shamrock { background-position: -760px -420px; }
+.emoji-shark { background-position: -760px -440px; }
+.emoji-shaved_ice { background-position: -760px -460px; }
+.emoji-sheep { background-position: -760px -480px; }
+.emoji-shell { background-position: -760px -500px; }
+.emoji-shield { background-position: -760px -520px; }
+.emoji-shinto_shrine { background-position: -760px -540px; }
+.emoji-ship { background-position: -760px -560px; }
+.emoji-shirt { background-position: -760px -580px; }
+.emoji-shopping_bags { background-position: -760px -600px; }
+.emoji-shopping_cart { background-position: -760px -620px; }
+.emoji-shower { background-position: -760px -640px; }
+.emoji-shrimp { background-position: -760px -660px; }
+.emoji-shrug { background-position: -760px -680px; }
+.emoji-shrug_tone1 { background-position: -760px -700px; }
+.emoji-shrug_tone2 { background-position: -760px -720px; }
+.emoji-shrug_tone3 { background-position: -760px -740px; }
+.emoji-shrug_tone4 { background-position: 0 -760px; }
+.emoji-shrug_tone5 { background-position: -20px -760px; }
+.emoji-signal_strength { background-position: -40px -760px; }
+.emoji-six { background-position: -60px -760px; }
+.emoji-six_pointed_star { background-position: -80px -760px; }
+.emoji-ski { background-position: -100px -760px; }
+.emoji-skier { background-position: -120px -760px; }
+.emoji-skull { background-position: -140px -760px; }
+.emoji-skull_crossbones { background-position: -160px -760px; }
+.emoji-sleeping { background-position: -180px -760px; }
+.emoji-sleeping_accommodation { background-position: -200px -760px; }
+.emoji-sleepy { background-position: -220px -760px; }
+.emoji-slight_frown { background-position: -240px -760px; }
+.emoji-slight_smile { background-position: -260px -760px; }
+.emoji-slot_machine { background-position: -280px -760px; }
+.emoji-small_blue_diamond { background-position: -300px -760px; }
+.emoji-small_orange_diamond { background-position: -320px -760px; }
+.emoji-small_red_triangle { background-position: -340px -760px; }
+.emoji-small_red_triangle_down { background-position: -360px -760px; }
+.emoji-smile { background-position: -380px -760px; }
+.emoji-smile_cat { background-position: -400px -760px; }
+.emoji-smiley { background-position: -420px -760px; }
+.emoji-smiley_cat { background-position: -440px -760px; }
+.emoji-smiling_imp { background-position: -460px -760px; }
+.emoji-smirk { background-position: -480px -760px; }
+.emoji-smirk_cat { background-position: -500px -760px; }
+.emoji-smoking { background-position: -520px -760px; }
+.emoji-snail { background-position: -540px -760px; }
+.emoji-snake { background-position: -560px -760px; }
+.emoji-sneezing_face { background-position: -580px -760px; }
+.emoji-snowboarder { background-position: -600px -760px; }
+.emoji-snowflake { background-position: -620px -760px; }
+.emoji-snowman { background-position: -640px -760px; }
+.emoji-snowman2 { background-position: -660px -760px; }
+.emoji-sob { background-position: -680px -760px; }
+.emoji-soccer { background-position: -700px -760px; }
+.emoji-soon { background-position: -720px -760px; }
+.emoji-sos { background-position: -740px -760px; }
+.emoji-sound { background-position: -760px -760px; }
+.emoji-space_invader { background-position: -780px 0; }
+.emoji-spades { background-position: -780px -20px; }
+.emoji-spaghetti { background-position: -780px -40px; }
+.emoji-sparkle { background-position: -780px -60px; }
+.emoji-sparkler { background-position: -780px -80px; }
+.emoji-sparkles { background-position: -780px -100px; }
+.emoji-sparkling_heart { background-position: -780px -120px; }
+.emoji-speak_no_evil { background-position: -780px -140px; }
+.emoji-speaker { background-position: -780px -160px; }
+.emoji-speaking_head { background-position: -780px -180px; }
+.emoji-speech_balloon { background-position: -780px -200px; }
+.emoji-speech_left { background-position: -780px -220px; }
+.emoji-speedboat { background-position: -780px -240px; }
+.emoji-spider { background-position: -780px -260px; }
+.emoji-spider_web { background-position: -780px -280px; }
+.emoji-spoon { background-position: -780px -300px; }
+.emoji-spy { background-position: -780px -320px; }
+.emoji-spy_tone1 { background-position: -780px -340px; }
+.emoji-spy_tone2 { background-position: -780px -360px; }
+.emoji-spy_tone3 { background-position: -780px -380px; }
+.emoji-spy_tone4 { background-position: -780px -400px; }
+.emoji-spy_tone5 { background-position: -780px -420px; }
+.emoji-squid { background-position: -780px -440px; }
+.emoji-stadium { background-position: -780px -460px; }
+.emoji-star { background-position: -780px -480px; }
+.emoji-star2 { background-position: -780px -500px; }
+.emoji-star_and_crescent { background-position: -780px -520px; }
+.emoji-star_of_david { background-position: -780px -540px; }
+.emoji-stars { background-position: -780px -560px; }
+.emoji-station { background-position: -780px -580px; }
+.emoji-statue_of_liberty { background-position: -780px -600px; }
+.emoji-steam_locomotive { background-position: -780px -620px; }
+.emoji-stew { background-position: -780px -640px; }
+.emoji-stop_button { background-position: -780px -660px; }
+.emoji-stopwatch { background-position: -780px -680px; }
+.emoji-straight_ruler { background-position: -780px -700px; }
+.emoji-strawberry { background-position: -780px -720px; }
+.emoji-stuck_out_tongue { background-position: -780px -740px; }
+.emoji-stuck_out_tongue_closed_eyes { background-position: -780px -760px; }
+.emoji-stuck_out_tongue_winking_eye { background-position: 0 -780px; }
+.emoji-stuffed_flatbread { background-position: -20px -780px; }
+.emoji-sun_with_face { background-position: -40px -780px; }
+.emoji-sunflower { background-position: -60px -780px; }
+.emoji-sunglasses { background-position: -80px -780px; }
+.emoji-sunny { background-position: -100px -780px; }
+.emoji-sunrise { background-position: -120px -780px; }
+.emoji-sunrise_over_mountains { background-position: -140px -780px; }
+.emoji-surfer { background-position: -160px -780px; }
+.emoji-surfer_tone1 { background-position: -180px -780px; }
+.emoji-surfer_tone2 { background-position: -200px -780px; }
+.emoji-surfer_tone3 { background-position: -220px -780px; }
+.emoji-surfer_tone4 { background-position: -240px -780px; }
+.emoji-surfer_tone5 { background-position: -260px -780px; }
+.emoji-sushi { background-position: -280px -780px; }
+.emoji-suspension_railway { background-position: -300px -780px; }
+.emoji-sweat { background-position: -320px -780px; }
+.emoji-sweat_drops { background-position: -340px -780px; }
+.emoji-sweat_smile { background-position: -360px -780px; }
+.emoji-sweet_potato { background-position: -380px -780px; }
+.emoji-swimmer { background-position: -400px -780px; }
+.emoji-swimmer_tone1 { background-position: -420px -780px; }
+.emoji-swimmer_tone2 { background-position: -440px -780px; }
+.emoji-swimmer_tone3 { background-position: -460px -780px; }
+.emoji-swimmer_tone4 { background-position: -480px -780px; }
+.emoji-swimmer_tone5 { background-position: -500px -780px; }
+.emoji-symbols { background-position: -520px -780px; }
+.emoji-synagogue { background-position: -540px -780px; }
+.emoji-syringe { background-position: -560px -780px; }
+.emoji-taco { background-position: -580px -780px; }
+.emoji-tada { background-position: -600px -780px; }
+.emoji-tanabata_tree { background-position: -620px -780px; }
+.emoji-tangerine { background-position: -640px -780px; }
+.emoji-taurus { background-position: -660px -780px; }
+.emoji-taxi { background-position: -680px -780px; }
+.emoji-tea { background-position: -700px -780px; }
+.emoji-telephone { background-position: -720px -780px; }
+.emoji-telephone_receiver { background-position: -740px -780px; }
+.emoji-telescope { background-position: -760px -780px; }
+.emoji-ten { background-position: -780px -780px; }
+.emoji-tennis { background-position: -800px 0; }
+.emoji-tent { background-position: -800px -20px; }
+.emoji-thermometer { background-position: -800px -40px; }
+.emoji-thermometer_face { background-position: -800px -60px; }
+.emoji-thinking { background-position: -800px -80px; }
+.emoji-third_place { background-position: -800px -100px; }
+.emoji-thought_balloon { background-position: -800px -120px; }
+.emoji-three { background-position: -800px -140px; }
+.emoji-thumbsdown { background-position: -800px -160px; }
+.emoji-thumbsdown_tone1 { background-position: -800px -180px; }
+.emoji-thumbsdown_tone2 { background-position: -800px -200px; }
+.emoji-thumbsdown_tone3 { background-position: -800px -220px; }
+.emoji-thumbsdown_tone4 { background-position: -800px -240px; }
+.emoji-thumbsdown_tone5 { background-position: -800px -260px; }
+.emoji-thumbsup { background-position: -800px -280px; }
+.emoji-thumbsup_tone1 { background-position: -800px -300px; }
+.emoji-thumbsup_tone2 { background-position: -800px -320px; }
+.emoji-thumbsup_tone3 { background-position: -800px -340px; }
+.emoji-thumbsup_tone4 { background-position: -800px -360px; }
+.emoji-thumbsup_tone5 { background-position: -800px -380px; }
+.emoji-thunder_cloud_rain { background-position: -800px -400px; }
+.emoji-ticket { background-position: -800px -420px; }
+.emoji-tickets { background-position: -800px -440px; }
+.emoji-tiger { background-position: -800px -460px; }
+.emoji-tiger2 { background-position: -800px -480px; }
+.emoji-timer { background-position: -800px -500px; }
+.emoji-tired_face { background-position: -800px -520px; }
+.emoji-tm { background-position: -800px -540px; }
+.emoji-toilet { background-position: -800px -560px; }
+.emoji-tokyo_tower { background-position: -800px -580px; }
+.emoji-tomato { background-position: -800px -600px; }
+.emoji-tone1 { background-position: -800px -620px; }
+.emoji-tone2 { background-position: -800px -640px; }
+.emoji-tone3 { background-position: -800px -660px; }
+.emoji-tone4 { background-position: -800px -680px; }
+.emoji-tone5 { background-position: -800px -700px; }
+.emoji-tongue { background-position: -800px -720px; }
+.emoji-tools { background-position: -800px -740px; }
+.emoji-top { background-position: -800px -760px; }
+.emoji-tophat { background-position: -800px -780px; }
+.emoji-track_next { background-position: 0 -800px; }
+.emoji-track_previous { background-position: -20px -800px; }
+.emoji-trackball { background-position: -40px -800px; }
+.emoji-tractor { background-position: -60px -800px; }
+.emoji-traffic_light { background-position: -80px -800px; }
+.emoji-train { background-position: -100px -800px; }
+.emoji-train2 { background-position: -120px -800px; }
+.emoji-tram { background-position: -140px -800px; }
+.emoji-triangular_flag_on_post { background-position: -160px -800px; }
+.emoji-triangular_ruler { background-position: -180px -800px; }
+.emoji-trident { background-position: -200px -800px; }
+.emoji-triumph { background-position: -220px -800px; }
+.emoji-trolleybus { background-position: -240px -800px; }
+.emoji-trophy { background-position: -260px -800px; }
+.emoji-tropical_drink { background-position: -280px -800px; }
+.emoji-tropical_fish { background-position: -300px -800px; }
+.emoji-truck { background-position: -320px -800px; }
+.emoji-trumpet { background-position: -340px -800px; }
+.emoji-tulip { background-position: -360px -800px; }
+.emoji-tumbler_glass { background-position: -380px -800px; }
+.emoji-turkey { background-position: -400px -800px; }
+.emoji-turtle { background-position: -420px -800px; }
+.emoji-tv { background-position: -440px -800px; }
+.emoji-twisted_rightwards_arrows { background-position: -460px -800px; }
+.emoji-two { background-position: -480px -800px; }
+.emoji-two_hearts { background-position: -500px -800px; }
+.emoji-two_men_holding_hands { background-position: -520px -800px; }
+.emoji-two_women_holding_hands { background-position: -540px -800px; }
+.emoji-u5272 { background-position: -560px -800px; }
+.emoji-u5408 { background-position: -580px -800px; }
+.emoji-u55b6 { background-position: -600px -800px; }
+.emoji-u6307 { background-position: -620px -800px; }
+.emoji-u6708 { background-position: -640px -800px; }
+.emoji-u6709 { background-position: -660px -800px; }
+.emoji-u6e80 { background-position: -680px -800px; }
+.emoji-u7121 { background-position: -700px -800px; }
+.emoji-u7533 { background-position: -720px -800px; }
+.emoji-u7981 { background-position: -740px -800px; }
+.emoji-u7a7a { background-position: -760px -800px; }
+.emoji-umbrella { background-position: -780px -800px; }
+.emoji-umbrella2 { background-position: -800px -800px; }
+.emoji-unamused { background-position: -820px 0; }
+.emoji-underage { background-position: -820px -20px; }
+.emoji-unicorn { background-position: -820px -40px; }
+.emoji-unlock { background-position: -820px -60px; }
+.emoji-up { background-position: -820px -80px; }
+.emoji-upside_down { background-position: -820px -100px; }
+.emoji-urn { background-position: -820px -120px; }
+.emoji-v { background-position: -820px -140px; }
+.emoji-v_tone1 { background-position: -820px -160px; }
+.emoji-v_tone2 { background-position: -820px -180px; }
+.emoji-v_tone3 { background-position: -820px -200px; }
+.emoji-v_tone4 { background-position: -820px -220px; }
+.emoji-v_tone5 { background-position: -820px -240px; }
+.emoji-vertical_traffic_light { background-position: -820px -260px; }
+.emoji-vhs { background-position: -820px -280px; }
+.emoji-vibration_mode { background-position: -820px -300px; }
+.emoji-video_camera { background-position: -820px -320px; }
+.emoji-video_game { background-position: -820px -340px; }
+.emoji-violin { background-position: -820px -360px; }
+.emoji-virgo { background-position: -820px -380px; }
+.emoji-volcano { background-position: -820px -400px; }
+.emoji-volleyball { background-position: -820px -420px; }
+.emoji-vs { background-position: -820px -440px; }
+.emoji-vulcan { background-position: -820px -460px; }
+.emoji-vulcan_tone1 { background-position: -820px -480px; }
+.emoji-vulcan_tone2 { background-position: -820px -500px; }
+.emoji-vulcan_tone3 { background-position: -820px -520px; }
+.emoji-vulcan_tone4 { background-position: -820px -540px; }
+.emoji-vulcan_tone5 { background-position: -820px -560px; }
+.emoji-walking { background-position: -820px -580px; }
+.emoji-walking_tone1 { background-position: -820px -600px; }
+.emoji-walking_tone2 { background-position: -820px -620px; }
+.emoji-walking_tone3 { background-position: -820px -640px; }
+.emoji-walking_tone4 { background-position: -820px -660px; }
+.emoji-walking_tone5 { background-position: -820px -680px; }
+.emoji-waning_crescent_moon { background-position: -820px -700px; }
+.emoji-waning_gibbous_moon { background-position: -820px -720px; }
+.emoji-warning { background-position: -820px -740px; }
+.emoji-wastebasket { background-position: -820px -760px; }
+.emoji-watch { background-position: -820px -780px; }
+.emoji-water_buffalo { background-position: -820px -800px; }
+.emoji-water_polo { background-position: 0 -820px; }
+.emoji-water_polo_tone1 { background-position: -20px -820px; }
+.emoji-water_polo_tone2 { background-position: -40px -820px; }
+.emoji-water_polo_tone3 { background-position: -60px -820px; }
+.emoji-water_polo_tone4 { background-position: -80px -820px; }
+.emoji-water_polo_tone5 { background-position: -100px -820px; }
+.emoji-watermelon { background-position: -120px -820px; }
+.emoji-wave { background-position: -140px -820px; }
+.emoji-wave_tone1 { background-position: -160px -820px; }
+.emoji-wave_tone2 { background-position: -180px -820px; }
+.emoji-wave_tone3 { background-position: -200px -820px; }
+.emoji-wave_tone4 { background-position: -220px -820px; }
+.emoji-wave_tone5 { background-position: -240px -820px; }
+.emoji-wavy_dash { background-position: -260px -820px; }
+.emoji-waxing_crescent_moon { background-position: -280px -820px; }
+.emoji-waxing_gibbous_moon { background-position: -300px -820px; }
+.emoji-wc { background-position: -320px -820px; }
+.emoji-weary { background-position: -340px -820px; }
+.emoji-wedding { background-position: -360px -820px; }
+.emoji-whale { background-position: -380px -820px; }
+.emoji-whale2 { background-position: -400px -820px; }
+.emoji-wheel_of_dharma { background-position: -420px -820px; }
+.emoji-wheelchair { background-position: -440px -820px; }
+.emoji-white_check_mark { background-position: -460px -820px; }
+.emoji-white_circle { background-position: -480px -820px; }
+.emoji-white_flower { background-position: -500px -820px; }
+.emoji-white_large_square { background-position: -520px -820px; }
+.emoji-white_medium_small_square { background-position: -540px -820px; }
+.emoji-white_medium_square { background-position: -560px -820px; }
+.emoji-white_small_square { background-position: -580px -820px; }
+.emoji-white_square_button { background-position: -600px -820px; }
+.emoji-white_sun_cloud { background-position: -620px -820px; }
+.emoji-white_sun_rain_cloud { background-position: -640px -820px; }
+.emoji-white_sun_small_cloud { background-position: -660px -820px; }
+.emoji-wilted_rose { background-position: -680px -820px; }
+.emoji-wind_blowing_face { background-position: -700px -820px; }
+.emoji-wind_chime { background-position: -720px -820px; }
+.emoji-wine_glass { background-position: -740px -820px; }
+.emoji-wink { background-position: -760px -820px; }
+.emoji-wolf { background-position: -780px -820px; }
+.emoji-woman { background-position: -800px -820px; }
+.emoji-woman_tone1 { background-position: -820px -820px; }
+.emoji-woman_tone2 { background-position: -840px 0; }
+.emoji-woman_tone3 { background-position: -840px -20px; }
+.emoji-woman_tone4 { background-position: -840px -40px; }
+.emoji-woman_tone5 { background-position: -840px -60px; }
+.emoji-womans_clothes { background-position: -840px -80px; }
+.emoji-womans_hat { background-position: -840px -100px; }
+.emoji-womens { background-position: -840px -120px; }
+.emoji-worried { background-position: -840px -140px; }
+.emoji-wrench { background-position: -840px -160px; }
+.emoji-wrestlers { background-position: -840px -180px; }
+.emoji-wrestlers_tone1 { background-position: -840px -200px; }
+.emoji-wrestlers_tone2 { background-position: -840px -220px; }
+.emoji-wrestlers_tone3 { background-position: -840px -240px; }
+.emoji-wrestlers_tone4 { background-position: -840px -260px; }
+.emoji-wrestlers_tone5 { background-position: -840px -280px; }
+.emoji-writing_hand { background-position: -840px -300px; }
+.emoji-writing_hand_tone1 { background-position: -840px -320px; }
+.emoji-writing_hand_tone2 { background-position: -840px -340px; }
+.emoji-writing_hand_tone3 { background-position: -840px -360px; }
+.emoji-writing_hand_tone4 { background-position: -840px -380px; }
+.emoji-writing_hand_tone5 { background-position: -840px -400px; }
+.emoji-x { background-position: -840px -420px; }
+.emoji-yellow_heart { background-position: -840px -440px; }
+.emoji-yen { background-position: -840px -460px; }
+.emoji-yin_yang { background-position: -840px -480px; }
+.emoji-yum { background-position: -840px -500px; }
+.emoji-zap { background-position: -840px -520px; }
+.emoji-zero { background-position: -840px -540px; }
+.emoji-zipper_mouth { background-position: -840px -560px; }
+.emoji-100 { background-position: -840px -580px; }
 
 .emoji-icon {
   background-image: image-url('emoji.png');
diff --git a/app/assets/stylesheets/framework/files.scss b/app/assets/stylesheets/framework/files.scss
index 6382551fcc9..c2a3cd16e67 100644
--- a/app/assets/stylesheets/framework/files.scss
+++ b/app/assets/stylesheets/framework/files.scss
@@ -101,13 +101,13 @@
 
     @for $i from 0 through 5 {
       .legend-box-#{$i} {
-        background-color: mix($blame-cyan, $blame-blue, $i / 5.0 * 100%);
+        background-color: mix($blame-cyan, $blame-blue, $i / 5 * 100%);
       }
     }
 
     @for $i from 1 through 4 {
       .legend-box-#{$i + 5} {
-        background-color: mix($blame-gray, $blame-cyan, $i / 4.0 * 100%);
+        background-color: mix($blame-gray, $blame-cyan, $i / 4 * 100%);
       }
     }
   }
@@ -142,7 +142,7 @@
      */
     &.blame {
       table {
-        border: none;
+        border: 0;
         margin: 0;
       }
 
@@ -150,20 +150,20 @@
         border-bottom: 1px solid $blame-border;
 
         &:last-child {
-          border-bottom: none;
+          border-bottom: 0;
         }
       }
 
       td {
-        border-top: none;
-        border-bottom: none;
+        border-top: 0;
+        border-bottom: 0;
 
         &:first-child {
-          border-left: none;
+          border-left: 0;
         }
 
         &:last-child {
-          border-right: none;
+          border-right: 0;
         }
 
         &.blame-commit {
@@ -200,13 +200,13 @@
 
       @for $i from 0 through 5 {
         td.blame-commit-age-#{$i} {
-          border-left-color: mix($blame-cyan, $blame-blue, $i / 5.0 * 100%);
+          border-left-color: mix($blame-cyan, $blame-blue, $i / 5 * 100%);
         }
       }
 
       @for $i from 1 through 4 {
         td.blame-commit-age-#{$i + 5} {
-          border-left-color: mix($blame-gray, $blame-cyan, $i / 4.0 * 100%);
+          border-left-color: mix($blame-gray, $blame-cyan, $i / 4 * 100%);
         }
       }
     }
diff --git a/app/assets/stylesheets/framework/filters.scss b/app/assets/stylesheets/framework/filters.scss
index a7333925f80..74b6b31b07e 100644
--- a/app/assets/stylesheets/framework/filters.scss
+++ b/app/assets/stylesheets/framework/filters.scss
@@ -255,7 +255,7 @@
   .clear-search {
     width: 35px;
     background-color: $white-light;
-    border: none;
+    border: 0;
     outline: none;
     z-index: 1;
 
@@ -418,7 +418,7 @@
 
 .droplab-dropdown .dropdown-menu .filter-dropdown-item {
   .btn {
-    border: none;
+    border: 0;
     width: 100%;
     text-align: left;
     padding: 8px 16px;
diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss
index 5d777f0d468..2218b5705fc 100644
--- a/app/assets/stylesheets/framework/header.scss
+++ b/app/assets/stylesheets/framework/header.scss
@@ -10,7 +10,7 @@
     z-index: 1000;
     margin-bottom: 0;
     min-height: $header-height;
-    border: none;
+    border: 0;
     border-bottom: 1px solid $border-color;
     position: fixed;
     top: 0;
@@ -129,7 +129,7 @@
         margin: 5px 2px 5px -8px;
         border-radius: $border-radius-default;
 
-        svg {
+        .tanuki-logo {
           @media (min-width: $screen-sm-min) {
             margin-right: 8px;
           }
@@ -169,7 +169,7 @@
 
   .navbar-collapse {
     flex: 0 0 auto;
-    border-top: none;
+    border-top: 0;
     padding: 0;
 
     @media (max-width: $screen-xs-max) {
@@ -352,77 +352,7 @@
 
 .header-user .dropdown-menu-nav,
 .header-new .dropdown-menu-nav {
-  margin-top: 4px;
-}
-
-.search {
-  margin: 4px 8px 0;
-
-  form {
-    height: 32px;
-    border: 0;
-    border-radius: $border-radius-default;
-    transition: border-color ease-in-out 0.15s, background-color ease-in-out 0.15s;
-
-    &:hover {
-      box-shadow: none;
-    }
-  }
-
-  .search-input {
-    color: $white-light;
-    background: none;
-    transition: color ease-in-out 0.15s;
-  }
-
-  .search-input::placeholder {
-    transition: color ease-in-out 0.15s;
-  }
-
-  .location-badge {
-    font-size: 12px;
-    margin: -4px 4px -4px -4px;
-    line-height: 25px;
-    padding: 4px 8px;
-    border-radius: 2px 0 0 2px;
-    height: 32px;
-    transition: border-color ease-in-out 0.15s;
-  }
-
-  &.search-active {
-    form {
-      background-color: rgba($indigo-200, .3);
-      box-shadow: none;
-
-      .search-input {
-        color: $gl-text-color;
-        transition: color ease-in-out 0.15s;
-      }
-
-      .search-input::placeholder {
-        color: $gl-text-color-tertiary;
-      }
-
-      .search-input-wrap {
-        .search-icon,
-        .clear-icon {
-          color: $gl-text-color-tertiary;
-          transition: color ease-in-out 0.15s;
-        }
-      }
-    }
-
-    .location-badge {
-      background-color: $nav-badge-bg;
-      border-color: $border-color;
-    }
-
-    .search-input-wrap {
-      .clear-icon {
-        color: $white-light;
-      }
-    }
-  }
+  margin-top: $dropdown-vertical-offset;
 }
 
 .breadcrumbs {
@@ -471,10 +401,13 @@
 .breadcrumbs-list {
   display: -webkit-flex;
   display: flex;
-  flex-wrap: wrap;
   margin-bottom: 0;
   line-height: 16px;
 
+  @media (max-width: $screen-xs-max) {
+    flex-wrap: wrap;
+  }
+
   > li {
     display: flex;
     align-items: center;
@@ -482,24 +415,35 @@
     padding: 2px 0;
 
     &:not(:last-child) {
-      margin-right: 20px;
+      padding-right: 20px;
+
+      &:not(.dropdown) {
+        overflow: hidden;
+      }
     }
 
     > a {
       font-size: 12px;
       color: currentColor;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      flex: 0 1 auto;
     }
   }
 }
 
 .breadcrumb-item-text {
-  @include str-truncated(128px);
   text-decoration: inherit;
+
+  @media (max-width: $screen-xs-max) {
+    @include str-truncated(128px);
+  }
 }
 
 .breadcrumbs-list-angle {
   position: absolute;
-  right: -12px;
+  right: 7px;
   top: 50%;
   color: $gl-text-color-tertiary;
   transform: translateY(-50%);
diff --git a/app/assets/stylesheets/framework/highlight.scss b/app/assets/stylesheets/framework/highlight.scss
index c63114f85b4..813a1711ea2 100644
--- a/app/assets/stylesheets/framework/highlight.scss
+++ b/app/assets/stylesheets/framework/highlight.scss
@@ -1,5 +1,5 @@
 .file-content.code {
-  border: none;
+  border: 0;
   box-shadow: none;
   margin: 0;
   padding: 0;
@@ -7,7 +7,7 @@
 
   pre {
     padding: 10px 0;
-    border: none;
+    border: 0;
     border-radius: 0;
     font-family: $monospace_font;
     font-size: $code_font_size;
diff --git a/app/assets/stylesheets/framework/lists.scss b/app/assets/stylesheets/framework/lists.scss
index 511608c618c..ad3bb0e35d1 100644
--- a/app/assets/stylesheets/framework/lists.scss
+++ b/app/assets/stylesheets/framework/lists.scss
@@ -42,7 +42,7 @@
     }
 
     &:last-child {
-      border-bottom: none;
+      border-bottom: 0;
 
       &.bottom {
         background: $gray-light;
@@ -92,7 +92,7 @@ ul.unstyled-list {
 }
 
 ul.unstyled-list > li {
-  border-bottom: none;
+  border-bottom: 0;
 }
 
 // Generic content list
@@ -178,7 +178,7 @@ ul.content-list {
 
     // When dragging a list item
     &.ui-sortable-helper {
-      border-bottom: none;
+      border-bottom: 0;
     }
 
     &.list-placeholder {
@@ -295,7 +295,7 @@ ul.indent-list {
   }
 
   > .group-list-tree > .group-row.has-children:first-child {
-    border-top: none;
+    border-top: 0;
   }
 }
 
@@ -413,7 +413,7 @@ ul.indent-list {
     padding: 0;
 
     &.has-children {
-      border-top: none;
+      border-top: 0;
     }
 
     &:first-child {
diff --git a/app/assets/stylesheets/framework/mixins.scss b/app/assets/stylesheets/framework/mixins.scss
index 2fee2164190..33012133b66 100644
--- a/app/assets/stylesheets/framework/mixins.scss
+++ b/app/assets/stylesheets/framework/mixins.scss
@@ -36,7 +36,7 @@
     margin: 0;
 
     &:last-child {
-      border-bottom: none;
+      border-bottom: 0;
     }
 
     &.active {
@@ -180,3 +180,31 @@
     display: none;
   }
 }
+
+@mixin triangle($color, $border-color, $size, $border-size) {
+  &::before,
+  &::after {
+    bottom: 100%;
+    left: 50%;
+    border: solid transparent;
+    content: '';
+    height: 0;
+    width: 0;
+    position: absolute;
+    pointer-events: none;
+  }
+
+  &::before {
+    border-color: transparent;
+    border-bottom-color: $border-color;
+    border-width: ($size + $border-size);
+    margin-left: -($size + $border-size);
+  }
+
+  &::after {
+    border-color: transparent;
+    border-bottom-color: $color;
+    border-width: $size;
+    margin-left: -$size;
+  }
+}
diff --git a/app/assets/stylesheets/framework/modal.scss b/app/assets/stylesheets/framework/modal.scss
index 1cebd02df48..5c9838c1029 100644
--- a/app/assets/stylesheets/framework/modal.scss
+++ b/app/assets/stylesheets/framework/modal.scss
@@ -7,6 +7,7 @@
 }
 
 .modal-body {
+  background-color: $modal-body-bg;
   position: relative;
   padding: #{3 * $grid-size} #{2 * $grid-size};
 
@@ -42,3 +43,8 @@ body.modal-open {
     width: 98%;
   }
 }
+
+.modal.popup-dialog {
+  display: block;
+}
+
diff --git a/app/assets/stylesheets/framework/popup.scss b/app/assets/stylesheets/framework/popup.scss
new file mode 100644
index 00000000000..5c76205095f
--- /dev/null
+++ b/app/assets/stylesheets/framework/popup.scss
@@ -0,0 +1,15 @@
+.popup {
+  @include triangle(
+    $gray-lighter,
+    $gray-darker,
+    $popup-triangle-size,
+    $popup-triangle-border-size
+  );
+
+  padding: $gl-padding;
+  background-color: $gray-lighter;
+  border: 1px solid $gray-darker;
+  border-radius: $border-radius-default;
+  box-shadow: 0 5px 8px $popup-box-shadow-color;
+  position: relative;
+}
diff --git a/app/assets/stylesheets/framework/responsive_tables.scss b/app/assets/stylesheets/framework/responsive_tables.scss
index 8b7afdbe1a5..7829d722560 100644
--- a/app/assets/stylesheets/framework/responsive_tables.scss
+++ b/app/assets/stylesheets/framework/responsive_tables.scss
@@ -24,7 +24,7 @@
   @media (min-width: $screen-md-min) {
     margin: 0;
     padding: $gl-padding 0;
-    border: none;
+    border: 0;
 
     &:not(:last-child) {
       border-bottom: 1px solid $white-normal;
diff --git a/app/assets/stylesheets/framework/secondary-navigation-elements.scss b/app/assets/stylesheets/framework/secondary-navigation-elements.scss
index 9e1f77e5726..8498b37abe4 100644
--- a/app/assets/stylesheets/framework/secondary-navigation-elements.scss
+++ b/app/assets/stylesheets/framework/secondary-navigation-elements.scss
@@ -63,7 +63,7 @@
 
   .nav-links {
     margin-bottom: 0;
-    border-bottom: none;
+    border-bottom: 0;
     float: left;
 
     &.wide {
@@ -335,69 +335,16 @@
     border-bottom: 1px solid $border-color;
 
     .nav-links {
-      border-bottom: none;
+      border-bottom: 0;
     }
   }
 }
 
-.page-with-layout-nav {
-  .right-sidebar {
-    top: ($header-height + 1) * 2;
-  }
-
-  &.page-with-sub-nav {
-    .right-sidebar {
-      top: ($header-height + 1) * 3;
-
-      &.affix {
-        top: $header-height;
-      }
-    }
-  }
-}
-
-.with-performance-bar .page-with-layout-nav {
-  .right-sidebar {
-    top: ($header-height + 1) * 2 + $performance-bar-height;
-  }
-
-  &.page-with-sub-nav {
-    .right-sidebar {
-      top: ($header-height + 1) * 3 + $performance-bar-height;
-
-      &.affix {
-        top: $header-height + $performance-bar-height;
-      }
-    }
-  }
-}
-
-@media (max-width: $screen-xs-max) {
-  .top-area {
-    flex-flow: row wrap;
-
-    .nav-controls {
-      $controls-margin: $btn-xs-side-margin - 2px;
-      flex: 0 0 100%;
-
-      &.controls-flex {
-        display: flex;
-        flex-flow: row wrap;
-        align-items: center;
-        justify-content: center;
-        padding: 0 0 $gl-padding-top;
-      }
-
-      .controls-item,
-      .controls-item-full,
-      .controls-item:last-child {
-        flex: 1 1 35%;
-        display: block;
-        width: 100%;
-        margin: $controls-margin;
-      }
-    }
-  }
+.project-item-select-holder.btn-group {
+  display: flex;
+  max-width: 350px;
+  overflow: hidden;
+  float: right;
 
   .new-project-item-link {
     white-space: nowrap;
diff --git a/app/assets/stylesheets/framework/selects.scss b/app/assets/stylesheets/framework/selects.scss
index aa35cd9bea4..bb70b270299 100644
--- a/app/assets/stylesheets/framework/selects.scss
+++ b/app/assets/stylesheets/framework/selects.scss
@@ -17,7 +17,7 @@
     .select2-arrow {
       background-image: none;
       background-color: transparent;
-      border: none;
+      border: 0;
       padding-top: 12px;
       padding-right: 20px;
       font-size: 10px;
@@ -60,12 +60,17 @@
   border-radius: $border-radius-base;
   border: 1px solid $dropdown-border-color;
   min-width: 175px;
-  color: $gl-grayish-blue;
+  color: $gl-text-color;
+  z-index: 999;
 }
 
-.select2-results .select2-result-label,
-.select2-more-results {
-  padding: 10px 15px;
+.select2-drop-mask {
+  z-index: 998;
+}
+
+.select2-drop.select2-drop-above.select2-drop-active {
+  border-top: 1px solid $dropdown-border-color;
+  margin-top: -6px;
 }
 
 .select2-container-active {
@@ -158,18 +163,35 @@
   }
 }
 
-.select2-results .select2-no-results,
-.select2-results .select2-searching,
-.select2-results .select2-ajax-error,
-.select2-results .select2-selection-limit {
-  background: $gray-light;
-  display: list-item;
-  padding: 10px 15px;
-}
-
 .select2-results {
   margin: 0;
-  padding: 10px 0;
+  padding: #{$gl-padding / 2} 0;
+
+  .select2-no-results,
+  .select2-searching,
+  .select2-ajax-error,
+  .select2-selection-limit {
+    background: transparent;
+    padding: #{$gl-padding / 2} $gl-padding;
+  }
+
+  .select2-result-label,
+  .select2-more-results {
+    padding: #{$gl-padding / 2} $gl-padding;
+  }
+
+  .select2-highlighted {
+    background: transparent;
+    color: $gl-text-color;
+
+    .select2-result-label {
+      background: $dropdown-item-hover-bg;
+    }
+  }
+
+  .select2-result {
+    padding: 0 1px;
+  }
 
   li.select2-result-with-children > .select2-result-label {
     font-weight: $gl-font-weight-bold;
@@ -190,8 +212,6 @@
 }
 
 .select2-highlighted {
-  background: $gl-link-color !important;
-
   .group-result {
     .group-path {
       color: $white-light;
diff --git a/app/assets/stylesheets/framework/sidebar.scss b/app/assets/stylesheets/framework/sidebar.scss
index ef58382ba41..1a19b7320a0 100644
--- a/app/assets/stylesheets/framework/sidebar.scss
+++ b/app/assets/stylesheets/framework/sidebar.scss
@@ -9,7 +9,7 @@
     &.container-blank {
       background: none;
       padding: 0;
-      border: none;
+      border: 0;
     }
   }
 }
@@ -111,7 +111,7 @@
     }
 
     .block:last-of-type {
-      border: none;
+      border: 0;
     }
   }
 
diff --git a/app/assets/stylesheets/framework/tables.scss b/app/assets/stylesheets/framework/tables.scss
index 4dd31bf28cd..5bde96caf42 100644
--- a/app/assets/stylesheets/framework/tables.scss
+++ b/app/assets/stylesheets/framework/tables.scss
@@ -33,7 +33,7 @@ table {
       th {
         background-color: $gray-light;
         font-weight: $gl-font-weight-normal;
-        border-bottom: none;
+        border-bottom: 0;
 
         &.wide {
           width: 55%;
diff --git a/app/assets/stylesheets/framework/timeline.scss b/app/assets/stylesheets/framework/timeline.scss
index f718ec4bcad..373f35e71d8 100644
--- a/app/assets/stylesheets/framework/timeline.scss
+++ b/app/assets/stylesheets/framework/timeline.scss
@@ -21,7 +21,7 @@
   }
 
   &.text-file .diff-file {
-    border-bottom: none;
+    border-bottom: 0;
   }
 }
 
@@ -66,5 +66,5 @@
 
 .discussion .timeline-entry {
   margin: 0;
-  border-right: none;
+  border-right: 0;
 }
diff --git a/app/assets/stylesheets/framework/tw_bootstrap_variables.scss b/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
index 3ea77eb7a43..a23131e0818 100644
--- a/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
+++ b/app/assets/stylesheets/framework/tw_bootstrap_variables.scss
@@ -164,3 +164,36 @@ $pre-border-color: $border-color;
 $table-bg-accent: $gray-light;
 
 $zindex-popover: 900;
+
+//== Modals
+//
+//##
+
+//** Padding applied to the modal body
+$modal-inner-padding: $gl-padding;
+
+//** Padding applied to the modal title
+$modal-title-padding: $gl-padding;
+//** Modal title line-height
+// $modal-title-line-height:     $line-height-base
+
+//** Background color of modal content area
+$modal-content-bg: $gray-light;
+$modal-body-bg: $white-light;
+//** Modal content border color
+// $modal-content-border-color:                   rgba(0,0,0,.2)
+//** Modal content border color **for IE8**
+// $modal-content-fallback-border-color:          #999
+
+//** Modal backdrop background color
+// $modal-backdrop-bg:           #000
+//** Modal backdrop opacity
+// $modal-backdrop-opacity:      .5
+//** Modal header border color
+// $modal-header-border-color:   #e5e5e5
+//** Modal footer border color
+// $modal-footer-border-color:   $modal-header-border-color
+
+// $modal-lg:                    900px
+// $modal-md:                    600px
+// $modal-sm:                    300px
diff --git a/app/assets/stylesheets/framework/typography.scss b/app/assets/stylesheets/framework/typography.scss
index 3c0b4c82d19..0817cce114c 100644
--- a/app/assets/stylesheets/framework/typography.scss
+++ b/app/assets/stylesheets/framework/typography.scss
@@ -167,7 +167,7 @@
 
     &.plain-readme {
       background: none;
-      border: none;
+      border: 0;
       padding: 0;
       margin: 0;
       font-size: 14px;
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 8ab48e4844f..cb2a237f574 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -163,7 +163,7 @@ $gl-text-color: #2e2e2e;
 $gl-text-color-secondary: #707070;
 $gl-text-color-tertiary: #949494;
 $gl-text-color-quaternary: #d6d6d6;
-$gl-text-color-inverted: rgba(255, 255, 255, 1.0);
+$gl-text-color-inverted: rgba(255, 255, 255, 1);
 $gl-text-color-secondary-inverted: rgba(255, 255, 255, .85);
 $gl-text-green: $green-600;
 $gl-text-green-hover: $green-700;
@@ -486,8 +486,8 @@ $callout-success-color: $green-700;
 /*
 * Commit Page
 */
-$commit-max-width-marker-color: rgba(0, 0, 0, 0.0);
-$commit-message-text-area-bg: rgba(0, 0, 0, 0.0);
+$commit-max-width-marker-color: rgba(0, 0, 0, 0);
+$commit-message-text-area-bg: rgba(0, 0, 0, 0);
 
 /*
 * Common
@@ -719,3 +719,10 @@ Image Commenting cursor
 */
 $image-comment-cursor-left-offset: 12;
 $image-comment-cursor-top-offset: 30;
+
+/*
+Popup
+*/
+$popup-triangle-size: 15px;
+$popup-triangle-border-size: 1px;
+$popup-box-shadow-color: rgba(90, 90, 90, 0.05);
diff --git a/app/assets/stylesheets/framework/wells.scss b/app/assets/stylesheets/framework/wells.scss
index 5f9756bf58a..68824ff8418 100644
--- a/app/assets/stylesheets/framework/wells.scss
+++ b/app/assets/stylesheets/framework/wells.scss
@@ -52,6 +52,37 @@
   .label.label-gray {
     background-color: $well-expand-item;
   }
+
+  .branches {
+    display: inline;
+  }
+
+  .branch-link {
+    margin-bottom: 2px;
+  }
+
+  .limit-box {
+    cursor: pointer;
+    display: inline-flex;
+    align-items: center;
+    background-color: $red-100;
+    border-radius: $border-radius-default;
+    text-align: center;
+
+    &:hover {
+      background-color: $red-200;
+    }
+
+    .limit-icon {
+      margin: 0 8px;
+    }
+
+    .limit-message {
+      line-height: 16px;
+      margin-right: 8px;
+      font-size: 12px;
+    }
+  }
 }
 
 .light-well {
diff --git a/app/assets/stylesheets/framework/zen.scss b/app/assets/stylesheets/framework/zen.scss
index 32a0feb1c4b..5a4d3ba0ee9 100644
--- a/app/assets/stylesheets/framework/zen.scss
+++ b/app/assets/stylesheets/framework/zen.scss
@@ -9,7 +9,7 @@
     z-index: 1031;
 
     textarea {
-      border: none;
+      border: 0;
       box-shadow: none;
       border-radius: 0;
       color: $black;
diff --git a/app/assets/stylesheets/pages/builds.scss b/app/assets/stylesheets/pages/builds.scss
index 46978be8ba0..27b10b536a2 100644
--- a/app/assets/stylesheets/pages/builds.scss
+++ b/app/assets/stylesheets/pages/builds.scss
@@ -48,7 +48,7 @@
     overflow-x: auto;
     font-size: 12px;
     border-radius: 0;
-    border: none;
+    border: 0;
 
     .bash {
       display: block;
diff --git a/app/assets/stylesheets/pages/ci_projects.scss b/app/assets/stylesheets/pages/ci_projects.scss
index bf6a48889bf..fbe1f3081a0 100644
--- a/app/assets/stylesheets/pages/ci_projects.scss
+++ b/app/assets/stylesheets/pages/ci_projects.scss
@@ -36,7 +36,7 @@
     pre.commit-message {
       background: none;
       padding: 0;
-      border: none;
+      border: 0;
       margin: 20px 0;
       border-radius: 0;
     }
diff --git a/app/assets/stylesheets/pages/clusters.scss b/app/assets/stylesheets/pages/clusters.scss
index 5c91579c69c..e5b9e1f2de6 100644
--- a/app/assets/stylesheets/pages/clusters.scss
+++ b/app/assets/stylesheets/pages/clusters.scss
@@ -3,3 +3,8 @@
     background-color: $white-light;
   }
 }
+
+.cluster-applications-table {
+  // Wait for the Vue to kick-in and render the applications block
+  min-height: 302px;
+}
diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss
index ee3ca246374..b1850be8a5f 100644
--- a/app/assets/stylesheets/pages/commits.scss
+++ b/app/assets/stylesheets/pages/commits.scss
@@ -1,6 +1,6 @@
 .commit-description {
   background: none;
-  border: none;
+  border: 0;
   padding: 0;
   margin-top: 10px;
   word-break: normal;
@@ -247,7 +247,7 @@
     word-break: normal;
 
     pre {
-      border: none;
+      border: 0;
       background: inherit;
       padding: 0;
       margin: 0;
diff --git a/app/assets/stylesheets/pages/cycle_analytics.scss b/app/assets/stylesheets/pages/cycle_analytics.scss
index 82d9be29201..292e0ad394b 100644
--- a/app/assets/stylesheets/pages/cycle_analytics.scss
+++ b/app/assets/stylesheets/pages/cycle_analytics.scss
@@ -80,7 +80,7 @@
   .panel {
     .content-block {
       padding: 24px 0;
-      border-bottom: none;
+      border-bottom: 0;
       position: relative;
 
       @media (max-width: $screen-xs-max) {
@@ -222,11 +222,11 @@
       }
 
       &:first-child {
-        border-top: none;
+        border-top: 0;
       }
 
       &:last-child {
-        border-bottom: none;
+        border-bottom: 0;
       }
 
       .stage-nav-item-cell {
@@ -290,7 +290,7 @@
     border-bottom: 1px solid $gray-darker;
 
     &:last-child {
-      border-bottom: none;
+      border-bottom: 0;
       margin-bottom: 0;
     }
 
diff --git a/app/assets/stylesheets/pages/detail_page.scss b/app/assets/stylesheets/pages/detail_page.scss
index 3d9eff35583..538e50ee306 100644
--- a/app/assets/stylesheets/pages/detail_page.scss
+++ b/app/assets/stylesheets/pages/detail_page.scss
@@ -3,6 +3,7 @@
   border-bottom: 1px solid $border-color;
   color: $gl-text-color;
   line-height: 34px;
+  display: flex;
 
   a {
     color: $gl-text-color;
diff --git a/app/assets/stylesheets/pages/diff.scss b/app/assets/stylesheets/pages/diff.scss
index faa3d1fb4d5..bce94e09367 100644
--- a/app/assets/stylesheets/pages/diff.scss
+++ b/app/assets/stylesheets/pages/diff.scss
@@ -47,7 +47,7 @@
     table {
       width: 100%;
       font-family: $monospace_font;
-      border: none;
+      border: 0;
       border-collapse: separate;
       margin: 0;
       padding: 0;
@@ -105,7 +105,7 @@
     .new_line {
       @include user-select(none);
       margin: 0;
-      border: none;
+      border: 0;
       padding: 0 5px;
       border-right: 1px solid;
       text-align: right;
@@ -133,7 +133,7 @@
       display: block;
       margin: 0;
       padding: 0 1.5em;
-      border: none;
+      border: 0;
       position: relative;
 
       &.parallel {
@@ -359,7 +359,7 @@
       cursor: pointer;
 
       &:first-child {
-        border-left: none;
+        border-left: 0;
       }
 
       &:hover {
@@ -388,7 +388,7 @@
 
 .file-content .diff-file {
   margin: 0;
-  border: none;
+  border: 0;
 }
 
 .diff-wrap-lines .line_content {
@@ -400,7 +400,7 @@
 }
 
 .files-changed {
-  border-bottom: none;
+  border-bottom: 0;
 }
 
 .diff-stats-summary-toggler {
diff --git a/app/assets/stylesheets/pages/editor.scss b/app/assets/stylesheets/pages/editor.scss
index edfafa79c44..c586dab4cf2 100644
--- a/app/assets/stylesheets/pages/editor.scss
+++ b/app/assets/stylesheets/pages/editor.scss
@@ -3,13 +3,13 @@
     border-top: 1px solid $border-color;
     border-right: 1px solid $border-color;
     border-left: 1px solid $border-color;
-    border-bottom: none;
+    border-bottom: 0;
     border-radius: $border-radius-small $border-radius-small 0 0;
     background: $gray-normal;
   }
 
   #editor {
-    border: none;
+    border: 0;
     border-radius: 0;
     height: 500px;
     margin: 0;
@@ -171,7 +171,7 @@
     width: 100%;
     margin: 5px 0;
     padding: 0;
-    border-left: none;
+    border-left: 0;
   }
 }
 
diff --git a/app/assets/stylesheets/pages/environments.scss b/app/assets/stylesheets/pages/environments.scss
index b5b0f3d9dfa..b0795353ec1 100644
--- a/app/assets/stylesheets/pages/environments.scss
+++ b/app/assets/stylesheets/pages/environments.scss
@@ -117,7 +117,7 @@
     }
 
     .no-btn {
-      border: none;
+      border: 0;
       background: none;
       outline: none;
       width: 100%;
@@ -133,11 +133,11 @@
 }
 
 .folder-row {
-  border-left: none;
-  border-right: none;
+  border-left: 0;
+  border-right: 0;
 
   @media (min-width: $screen-sm-max) {
-    border-top: none;
+    border-top: 0;
   }
 }
 
@@ -173,7 +173,7 @@
 
 .prometheus-graph-overlay {
   fill: none;
-  opacity: 0.0;
+  opacity: 0;
   pointer-events: all;
 }
 
@@ -256,12 +256,6 @@
   padding: 0;
   padding-bottom: 100%;
 
-  .label-axis-text {
-    fill: $black;
-    font-weight: $gl-font-weight-normal;
-    font-size: 10px;
-  }
-
   .text-metric-usage,
   .legend-metric-title {
     fill: $black;
@@ -276,19 +270,33 @@
     left: 0;
     top: 0;
 
-    .label-axis-text,
-    .text-metric-usage {
+    text {
+      fill: $gl-text-color;
+      stroke-width: 0;
+    }
+
+    .text-metric-bold {
+      font-weight: $gl-font-weight-bold;
+    }
+
+    .label-axis-text {
       fill: $black;
       font-weight: $gl-font-weight-normal;
-      font-size: 12px;
+      font-size: 10px;
     }
 
     .legend-axis-text {
       fill: $black;
     }
 
-    .tick > text {
-      font-size: 12px;
+    .tick {
+      > line {
+        stroke: $gray-darker;
+      }
+
+      > text {
+        font-size: 12px;
+      }
     }
 
     .text-metric-title {
diff --git a/app/assets/stylesheets/pages/events.scss b/app/assets/stylesheets/pages/events.scss
index 1723d716805..eea8b7dd193 100644
--- a/app/assets/stylesheets/pages/events.scss
+++ b/app/assets/stylesheets/pages/events.scss
@@ -85,7 +85,7 @@
       }
 
       pre {
-        border: none;
+        border: 0;
         background: $gray-light;
         border-radius: 0;
         color: $events-pre-color;
@@ -128,14 +128,14 @@
     }
   }
 
-  &:last-child { border: none; }
+  &:last-child { border: 0; }
 
   .event_commits {
     li {
       &.commit {
         background: transparent;
         padding: 0;
-        border: none;
+        border: 0;
 
         .commit-row-title {
           font-size: $gl-font-size;
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index 7059a4cfe85..7a5dab16561 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -6,28 +6,20 @@
 }
 
 .issuable-warning-icon {
-  color: $orange-600;
   background-color: $orange-100;
   border-radius: $border-radius-default;
-  padding: 5px;
   margin: 0 $btn-side-margin 0 0;
   width: $issuable-warning-size;
   height: $issuable-warning-size;
   text-align: center;
 
-  &:first-of-type {
-    margin-right: $issuable-warning-icon-margin;
+  .icon {
+    fill: $orange-600;
+    vertical-align: text-bottom;
   }
-}
-
-.sidebar-item-icon {
-  border-radius: $border-radius-default;
-  padding: 5px;
-  margin: 0 3px 0 -4px;
 
-  &.is-active {
-    color: $orange-600;
-    background-color: $orange-50;
+  &:first-of-type {
+    margin-right: $issuable-warning-icon-margin;
   }
 }
 
@@ -79,7 +71,7 @@
   .title {
     padding: 0;
     margin-bottom: 16px;
-    border-bottom: none;
+    border-bottom: 0;
   }
 
   .btn-edit {
@@ -131,12 +123,12 @@
   top: $header-height;
   bottom: 0;
   right: 0;
-  transition: width .3s;
+  transition: width $right-sidebar-transition-duration;
   background: $gray-light;
   z-index: 200;
   overflow: hidden;
 
-  a,
+  a:not(.btn-retry),
   .btn-link {
     color: inherit;
   }
@@ -164,7 +156,7 @@
     }
 
     &:last-child {
-      border: none;
+      border: 0;
     }
 
     span {
@@ -338,7 +330,7 @@
     .block {
       width: $gutter_collapsed_width - 2px;
       padding: 15px 0 0;
-      border-bottom: none;
+      border-bottom: 0;
       overflow: hidden;
     }
 
@@ -399,7 +391,7 @@
       }
 
       .btn-clipboard {
-        border: none;
+        border: 0;
         color: $issuable-sidebar-color;
 
         &:hover {
@@ -613,6 +605,8 @@
   float: none;
   display: inline-block;
   margin-top: 0;
+  height: auto;
+  align-self: center;
 
   @media (max-width: $screen-xs-max) {
     position: absolute;
@@ -626,6 +620,8 @@
   padding-left: 45px;
   padding-right: 45px;
   line-height: 35px;
+  display: flex;
+  flex-grow: 1;
 
   @media (min-width: $screen-sm-min) {
     float: left;
@@ -637,11 +633,12 @@
 .issuable-actions {
   @include new-style-dropdown;
 
-  padding-top: 10px;
+  align-self: center;
+  flex-shrink: 0;
+  flex: 0 0 auto;
 
   @media (min-width: $screen-sm-min) {
     float: right;
-    padding-top: 0;
   }
 }
 
@@ -655,8 +652,9 @@
 
 .issuable-meta {
   display: inline-block;
-  line-height: 18px;
   font-size: 14px;
+  line-height: 24px;
+  align-self: center;
 }
 
 .js-issuable-selector-wrap {
diff --git a/app/assets/stylesheets/pages/issues.scss b/app/assets/stylesheets/pages/issues.scss
index e8ca5cedaee..8bb68ad2425 100644
--- a/app/assets/stylesheets/pages/issues.scss
+++ b/app/assets/stylesheets/pages/issues.scss
@@ -134,11 +134,24 @@ ul.related-merge-requests > li {
 }
 
 @media (max-width: $screen-xs-max) {
-  .issue-btn-group {
-    width: 100%;
+  .detail-page-header,
+  .issuable-header {
+    display: block;
+
+    .issuable-meta {
+      line-height: 18px;
+    }
+  }
 
-    .btn {
+  .issuable-actions {
+    margin-top: 10px;
+
+    .issue-btn-group {
       width: 100%;
+
+      .btn {
+        width: 100%;
+      }
     }
   }
 }
diff --git a/app/assets/stylesheets/pages/login.scss b/app/assets/stylesheets/pages/login.scss
index 92d49bd864a..b7985c4dea5 100644
--- a/app/assets/stylesheets/pages/login.scss
+++ b/app/assets/stylesheets/pages/login.scss
@@ -139,7 +139,7 @@
       border-left: 1px solid $border-color;
 
       &:first-of-type {
-        border-left: none;
+        border-left: 0;
         border-top-left-radius: $border-radius-default;
       }
 
@@ -165,7 +165,7 @@
         border-bottom: 1px solid $border-color;
 
         a {
-          border: none;
+          border: 0;
           border-bottom: 2px solid $link-underline-blue;
           margin-right: 0;
           color: $black;
diff --git a/app/assets/stylesheets/pages/merge_conflicts.scss b/app/assets/stylesheets/pages/merge_conflicts.scss
index dbf3e2b763c..04bde64c752 100644
--- a/app/assets/stylesheets/pages/merge_conflicts.scss
+++ b/app/assets/stylesheets/pages/merge_conflicts.scss
@@ -262,7 +262,7 @@ $colors: (
     .editor {
       pre {
         height: 350px;
-        border: none;
+        border: 0;
         border-radius: 0;
         margin-bottom: 0;
       }
diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss
index 6e485ebad1b..5832cf4637f 100644
--- a/app/assets/stylesheets/pages/merge_requests.scss
+++ b/app/assets/stylesheets/pages/merge_requests.scss
@@ -150,18 +150,6 @@
     display: block;
   }
 
-  .mr-widget-body {
-    @include clearfix;
-
-    &.media > *:first-child {
-      margin-right: 10px;
-    }
-
-    .approve-btn {
-      margin-right: 5px;
-    }
-  }
-
   .mr-widget-pipeline-graph {
     padding: 0 4px;
 
@@ -169,9 +157,8 @@
       z-index: 300;
     }
 
-    .ci-action-icon-wrapper svg {
-      width: 16px;
-      height: 16px;
+    .ci-action-icon-wrapper {
+      line-height: 16px;
     }
   }
 
@@ -195,10 +182,6 @@
     overflow: hidden;
     word-break: break-all;
 
-    &.media > *:first-child {
-      margin-right: 10px;
-    }
-
     &.label-truncated {
       position: relative;
       display: inline-block;
@@ -216,6 +199,18 @@
         background-color: $gray-light;
       }
     }
+  }
+
+  .mr-widget-body {
+    @include clearfix;
+
+    &.media > *:first-child {
+      margin-right: 10px;
+    }
+
+    .approve-btn {
+      margin-right: 5px;
+    }
 
     h4 {
       float: left;
@@ -239,10 +234,6 @@
       margin-right: 7px;
     }
 
-    .approve-btn {
-      margin-right: 5px;
-    }
-
     label {
       font-weight: $gl-font-weight-normal;
     }
@@ -342,17 +333,6 @@
     }
   }
 
-  .mini-pipeline-graph-dropdown-menu .mini-pipeline-graph-dropdown-item {
-    display: flex;
-    align-items: center;
-
-    .ci-status-text,
-    .ci-status-icon {
-      top: 0;
-      margin-right: 10px;
-    }
-  }
-
   .mr-widget-help {
     padding: 10px 16px 10px 48px;
     font-style: italic;
diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss
index 5127307c5e7..1e6992cb65e 100644
--- a/app/assets/stylesheets/pages/note_form.scss
+++ b/app/assets/stylesheets/pages/note_form.scss
@@ -7,7 +7,7 @@
 
 .diff-file .diff-content {
   tr.line_holder:hover > td .line_note_link {
-    opacity: 1.0;
+    opacity: 1;
     filter: alpha(opacity = 100);
   }
 }
@@ -16,7 +16,7 @@
 .discussion {
   .new-note {
     margin: 0;
-    border: none;
+    border: 0;
   }
 }
 
@@ -106,23 +106,57 @@
   background-color: $orange-100;
   border-radius: $border-radius-default $border-radius-default 0 0;
   border: 1px solid $border-gray-normal;
-  border-bottom: none;
+  border-bottom: 0;
   padding: 3px 12px;
   margin: auto;
   align-items: center;
 
+  .icon {
+    margin-right: $issuable-warning-icon-margin;
+    vertical-align: text-bottom;
+    fill: $orange-600;
+  }
+
   + .md-area {
     border-top-left-radius: 0;
     border-top-right-radius: 0;
   }
+
+  .disabled-comment {
+    border: 0;
+    border-radius: $label-border-radius;
+    padding-top: $gl-vert-padding;
+    padding-bottom: $gl-vert-padding;
+
+    .icon svg {
+      position: relative;
+      top: 2px;
+      margin-right: $btn-xs-side-margin;
+      width: $gl-font-size;
+      height: $gl-font-size;
+      fill: $orange-600;
+    }
+  }
 }
 
-.sidebar-item-value {
-  .fa {
-    background-color: inherit;
+.sidebar-item-icon {
+  border-radius: $border-radius-default;
+  margin: 0 3px 0 -4px;
+  vertical-align: middle;
+
+  &.is-active {
+    fill: $orange-600;
   }
 }
 
+.sidebar-collapsed-icon .sidebar-item-icon {
+  margin: 0;
+}
+
+.sidebar-item-value .sidebar-item-icon {
+  fill: $theme-gray-700;
+}
+
 .sidebar-item-warning-message {
   line-height: 1.5;
   padding: 16px;
diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss
index ca363c6eac4..9537eeeee97 100644
--- a/app/assets/stylesheets/pages/notes.scss
+++ b/app/assets/stylesheets/pages/notes.scss
@@ -331,7 +331,7 @@ ul.notes {
 
     td {
       border: 1px solid $white-normal;
-      border-left: none;
+      border-left: 0;
 
       &.notes_line {
         vertical-align: middle;
@@ -476,6 +476,10 @@ ul.notes {
     float: none;
     margin-left: 0;
   }
+
+  .btn-group > .discussion-next-btn {
+    margin-left: -1px;
+  }
 }
 
 .note-actions {
@@ -666,7 +670,7 @@ ul.notes {
     .timeline-entry-inner {
       padding-left: $gl-padding;
       padding-right: $gl-padding;
-      border-bottom: none;
+      border-bottom: 0;
     }
   }
 }
@@ -679,7 +683,7 @@ ul.notes {
   padding: 90px 0;
 
   &.discussion-locked {
-    border: none;
+    border: 0;
     background-color: $white-light;
   }
 
@@ -759,7 +763,7 @@ ul.notes {
   top: 0;
   padding: 0;
   background-color: transparent;
-  border: none;
+  border: 0;
   outline: 0;
   color: $gray-darkest;
   transition: color $general-hover-transition-duration $general-hover-transition-curve;
diff --git a/app/assets/stylesheets/pages/pipelines.scss b/app/assets/stylesheets/pages/pipelines.scss
index 2a8cbc61af7..cb24274c612 100644
--- a/app/assets/stylesheets/pages/pipelines.scss
+++ b/app/assets/stylesheets/pages/pipelines.scss
@@ -179,7 +179,7 @@
    * Play button with icon in dropdowns
    */
   .no-btn {
-    border: none;
+    border: 0;
     background: none;
     outline: none;
     width: 100%;
@@ -288,7 +288,7 @@
 .pipeline-actions {
   @include new-style-dropdown;
 
-  border-bottom: none;
+  border-bottom: 0;
 }
 
 .tab-pane {
@@ -318,7 +318,7 @@
   }
 
   .build-log {
-    border: none;
+    border: 0;
     line-height: initial;
   }
 }
@@ -386,13 +386,13 @@
         // Remove right connecting horizontal line from first build in last stage
         &:first-child {
           &::after {
-            border: none;
+            border: 0;
           }
         }
         // Remove right curved connectors from all builds in last stage
         &:not(:first-child) {
           &::after {
-            border: none;
+            border: 0;
           }
         }
         // Remove opposite curve
@@ -409,7 +409,7 @@
         // Remove left curved connectors from all builds in first stage
         &:not(:first-child) {
           &::before {
-            border: none;
+            border: 0;
           }
         }
         // Remove opposite curve
@@ -518,7 +518,7 @@
 
     .dropdown-menu-toggle {
       background-color: transparent;
-      border: none;
+      border: 0;
       padding: 0;
 
       &:focus {
@@ -823,6 +823,11 @@ button.mini-pipeline-graph-dropdown-toggle {
         margin-left: 2px;
         display: inline-block;
 
+        &::after {
+          content: '';
+          display: block;
+        }
+
         @media (max-width: $screen-xs-max) {
           max-width: 60%;
         }
@@ -951,7 +956,7 @@ button.mini-pipeline-graph-dropdown-toggle {
 
 .terminal-container {
   .content-block {
-    border-bottom: none;
+    border-bottom: 0;
   }
 
   #terminal {
diff --git a/app/assets/stylesheets/pages/profile.scss b/app/assets/stylesheets/pages/profile.scss
index eab39f698c3..28dc71dc641 100644
--- a/app/assets/stylesheets/pages/profile.scss
+++ b/app/assets/stylesheets/pages/profile.scss
@@ -113,7 +113,7 @@
 
   li {
     padding: 3px 0;
-    border: none;
+    border: 0;
   }
 }
 
diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss
index b0c3474e3d5..aaad6dbba8e 100644
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/app/assets/stylesheets/pages/projects.scss
@@ -80,7 +80,7 @@
 
 .project-feature-settings {
   background: $gray-lighter;
-  border-top: none;
+  border-top: 0;
   margin-bottom: 16px;
 }
 
@@ -128,7 +128,7 @@
 
 .project-feature-toggle {
   position: relative;
-  border: none;
+  border: 0;
   outline: 0;
   display: block;
   width: 100px;
@@ -483,7 +483,7 @@ a.deploy-project-label {
   flex: 1;
   padding: 0;
   background: transparent;
-  border: none;
+  border: 0;
   line-height: 34px;
   margin: 0;
 
@@ -1012,7 +1012,7 @@ pre.light-well {
     margin: 0;
     border-radius: 0 0 1px 1px;
     padding: 20px 0;
-    border: none;
+    border: 0;
   }
 
   .table-bordered {
@@ -1165,7 +1165,7 @@ pre.light-well {
   table-layout: fixed;
 
   &.table-responsive {
-    border: none;
+    border: 0;
   }
 
   .variable-key {
diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index 1bb4e3cc345..d93c51d5448 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -64,7 +64,7 @@
 
     .monaco-editor.vs {
       .current-line {
-        border: none;
+        border: 0;
         background: $well-light-border;
       }
 
@@ -139,7 +139,7 @@
 
         &.active {
           background: $white-light;
-          border-bottom: none;
+          border-bottom: 0;
         }
 
         a {
@@ -181,7 +181,7 @@
         &.tabs-divider {
           width: 100%;
           background-color: $white-light;
-          border-right: none;
+          border-right: 0;
           border-top-right-radius: 2px;
         }
       }
@@ -298,3 +298,7 @@
     width: 100%;
   }
 }
+
+.multi-file-table-col-name {
+  width: 350px;
+}
diff --git a/app/assets/stylesheets/pages/search.scss b/app/assets/stylesheets/pages/search.scss
index eed711b1b66..fe455a04960 100644
--- a/app/assets/stylesheets/pages/search.scss
+++ b/app/assets/stylesheets/pages/search.scss
@@ -5,7 +5,7 @@
     margin-bottom: $gl-padding;
 
     &:last-child {
-      border-bottom: none;
+      border-bottom: 0;
     }
   }
 
@@ -57,7 +57,7 @@ input[type="checkbox"]:hover {
   }
 
   .search-input {
-    border: none;
+    border: 0;
     font-size: 14px;
     padding: 0 20px 0 0;
     margin-left: 5px;
@@ -78,10 +78,6 @@ input[type="checkbox"]:hover {
   }
 
   .search-input-wrap {
-    // Fallback if flexbox is not supported
-    display: inline-block;
-    width: 100%;
-
     .search-icon,
     .clear-icon {
       position: absolute;
diff --git a/app/assets/stylesheets/pages/settings.scss b/app/assets/stylesheets/pages/settings.scss
index 8b9b47a41bc..5d630c7d61e 100644
--- a/app/assets/stylesheets/pages/settings.scss
+++ b/app/assets/stylesheets/pages/settings.scss
@@ -249,3 +249,22 @@
     }
   }
 }
+
+.modal-doorkeepr-auth,
+.doorkeeper-app-form {
+  .scope-description {
+    color: $theme-gray-700;
+  }
+}
+
+.modal-doorkeepr-auth {
+  .modal-body {
+    padding: $gl-padding;
+  }
+}
+
+.doorkeeper-app-form {
+  .scope-description {
+    margin: 0 0 5px 17px;
+  }
+}
diff --git a/app/assets/stylesheets/pages/todos.scss b/app/assets/stylesheets/pages/todos.scss
index 6c8d87185e9..2139a029fc7 100644
--- a/app/assets/stylesheets/pages/todos.scss
+++ b/app/assets/stylesheets/pages/todos.scss
@@ -141,7 +141,7 @@
       }
 
       pre {
-        border: none;
+        border: 0;
         background: $gray-light;
         border-radius: 0;
         color: $todo-body-pre-color;
diff --git a/app/assets/stylesheets/pages/tree.scss b/app/assets/stylesheets/pages/tree.scss
index e2f6e511c86..65b334662c2 100644
--- a/app/assets/stylesheets/pages/tree.scss
+++ b/app/assets/stylesheets/pages/tree.scss
@@ -125,7 +125,7 @@
         color: $white-normal;
       }
 
-      &:hover {
+      &:hover:not(.tree-truncated-warning) {
         td {
           background-color: $row-hover;
           border-top: 1px solid $row-hover-border;
@@ -198,6 +198,11 @@
     }
   }
 
+  .tree-truncated-warning {
+    color: $orange-600;
+    background-color: $orange-100;
+  }
+
   .tree-time-ago {
     min-width: 135px;
     color: $gl-text-color-secondary;
@@ -252,7 +257,7 @@
     margin-top: 20px;
     padding: 0;
     border-top: 1px solid $white-dark;
-    border-bottom: none;
+    border-bottom: 0;
   }
 
   .commit-stats li {
diff --git a/app/controllers/concerns/issuable_actions.rb b/app/controllers/concerns/issuable_actions.rb
index 1916020bdd9..5b9c016bb8b 100644
--- a/app/controllers/concerns/issuable_actions.rb
+++ b/app/controllers/concerns/issuable_actions.rb
@@ -9,9 +9,7 @@ module IssuableActions
 
   def show
     respond_to do |format|
-      format.html do
-        render show_view
-      end
+      format.html
       format.json do
         render json: serializer.represent(issuable, serializer: params[:serializer])
       end
@@ -152,10 +150,6 @@ module IssuableActions
     end
   end
 
-  def show_view
-    'show'
-  end
-
   def serializer
     raise NotImplementedError
   end
diff --git a/app/controllers/concerns/issuable_collections.rb b/app/controllers/concerns/issuable_collections.rb
index 521d6e8eca5..aa5bcbef7ea 100644
--- a/app/controllers/concerns/issuable_collections.rb
+++ b/app/controllers/concerns/issuable_collections.rb
@@ -4,60 +4,46 @@ module IssuableCollections
   include Gitlab::IssuableMetadata
 
   included do
-    helper_method :issues_finder
-    helper_method :merge_requests_finder
+    helper_method :finder
   end
 
   private
 
   # rubocop:disable Cop/ModuleWithInstanceVariables
-  def set_issues_index
-    @collection_type    = "Issue"
-    @issues             = issues_collection
-    @issues             = @issues.page(params[:page])
-    @issuable_meta_data = issuable_meta_data(@issues, @collection_type)
-    @total_pages        = issues_page_count(@issues)
+  def set_issuables_index
+    @issuables          = issuables_collection
+    @issuables          = @issuables.page(params[:page])
+    @issuable_meta_data = issuable_meta_data(@issuables, collection_type)
+    @total_pages        = issuable_page_count
 
-    return if redirect_out_of_range(@issues, @total_pages)
+    return if redirect_out_of_range(@total_pages)
 
     if params[:label_name].present?
-      @labels = LabelsFinder.new(current_user, project_id: @project.id, title: params[:label_name]).execute
+      labels_params = { project_id: @project.id, title: params[:label_name] }
+      @labels = LabelsFinder.new(current_user, labels_params).execute
     end
 
     @users = []
-  end
-  # rubocop:enable Cop/ModuleWithInstanceVariables
-
-  def issues_collection
-    issues_finder.execute.preload(:project, :author, :assignees, :labels, :milestone, project: :namespace)
-  end
-
-  def merge_requests_collection
-    merge_requests_finder.execute.preload(
-      :source_project,
-      :target_project,
-      :author,
-      :assignee,
-      :labels,
-      :milestone,
-      head_pipeline: :project,
-      target_project: :namespace,
-      merge_request_diff: :merge_request_diff_commits
-    )
-  end
+    if params[:assignee_id].present?
+      assignee = User.find_by_id(params[:assignee_id])
+      @users.push(assignee) if assignee
+    end
 
-  def issues_finder
-    @issues_finder ||= issuable_finder_for(IssuesFinder)
+    if params[:author_id].present?
+      author = User.find_by_id(params[:author_id])
+      @users.push(author) if author
+    end
   end
+  # rubocop:enable Cop/ModuleWithInstanceVariables
 
-  def merge_requests_finder
-    @merge_requests_finder ||= issuable_finder_for(MergeRequestsFinder)
+  def issuables_collection
+    finder.execute.preload(preload_for_collection)
   end
 
-  def redirect_out_of_range(relation, total_pages)
+  def redirect_out_of_range(total_pages)
     return false if total_pages.zero?
 
-    out_of_range = relation.current_page > total_pages
+    out_of_range = @issuables.current_page > total_pages
 
     if out_of_range
       redirect_to(url_for(params.merge(page: total_pages, only_path: true)))
@@ -66,12 +52,8 @@ module IssuableCollections
     out_of_range
   end
 
-  def issues_page_count(relation)
-    page_count_for_relation(relation, issues_finder.row_count)
-  end
-
-  def merge_requests_page_count(relation)
-    page_count_for_relation(relation, merge_requests_finder.row_count)
+  def issuable_page_count
+    page_count_for_relation(@issuables, finder.row_count)
   end
 
   def page_count_for_relation(relation, row_count)
@@ -149,4 +131,31 @@ module IssuableCollections
     else value
     end
   end
+
+  def finder
+    return @finder if defined?(@finder)
+
+    @finder = issuable_finder_for(@finder_type)
+  end
+
+  def collection_type
+    @collection_type ||= case finder
+                         when IssuesFinder
+                           'Issue'
+                         when MergeRequestsFinder
+                           'MergeRequest'
+                         end
+  end
+
+  def preload_for_collection
+    @preload_for_collection ||= case collection_type
+                                when 'Issue'
+                                  [:project, :author, :assignees, :labels, :milestone, project: :namespace]
+                                when 'MergeRequest'
+                                  [
+                                    :source_project, :target_project, :author, :assignee, :labels, :milestone,
+                                    head_pipeline: :project, target_project: :namespace, merge_request_diff: :merge_request_diff_commits
+                                  ]
+                                end
+  end
 end
diff --git a/app/controllers/concerns/issues_action.rb b/app/controllers/concerns/issues_action.rb
index b6803b14fe1..4423c7fa0aa 100644
--- a/app/controllers/concerns/issues_action.rb
+++ b/app/controllers/concerns/issues_action.rb
@@ -4,14 +4,14 @@ module IssuesAction
 
   # rubocop:disable Cop/ModuleWithInstanceVariables
   def issues
-    @label = issues_finder.labels.first
+    @finder_type = IssuesFinder
+    @label = finder.labels.first
 
-    @issues = issues_collection
+    @issues = issuables_collection
               .non_archived
               .page(params[:page])
 
-    @collection_type    = "Issue"
-    @issuable_meta_data = issuable_meta_data(@issues, @collection_type)
+    @issuable_meta_data = issuable_meta_data(@issues, collection_type)
 
     respond_to do |format|
       format.html
diff --git a/app/controllers/concerns/lfs_request.rb b/app/controllers/concerns/lfs_request.rb
index 738afd612f0..4311f9d4db9 100644
--- a/app/controllers/concerns/lfs_request.rb
+++ b/app/controllers/concerns/lfs_request.rb
@@ -74,8 +74,9 @@ module LfsRequest
 
   def lfs_upload_access?
     return false unless project.lfs_enabled?
+    return false unless has_authentication_ability?(:push_code)
 
-    has_authentication_ability?(:push_code) && can?(user, :push_code, project)
+    lfs_deploy_token? || can?(user, :push_code, project)
   end
 
   def lfs_deploy_token?
@@ -91,15 +92,7 @@ module LfsRequest
   end
 
   def storage_project
-    @storage_project ||= begin
-      result = project
-
-      # TODO: Make this go to the fork_network root immeadiatly
-      # dependant on the discussion in: https://gitlab.com/gitlab-org/gitlab-ce/issues/39769
-      result = result.fork_source while result.forked?
-
-      result
-    end
+    @storage_project ||= project.lfs_storage_project
   end
 
   def objects
diff --git a/app/controllers/concerns/merge_requests_action.rb b/app/controllers/concerns/merge_requests_action.rb
index 20190fa256b..de1710e7161 100644
--- a/app/controllers/concerns/merge_requests_action.rb
+++ b/app/controllers/concerns/merge_requests_action.rb
@@ -4,13 +4,12 @@ module MergeRequestsAction
 
   # rubocop:disable Cop/ModuleWithInstanceVariables
   def merge_requests
-    @label = merge_requests_finder.labels.first
+    @finder_type = MergeRequestsFinder
+    @label = finder.labels.first
 
-    @merge_requests = merge_requests_collection
-                      .page(params[:page])
+    @merge_requests = issuables_collection.page(params[:page])
 
-    @collection_type    = "MergeRequest"
-    @issuable_meta_data = issuable_meta_data(@merge_requests, @collection_type)
+    @issuable_meta_data = issuable_meta_data(@merge_requests, collection_type)
   end
   # rubocop:enable Cop/ModuleWithInstanceVariables
 
diff --git a/app/controllers/concerns/notes_actions.rb b/app/controllers/concerns/notes_actions.rb
index be6062c7d55..be153d9fdbd 100644
--- a/app/controllers/concerns/notes_actions.rb
+++ b/app/controllers/concerns/notes_actions.rb
@@ -5,7 +5,7 @@ module NotesActions
 
   included do
     before_action :set_polling_interval_header, only: [:index]
-    before_action :noteable, only: :index
+    before_action :require_noteable!, only: [:index, :create]
     before_action :authorize_admin_note!, only: [:update, :destroy]
     before_action :note_project, only: [:create]
   end
@@ -40,7 +40,7 @@ module NotesActions
     @note = Notes::CreateService.new(note_project, current_user, create_params).execute
 
     if @note.is_a?(Note)
-      Banzai::NoteRenderer.render([@note], @project, current_user)
+      Notes::RenderService.new(current_user).execute([@note], @project)
     end
 
     respond_to do |format|
@@ -53,7 +53,7 @@ module NotesActions
     @note = Notes::UpdateService.new(project, current_user, note_params).execute(note)
 
     if @note.is_a?(Note)
-      Banzai::NoteRenderer.render([@note], @project, current_user)
+      Notes::RenderService.new(current_user).execute([@note], @project)
     end
 
     respond_to do |format|
@@ -91,7 +91,7 @@ module NotesActions
     if note.persisted?
       attrs[:valid] = true
 
-      if noteable.nil? || noteable.discussions_rendered_on_frontend?
+      if noteable.discussions_rendered_on_frontend?
         attrs.merge!(note_serializer.represent(note))
       else
         attrs.merge!(
@@ -192,7 +192,11 @@ module NotesActions
   end
 
   def noteable
-    @noteable ||= notes_finder.target || render_404
+    @noteable ||= notes_finder.target || @note&.noteable
+  end
+
+  def require_noteable!
+    render_404 unless noteable
   end
 
   def last_fetched_at
diff --git a/app/controllers/concerns/renders_notes.rb b/app/controllers/concerns/renders_notes.rb
index 4185396e24b..754e88660bf 100644
--- a/app/controllers/concerns/renders_notes.rb
+++ b/app/controllers/concerns/renders_notes.rb
@@ -4,7 +4,7 @@ module RendersNotes
     preload_noteable_for_regular_notes(notes)
     preload_max_access_for_authors(notes, @project)
     preload_first_time_contribution_for_authors(noteable, notes)
-    Banzai::NoteRenderer.render(notes, @project, current_user)
+    Notes::RenderService.new(current_user).execute(notes, @project)
 
     notes
   end
diff --git a/app/controllers/dashboard/projects_controller.rb b/app/controllers/dashboard/projects_controller.rb
index cd94a36a6e7..d9884a47ec4 100644
--- a/app/controllers/dashboard/projects_controller.rb
+++ b/app/controllers/dashboard/projects_controller.rb
@@ -57,5 +57,7 @@ class Dashboard::ProjectsController < Dashboard::ApplicationController
     @events = EventCollection
       .new(projects, offset: params[:offset].to_i, filter: event_filter)
       .to_a
+
+    Events::RenderService.new(current_user).execute(@events, atom_request: request.format.atom?)
   end
 end
diff --git a/app/controllers/dashboard/todos_controller.rb b/app/controllers/dashboard/todos_controller.rb
index 02c5857eea7..e89eaf7edda 100644
--- a/app/controllers/dashboard/todos_controller.rb
+++ b/app/controllers/dashboard/todos_controller.rb
@@ -76,7 +76,7 @@ class Dashboard::TodosController < Dashboard::ApplicationController
   def redirect_out_of_range(todos)
     total_pages =
       if todo_params.except(:sort, :page).empty?
-        (current_user.todos_pending_count / todos.limit_value).ceil
+        (current_user.todos_pending_count.to_f / todos.limit_value).ceil
       else
         todos.total_pages
       end
diff --git a/app/controllers/dashboard_controller.rb b/app/controllers/dashboard_controller.rb
index 19a5db6fd17..280ed93faf8 100644
--- a/app/controllers/dashboard_controller.rb
+++ b/app/controllers/dashboard_controller.rb
@@ -32,6 +32,8 @@ class DashboardController < Dashboard::ApplicationController
     @events = EventCollection
       .new(projects, offset: params[:offset].to_i, filter: @event_filter)
       .to_a
+
+    Events::RenderService.new(current_user).execute(@events)
   end
 
   def set_show_full_reference
diff --git a/app/controllers/groups_controller.rb b/app/controllers/groups_controller.rb
index bc3e95f1aed..eb53a522f90 100644
--- a/app/controllers/groups_controller.rb
+++ b/app/controllers/groups_controller.rb
@@ -155,6 +155,8 @@ class GroupsController < Groups::ApplicationController
     @events = EventCollection
       .new(@projects, offset: params[:offset].to_i, filter: event_filter)
       .to_a
+
+    Events::RenderService.new(current_user).execute(@events, atom_request: request.format.atom?)
   end
 
   def user_actions
diff --git a/app/controllers/import/github_controller.rb b/app/controllers/import/github_controller.rb
index ab18d86dcae..b8ba7921613 100644
--- a/app/controllers/import/github_controller.rb
+++ b/app/controllers/import/github_controller.rb
@@ -43,7 +43,7 @@ class Import::GithubController < Import::BaseController
     @target_namespace = find_or_create_namespace(namespace_path, current_user.namespace_path)
 
     if can?(current_user, :create_projects, @target_namespace)
-      @project = Gitlab::GithubImport::ProjectCreator.new(repo, @project_name, @target_namespace, current_user, access_params, type: provider).execute
+      @project = Gitlab::LegacyGithubImport::ProjectCreator.new(repo, @project_name, @target_namespace, current_user, access_params, type: provider).execute
     else
       render 'unauthorized'
     end
@@ -52,7 +52,7 @@ class Import::GithubController < Import::BaseController
   private
 
   def client
-    @client ||= Gitlab::GithubImport::Client.new(session[access_token_key], client_options)
+    @client ||= Gitlab::LegacyGithubImport::Client.new(session[access_token_key], client_options)
   end
 
   def verify_import_enabled
diff --git a/app/controllers/metrics_controller.rb b/app/controllers/metrics_controller.rb
index 37587a52eaf..d81ad135198 100644
--- a/app/controllers/metrics_controller.rb
+++ b/app/controllers/metrics_controller.rb
@@ -3,10 +3,16 @@ class MetricsController < ActionController::Base
 
   protect_from_forgery with: :exception
 
-  before_action :validate_prometheus_metrics
-
   def index
-    render text: metrics_service.metrics_text, content_type: 'text/plain; version=0.0.4'
+    response = if Gitlab::Metrics.prometheus_metrics_enabled?
+                 metrics_service.metrics_text
+               else
+                 help_page = help_page_url('administration/monitoring/prometheus/gitlab_metrics',
+                                           anchor: 'gitlab-prometheus-metrics'
+                                          )
+                 "# Metrics are disabled, see: #{help_page}\n"
+               end
+    render text: response, content_type: 'text/plain; version=0.0.4'
   end
 
   private
@@ -14,8 +20,4 @@ class MetricsController < ActionController::Base
   def metrics_service
     @metrics_service ||= MetricsService.new
   end
-
-  def validate_prometheus_metrics
-    render_404 unless Gitlab::Metrics.prometheus_metrics_enabled?
-  end
 end
diff --git a/app/controllers/projects/clusters/applications_controller.rb b/app/controllers/projects/clusters/applications_controller.rb
new file mode 100644
index 00000000000..90c7fa62216
--- /dev/null
+++ b/app/controllers/projects/clusters/applications_controller.rb
@@ -0,0 +1,25 @@
+class Projects::Clusters::ApplicationsController < Projects::ApplicationController
+  before_action :cluster
+  before_action :application_class, only: [:create]
+  before_action :authorize_read_cluster!
+  before_action :authorize_create_cluster!, only: [:create]
+
+  def create
+    Clusters::Applications::ScheduleInstallationService.new(project, current_user,
+                                                            application_class: @application_class,
+                                                            cluster: @cluster).execute
+    head :no_content
+  rescue StandardError
+    head :bad_request
+  end
+
+  private
+
+  def cluster
+    @cluster ||= project.clusters.find(params[:id]) || render_404
+  end
+
+  def application_class
+    @application_class ||= Clusters::Cluster::APPLICATIONS[params[:application]] || render_404
+  end
+end
diff --git a/app/controllers/projects/clusters_controller.rb b/app/controllers/projects/clusters_controller.rb
index 03019b0becc..9a56c9de858 100644
--- a/app/controllers/projects/clusters_controller.rb
+++ b/app/controllers/projects/clusters_controller.rb
@@ -1,8 +1,8 @@
 class Projects::ClustersController < Projects::ApplicationController
-  before_action :cluster, except: [:login, :index, :new, :create]
+  before_action :cluster, except: [:login, :index, :new, :new_gcp, :create]
   before_action :authorize_read_cluster!
-  before_action :authorize_create_cluster!, only: [:new, :create]
-  before_action :authorize_google_api, only: [:new, :create]
+  before_action :authorize_create_cluster!, only: [:new, :new_gcp, :create]
+  before_action :authorize_google_api, only: [:new_gcp, :create]
   before_action :authorize_update_cluster!, only: [:update]
   before_action :authorize_admin_cluster!, only: [:destroy]
 
@@ -16,7 +16,7 @@ class Projects::ClustersController < Projects::ApplicationController
 
   def login
     begin
-      state = generate_session_key_redirect(namespace_project_clusters_url.to_s)
+      state = generate_session_key_redirect(providers_gcp_new_namespace_project_clusters_url.to_s)
 
       @authorize_url = GoogleApi::CloudPlatform::Client.new(
         nil, callback_google_api_auth_url,
@@ -27,18 +27,23 @@ class Projects::ClustersController < Projects::ApplicationController
   end
 
   def new
-    @cluster = project.build_cluster
+  end
+
+  def new_gcp
+    @cluster = Clusters::Cluster.new.tap do |cluster|
+      cluster.build_provider_gcp
+    end
   end
 
   def create
-    @cluster = Ci::CreateClusterService
+    @cluster = Clusters::CreateService
       .new(project, current_user, create_params)
       .execute(token_in_session)
 
     if @cluster.persisted?
       redirect_to project_cluster_path(project, @cluster)
     else
-      render :new
+      render :new_gcp
     end
   end
 
@@ -58,7 +63,7 @@ class Projects::ClustersController < Projects::ApplicationController
   end
 
   def update
-    Ci::UpdateClusterService
+    Clusters::UpdateService
       .new(project, current_user, update_params)
       .execute(cluster)
 
@@ -88,19 +93,19 @@ class Projects::ClustersController < Projects::ApplicationController
 
   def create_params
     params.require(:cluster).permit(
-      :gcp_project_id,
-      :gcp_cluster_zone,
-      :gcp_cluster_name,
-      :gcp_cluster_size,
-      :gcp_machine_type,
-      :project_namespace,
-      :enabled)
+      :enabled,
+      :name,
+      :provider_type,
+      provider_gcp_attributes: [
+        :gcp_project_id,
+        :zone,
+        :num_nodes,
+        :machine_type
+      ])
   end
 
   def update_params
-    params.require(:cluster).permit(
-      :project_namespace,
-      :enabled)
+    params.require(:cluster).permit(:enabled)
   end
 
   def authorize_google_api
diff --git a/app/controllers/projects/commit_controller.rb b/app/controllers/projects/commit_controller.rb
index a62f05db7db..494d412b532 100644
--- a/app/controllers/projects/commit_controller.rb
+++ b/app/controllers/projects/commit_controller.rb
@@ -16,6 +16,8 @@ class Projects::CommitController < Projects::ApplicationController
   before_action :define_note_vars, only: [:show, :diff_for_path]
   before_action :authorize_edit_tree!, only: [:revert, :cherry_pick]
 
+  BRANCH_SEARCH_LIMIT = 1000
+
   def show
     apply_diff_view_cookie!
 
@@ -56,8 +58,14 @@ class Projects::CommitController < Projects::ApplicationController
   end
 
   def branches
-    @branches = @project.repository.branch_names_contains(commit.id)
-    @tags = @project.repository.tag_names_contains(commit.id)
+    # branch_names_contains/tag_names_contains can take a long time when there are thousands of
+    # branches/tags - each `git branch --contains xxx` request can consume a cpu core.
+    # so only do the query when there are a manageable number of branches/tags
+    @branches_limit_exceeded = @project.repository.branch_count > BRANCH_SEARCH_LIMIT
+    @branches = @branches_limit_exceeded ? [] : @project.repository.branch_names_contains(commit.id)
+
+    @tags_limit_exceeded = @project.repository.tag_count > BRANCH_SEARCH_LIMIT
+    @tags = @tags_limit_exceeded ? [] : @project.repository.tag_names_contains(commit.id)
     render layout: false
   end
 
diff --git a/app/controllers/projects/commits_controller.rb b/app/controllers/projects/commits_controller.rb
index d48284a4429..28920877635 100644
--- a/app/controllers/projects/commits_controller.rb
+++ b/app/controllers/projects/commits_controller.rb
@@ -10,9 +10,6 @@ class Projects::CommitsController < Projects::ApplicationController
   before_action :set_commits
 
   def show
-    @note_counts = project.notes.where(commit_id: @commits.map(&:id))
-      .group(:commit_id).count
-
     @merge_request = MergeRequestsFinder.new(current_user, project_id: @project.id).execute.opened
       .find_by(source_project: @project, source_branch: @ref, target_branch: @repository.root_ref)
 
diff --git a/app/controllers/projects/issues_controller.rb b/app/controllers/projects/issues_controller.rb
index d4e763aa5b8..dbc9106ba6d 100644
--- a/app/controllers/projects/issues_controller.rb
+++ b/app/controllers/projects/issues_controller.rb
@@ -10,7 +10,7 @@ class Projects::IssuesController < Projects::ApplicationController
 
   before_action :check_issues_available!
   before_action :issue, except: [:index, :new, :create, :bulk_update]
-  before_action :set_issues_index, only: [:index]
+  before_action :set_issuables_index, only: [:index]
 
   # Allow write(create) issue
   before_action :authorize_create_issue!, only: [:new, :create]
@@ -24,15 +24,7 @@ class Projects::IssuesController < Projects::ApplicationController
   respond_to :html
 
   def index
-    if params[:assignee_id].present?
-      assignee = User.find_by_id(params[:assignee_id])
-      @users.push(assignee) if assignee
-    end
-
-    if params[:author_id].present?
-      author = User.find_by_id(params[:author_id])
-      @users.push(author) if author
-    end
+    @issues = @issuables
 
     respond_to do |format|
       format.html
@@ -252,4 +244,9 @@ class Projects::IssuesController < Projects::ApplicationController
     update_params = issue_params.merge(spammable_params)
     Issues::UpdateService.new(project, current_user, update_params)
   end
+
+  def set_issuables_index
+    @finder_type = IssuesFinder
+    super
+  end
 end
diff --git a/app/controllers/projects/jobs_controller.rb b/app/controllers/projects/jobs_controller.rb
index 1b985ea9763..1c4c09c772f 100644
--- a/app/controllers/projects/jobs_controller.rb
+++ b/app/controllers/projects/jobs_controller.rb
@@ -4,7 +4,8 @@ class Projects::JobsController < Projects::ApplicationController
   before_action :authorize_read_build!,
     only: [:index, :show, :status, :raw, :trace]
   before_action :authorize_update_build!,
-    except: [:index, :show, :status, :raw, :trace, :cancel_all]
+    except: [:index, :show, :status, :raw, :trace, :cancel_all, :erase]
+  before_action :authorize_erase_build!, only: [:erase]
 
   layout 'project'
 
@@ -131,6 +132,10 @@ class Projects::JobsController < Projects::ApplicationController
     return access_denied! unless can?(current_user, :update_build, build)
   end
 
+  def authorize_erase_build!
+    return access_denied! unless can?(current_user, :erase_build, build)
+  end
+
   def build
     @build ||= project.builds.find(params[:id])
       .present(current_user: current_user)
diff --git a/app/controllers/projects/merge_requests/application_controller.rb b/app/controllers/projects/merge_requests/application_controller.rb
index 0e71977a58a..1269759fc2b 100644
--- a/app/controllers/projects/merge_requests/application_controller.rb
+++ b/app/controllers/projects/merge_requests/application_controller.rb
@@ -2,7 +2,6 @@ class Projects::MergeRequests::ApplicationController < Projects::ApplicationCont
   before_action :check_merge_requests_available!
   before_action :merge_request
   before_action :authorize_read_merge_request!
-  before_action :ensure_ref_fetched
 
   private
 
@@ -10,12 +9,6 @@ class Projects::MergeRequests::ApplicationController < Projects::ApplicationCont
     @issuable = @merge_request ||= @project.merge_requests.find_by!(iid: params[:id])
   end
 
-  # Make sure merge requests created before 8.0
-  # have head file in refs/merge-requests/
-  def ensure_ref_fetched
-    @merge_request.ensure_ref_fetched if Gitlab::Database.read_write?
-  end
-
   def merge_request_params
     params.require(:merge_request).permit(merge_request_params_attributes)
   end
diff --git a/app/controllers/projects/merge_requests/creations_controller.rb b/app/controllers/projects/merge_requests/creations_controller.rb
index 99dc3dda9e7..764a9c7111e 100644
--- a/app/controllers/projects/merge_requests/creations_controller.rb
+++ b/app/controllers/projects/merge_requests/creations_controller.rb
@@ -4,7 +4,6 @@ class Projects::MergeRequests::CreationsController < Projects::MergeRequests::Ap
   include RendersCommits
 
   skip_before_action :merge_request
-  skip_before_action :ensure_ref_fetched
   before_action :authorize_create_merge_request!
   before_action :apply_diff_view_cookie!, only: [:diffs, :diff_for_path]
   before_action :build_merge_request, except: [:create]
@@ -111,9 +110,6 @@ class Projects::MergeRequests::CreationsController < Projects::MergeRequests::Ap
     @commits = prepare_commits_for_rendering(@merge_request.commits)
     @commit = @merge_request.diff_head_commit
 
-    @note_counts = Note.where(commit_id: @commits.map(&:id))
-      .group(:commit_id).count
-
     @labels = LabelsFinder.new(current_user, project_id: @project.id).execute
 
     set_pipeline_variables
diff --git a/app/controllers/projects/merge_requests_controller.rb b/app/controllers/projects/merge_requests_controller.rb
index 17cac69e588..22de6680511 100644
--- a/app/controllers/projects/merge_requests_controller.rb
+++ b/app/controllers/projects/merge_requests_controller.rb
@@ -7,37 +7,15 @@ class Projects::MergeRequestsController < Projects::MergeRequests::ApplicationCo
   include IssuableCollections
 
   skip_before_action :merge_request, only: [:index, :bulk_update]
-  skip_before_action :ensure_ref_fetched, only: [:index, :bulk_update]
 
   before_action :authorize_update_issuable!, only: [:close, :edit, :update, :remove_wip, :sort]
 
+  before_action :set_issuables_index, only: [:index]
+
   before_action :authenticate_user!, only: [:assign_related_issues]
 
   def index
-    @collection_type    = "MergeRequest"
-    @merge_requests     = merge_requests_collection
-    @merge_requests     = @merge_requests.page(params[:page])
-    @merge_requests     = @merge_requests.preload(merge_request_diff: :merge_request)
-    @issuable_meta_data = issuable_meta_data(@merge_requests, @collection_type)
-    @total_pages        = merge_requests_page_count(@merge_requests)
-
-    return if redirect_out_of_range(@merge_requests, @total_pages)
-
-    if params[:label_name].present?
-      labels_params = { project_id: @project.id, title: params[:label_name] }
-      @labels = LabelsFinder.new(current_user, labels_params).execute
-    end
-
-    @users = []
-    if params[:assignee_id].present?
-      assignee = User.find_by_id(params[:assignee_id])
-      @users.push(assignee) if assignee
-    end
-
-    if params[:author_id].present?
-      author = User.find_by_id(params[:author_id])
-      @users.push(author) if author
-    end
+    @merge_requests = @issuables
 
     respond_to do |format|
       format.html
@@ -52,7 +30,6 @@ class Projects::MergeRequestsController < Projects::MergeRequests::ApplicationCo
 
   def show
     validates_merge_request
-    ensure_ref_fetched
     close_merge_request_without_source_project
     check_if_can_be_merged
 
@@ -104,8 +81,6 @@ class Projects::MergeRequestsController < Projects::MergeRequests::ApplicationCo
     # Get commits from repository
     # or from cache if already merged
     @commits = prepare_commits_for_rendering(@merge_request.commits)
-    @note_counts = Note.where(commit_id: @commits.map(&:id))
-      .group(:commit_id).count
 
     render json: { html: view_to_html_string('projects/merge_requests/_commits') }
   end
@@ -340,4 +315,9 @@ class Projects::MergeRequestsController < Projects::MergeRequests::ApplicationCo
     @target_project = @merge_request.target_project
     @target_branches = @merge_request.target_project.repository.branch_names
   end
+
+  def set_issuables_index
+    @finder_type = MergeRequestsFinder
+    super
+  end
 end
diff --git a/app/controllers/projects/refs_controller.rb b/app/controllers/projects/refs_controller.rb
index 2fd015df688..2376f469213 100644
--- a/app/controllers/projects/refs_controller.rb
+++ b/app/controllers/projects/refs_controller.rb
@@ -56,9 +56,12 @@ class Projects::RefsController < Projects::ApplicationController
       contents[@offset, @limit].to_a.map do |content|
         file = @path ? File.join(@path, content.name) : content.name
         last_commit = @repo.last_commit_for_path(@commit.id, file)
+        commit_path = project_commit_path(@project, last_commit) if last_commit
         {
           file_name: content.name,
-          commit: last_commit
+          commit: last_commit,
+          type: content.type,
+          commit_path: commit_path
         }
       end
     end
@@ -70,6 +73,11 @@ class Projects::RefsController < Projects::ApplicationController
 
     respond_to do |format|
       format.html { render_404 }
+      format.json do
+        response.headers["More-Logs-Url"] = @more_log_url
+
+        render json: @logs
+      end
       format.js
     end
   end
diff --git a/app/controllers/projects_controller.rb b/app/controllers/projects_controller.rb
index db543d688a0..2a473ec0cec 100644
--- a/app/controllers/projects_controller.rb
+++ b/app/controllers/projects_controller.rb
@@ -275,7 +275,8 @@ class ProjectsController < Projects::ApplicationController
         @project_wiki = @project.wiki
         @wiki_home = @project_wiki.find_page('home', params[:version_id])
       elsif @project.feature_available?(:issues, current_user)
-        @issues = issues_collection.page(params[:page])
+        @finder_type = IssuesFinder
+        @issues = issuables_collection.page(params[:page])
         @collection_type = 'Issue'
         @issuable_meta_data = issuable_meta_data(@issues, @collection_type)
       end
@@ -300,6 +301,8 @@ class ProjectsController < Projects::ApplicationController
     @events = EventCollection
       .new(projects, offset: params[:offset].to_i, filter: event_filter)
       .to_a
+
+    Events::RenderService.new(current_user).execute(@events, atom_request: request.format.atom?)
   end
 
   def project_params
diff --git a/app/controllers/snippets/notes_controller.rb b/app/controllers/snippets/notes_controller.rb
index f9496787b15..c8b4682e6dc 100644
--- a/app/controllers/snippets/notes_controller.rb
+++ b/app/controllers/snippets/notes_controller.rb
@@ -20,6 +20,7 @@ class Snippets::NotesController < ApplicationController
   def snippet
     PersonalSnippet.find_by(id: params[:snippet_id])
   end
+  alias_method :noteable, :snippet
 
   def note_params
     super.merge(noteable_id: params[:snippet_id])
diff --git a/app/controllers/users_controller.rb b/app/controllers/users_controller.rb
index 4ee855806ab..5fca31b4956 100644
--- a/app/controllers/users_controller.rb
+++ b/app/controllers/users_controller.rb
@@ -108,6 +108,8 @@ class UsersController < ApplicationController
       .references(:project)
       .with_associations
       .limit_recent(20, params[:offset])
+
+    Events::RenderService.new(current_user).execute(@events, atom_request: request.format.atom?)
   end
 
   def load_projects
diff --git a/app/finders/autocomplete_users_finder.rb b/app/finders/autocomplete_users_finder.rb
index b8f52e31926..c3f5358b577 100644
--- a/app/finders/autocomplete_users_finder.rb
+++ b/app/finders/autocomplete_users_finder.rb
@@ -45,7 +45,7 @@ class AutocompleteUsersFinder
 
   def find_users
     return users_from_project if project
-    return group.users if group
+    return group.users_with_parents if group
     return User.all if current_user
 
     User.none
diff --git a/app/finders/groups_finder.rb b/app/finders/groups_finder.rb
index 0c4c4b10fb6..0282b378d88 100644
--- a/app/finders/groups_finder.rb
+++ b/app/finders/groups_finder.rb
@@ -15,6 +15,8 @@
 # Anonymous users will never return any `owned` groups. They will return all
 # public groups instead, even if `all_available` is set to false.
 class GroupsFinder < UnionFinder
+  include CustomAttributesFilter
+
   def initialize(current_user = nil, params = {})
     @current_user = current_user
     @params = params
@@ -22,8 +24,12 @@ class GroupsFinder < UnionFinder
 
   def execute
     items = all_groups.map do |item|
-      by_parent(item)
+      item = by_parent(item)
+      item = by_custom_attributes(item)
+
+      item
     end
+
     find_union(items, Group).with_route.order_id_desc
   end
 
diff --git a/app/finders/issuable_finder.rb b/app/finders/issuable_finder.rb
index 24c07f3dc70..b46ec5e5350 100644
--- a/app/finders/issuable_finder.rb
+++ b/app/finders/issuable_finder.rb
@@ -36,6 +36,7 @@ class IssuableFinder
     iids
     label_name
     milestone_title
+    my_reaction_emoji
     non_archived
     project_id
     scope
diff --git a/app/finders/projects_finder.rb b/app/finders/projects_finder.rb
index eac6095d8dc..005612ededc 100644
--- a/app/finders/projects_finder.rb
+++ b/app/finders/projects_finder.rb
@@ -18,6 +18,8 @@
 #     non_archived: boolean
 #
 class ProjectsFinder < UnionFinder
+  include CustomAttributesFilter
+
   attr_accessor :params
   attr_reader :current_user, :project_ids_relation
 
@@ -44,6 +46,7 @@ class ProjectsFinder < UnionFinder
     collection = by_tags(collection)
     collection = by_search(collection)
     collection = by_archived(collection)
+    collection = by_custom_attributes(collection)
 
     sort(collection)
   end
diff --git a/app/helpers/appearances_helper.rb b/app/helpers/appearances_helper.rb
index 8ad94d3f723..df590cf47c8 100644
--- a/app/helpers/appearances_helper.rb
+++ b/app/helpers/appearances_helper.rb
@@ -30,4 +30,11 @@ module AppearancesHelper
       render 'shared/logo.svg'
     end
   end
+
+  # Skip the 'GitLab' type logo when custom brand logo is set
+  def brand_header_logo_type
+    unless brand_item && brand_item.header_logo?
+      render 'shared/logo_type.svg'
+    end
+  end
 end
diff --git a/app/helpers/boards_helper.rb b/app/helpers/boards_helper.rb
index 7112c6ee470..c4a621160af 100644
--- a/app/helpers/boards_helper.rb
+++ b/app/helpers/boards_helper.rb
@@ -20,17 +20,6 @@ module BoardsHelper
     project_issues_path(@project)
   end
 
-  def current_board_json
-    board = @board || @boards.first
-
-    board.to_json(
-      only: [:id, :name, :milestone_id],
-      include: {
-        milestone: { only: [:title] }
-      }
-    )
-  end
-
   def board_base_url
     project_boards_path(@project)
   end
diff --git a/app/helpers/ci_status_helper.rb b/app/helpers/ci_status_helper.rb
index 4dd573c61f1..636316da80a 100644
--- a/app/helpers/ci_status_helper.rb
+++ b/app/helpers/ci_status_helper.rb
@@ -6,11 +6,6 @@
 # See 'detailed_status?` method and `Gitlab::Ci::Status` module.
 #
 module CiStatusHelper
-  def ci_status_path(pipeline)
-    project = pipeline.project
-    project_pipeline_path(project, pipeline)
-  end
-
   def ci_label_for_status(status)
     if detailed_status?(status)
       return status.label
diff --git a/app/helpers/commits_helper.rb b/app/helpers/commits_helper.rb
index ef22cafc2e2..f9a666fa1e6 100644
--- a/app/helpers/commits_helper.rb
+++ b/app/helpers/commits_helper.rb
@@ -60,23 +60,33 @@ module CommitsHelper
     branches.include?(project.default_branch) ? branches.delete(project.default_branch) : branches.pop
   end
 
+  # Returns a link formatted as a commit branch link
+  def commit_branch_link(url, text)
+    link_to(url, class: 'label label-gray ref-name branch-link') do
+      icon('code-fork') + " #{text}"
+    end
+  end
+
   # Returns the sorted alphabetically links to branches, separated by a comma
   def commit_branches_links(project, branches)
     branches.sort.map do |branch|
-      link_to(project_ref_path(project, branch), class: "label label-gray ref-name") do
-        icon('code-fork') + " #{branch}"
-      end
-    end.join(" ").html_safe
+      commit_branch_link(project_ref_path(project, branch), branch)
+    end.join(' ').html_safe
+  end
+
+  # Returns a link formatted as a commit tag link
+  def commit_tag_link(url, text)
+    link_to(url, class: 'label label-gray ref-name') do
+      icon('tag') + " #{text}"
+    end
   end
 
   # Returns the sorted links to tags, separated by a comma
   def commit_tags_links(project, tags)
     sorted = VersionSorter.rsort(tags)
     sorted.map do |tag|
-      link_to(project_ref_path(project, tag), class: "label label-gray ref-name") do
-        icon('tag') + " #{tag}"
-      end
-    end.join(" ").html_safe
+      commit_tag_link(project_ref_path(project, tag), tag)
+    end.join(' ').html_safe
   end
 
   def link_to_browse_code(project, commit)
diff --git a/app/helpers/events_helper.rb b/app/helpers/events_helper.rb
index fd88e0d794a..079b3cd3aa0 100644
--- a/app/helpers/events_helper.rb
+++ b/app/helpers/events_helper.rb
@@ -172,16 +172,6 @@ module EventsHelper
     end
   end
 
-  def event_note(text, options = {})
-    text = first_line_in_markdown(text, 150, options)
-
-    sanitize(
-      text,
-      tags: %w(a img gl-emoji b pre code p span),
-      attributes: Rails::Html::WhiteListSanitizer.allowed_attributes + ['style', 'data-src', 'data-name', 'data-unicode-version']
-    )
-  end
-
   def event_commit_title(message)
     message ||= ''
     (message.split("\n").first || "").truncate(70)
diff --git a/app/helpers/icons_helper.rb b/app/helpers/icons_helper.rb
index ec779c1c447..c6a83f21ceb 100644
--- a/app/helpers/icons_helper.rb
+++ b/app/helpers/icons_helper.rb
@@ -23,10 +23,17 @@ module IconsHelper
     render "shared/icons/#{icon_name}.svg", size: size
   end
 
+  def sprite_icon_path
+    # SVG Sprites currently don't work across domains, so in the case of a CDN
+    # we have to set the current path deliberately to prevent addition of asset_host
+    sprite_base_url = Gitlab.config.gitlab.url if ActionController::Base.asset_host
+    ActionController::Base.helpers.image_path('icons.svg', host: sprite_base_url)
+  end
+
   def sprite_icon(icon_name, size: nil, css_class: nil)
     css_classes = size ? "s#{size}" : ""
     css_classes << " #{css_class}" unless css_class.blank?
-    content_tag(:svg, content_tag(:use, "", { "xlink:href" => "#{image_path('icons.svg')}##{icon_name}" } ), class: css_classes.empty? ? nil : css_classes)
+    content_tag(:svg, content_tag(:use, "", { "xlink:href" => "#{sprite_icon_path}##{icon_name}" } ), class: css_classes.empty? ? nil : css_classes)
   end
 
   def audit_icon(names, options = {})
diff --git a/app/helpers/issuables_helper.rb b/app/helpers/issuables_helper.rb
index 85407e38532..a9840d19178 100644
--- a/app/helpers/issuables_helper.rb
+++ b/app/helpers/issuables_helper.rb
@@ -249,8 +249,6 @@ module IssuablesHelper
   end
 
   def issuables_count_for_state(issuable_type, state)
-    finder = public_send("#{issuable_type}_finder") # rubocop:disable GitlabSecurity/PublicSend
-
     Gitlab::IssuablesCountForState.new(finder)[state]
   end
 
diff --git a/app/helpers/markup_helper.rb b/app/helpers/markup_helper.rb
index 420622399f3..2c85d7d7720 100644
--- a/app/helpers/markup_helper.rb
+++ b/app/helpers/markup_helper.rb
@@ -69,10 +69,16 @@ module MarkupHelper
   # as Markdown.  HTML tags in the parsed output are not counted toward the
   # +max_chars+ limit.  If the length limit falls within a tag's contents, then
   # the tag contents are truncated without removing the closing tag.
-  def first_line_in_markdown(text, max_chars = nil, options = {})
-    md = markdown(text, options).strip
+  def first_line_in_markdown(object, attribute, max_chars = nil, options = {})
+    md = markdown_field(object, attribute, options)
 
-    truncate_visible(md, max_chars || md.length) if md.present?
+    text = truncate_visible(md, max_chars || md.length) if md.present?
+
+    sanitize(
+      text,
+      tags: %w(a img gl-emoji b pre code p span),
+      attributes: Rails::Html::WhiteListSanitizer.allowed_attributes + ['style', 'data-src', 'data-name', 'data-unicode-version']
+    )
   end
 
   def markdown(text, context = {})
@@ -83,15 +89,17 @@ module MarkupHelper
     prepare_for_rendering(html, context)
   end
 
-  def markdown_field(object, field)
+  def markdown_field(object, field, context = {})
     object = object.for_display if object.respond_to?(:for_display)
     redacted_field_html = object.try(:"redacted_#{field}_html")
 
     return '' unless object.present?
     return redacted_field_html if redacted_field_html
 
-    html = Banzai.render_field(object, field)
-    prepare_for_rendering(html, object.banzai_render_context(field))
+    html = Banzai.render_field(object, field, context)
+    context.reverse_merge!(object.banzai_render_context(field)) if object.respond_to?(:banzai_render_context)
+
+    prepare_for_rendering(html, context)
   end
 
   def markup(file_name, text, context = {})
diff --git a/app/helpers/namespaces_helper.rb b/app/helpers/namespaces_helper.rb
index d7df9bb06d2..b78d3072186 100644
--- a/app/helpers/namespaces_helper.rb
+++ b/app/helpers/namespaces_helper.rb
@@ -4,8 +4,11 @@ module NamespacesHelper
   end
 
   def namespaces_options(selected = :current_user, display_path: false, extra_group: nil)
-    groups  = current_user.owned_groups + current_user.masters_groups
-    users   = [current_user.namespace]
+    groups = current_user.manageable_groups
+               .joins(:route)
+               .includes(:route)
+               .order('routes.path')
+    users = [current_user.namespace]
 
     unless extra_group.nil? || extra_group.is_a?(Group)
       extra_group = Group.find(extra_group) if Namespace.find(extra_group).kind == 'group'
diff --git a/app/helpers/tree_helper.rb b/app/helpers/tree_helper.rb
index c4ea0f5ac53..0e106e2c85d 100644
--- a/app/helpers/tree_helper.rb
+++ b/app/helpers/tree_helper.rb
@@ -1,14 +1,23 @@
 module TreeHelper
+  FILE_LIMIT = 1_000
+
   # Sorts a repository's tree so that folders are before files and renders
   # their corresponding partials
   #
-  # contents - A Grit::Tree object for the current tree
+  # tree - A `Tree` object for the current tree
   def render_tree(tree)
     # Sort submodules and folders together by name ahead of files
     folders, files, submodules = tree.trees, tree.blobs, tree.submodules
-    tree = ""
+    tree = ''
     items = (folders + submodules).sort_by(&:name) + files
-    tree << render(partial: "projects/tree/tree_row", collection: items) if items.present?
+
+    if items.size > FILE_LIMIT
+      tree << render(partial: 'projects/tree/truncated_notice_tree_row',
+                     locals: { limit: FILE_LIMIT, total: items.size })
+      items = items.take(FILE_LIMIT)
+    end
+
+    tree << render(partial: 'projects/tree/tree_row', collection: items) if items.present?
     tree.html_safe
   end
 
diff --git a/app/models/ci/build.rb b/app/models/ci/build.rb
index 6ca46ae89c1..1b2b0d17910 100644
--- a/app/models/ci/build.rb
+++ b/app/models/ci/build.rb
@@ -192,6 +192,10 @@ module Ci
       project.build_timeout
     end
 
+    def triggered_by?(current_user)
+      user == current_user
+    end
+
     # A slugified version of the build ref, suitable for inclusion in URLs and
     # domain names. Rules:
     #
diff --git a/app/models/ci/pipeline.rb b/app/models/ci/pipeline.rb
index ca65e81f27a..19814864e50 100644
--- a/app/models/ci/pipeline.rb
+++ b/app/models/ci/pipeline.rb
@@ -66,8 +66,8 @@ module Ci
 
     state_machine :status, initial: :created do
       event :enqueue do
-        transition created: :pending
-        transition [:success, :failed, :canceled, :skipped] => :running
+        transition [:created, :skipped] => :pending
+        transition [:success, :failed, :canceled] => :running
       end
 
       event :run do
@@ -409,7 +409,7 @@ module Ci
     end
 
     def notes
-      Note.for_commit_id(sha)
+      project.notes.for_commit_id(sha)
     end
 
     def process!
diff --git a/app/models/clusters/applications/helm.rb b/app/models/clusters/applications/helm.rb
new file mode 100644
index 00000000000..c7949d11ef8
--- /dev/null
+++ b/app/models/clusters/applications/helm.rb
@@ -0,0 +1,35 @@
+module Clusters
+  module Applications
+    class Helm < ActiveRecord::Base
+      self.table_name = 'clusters_applications_helm'
+
+      include ::Clusters::Concerns::ApplicationStatus
+
+      belongs_to :cluster, class_name: 'Clusters::Cluster', foreign_key: :cluster_id
+
+      default_value_for :version, Gitlab::Kubernetes::Helm::HELM_VERSION
+
+      validates :cluster, presence: true
+
+      after_initialize :set_initial_status
+
+      def self.application_name
+        self.to_s.demodulize.underscore
+      end
+
+      def set_initial_status
+        return unless not_installable?
+
+        self.status = 'installable' if cluster&.platform_kubernetes_active?
+      end
+
+      def name
+        self.class.application_name
+      end
+
+      def install_command
+        Gitlab::Kubernetes::Helm::InstallCommand.new(name, true)
+      end
+    end
+  end
+end
diff --git a/app/models/clusters/applications/ingress.rb b/app/models/clusters/applications/ingress.rb
new file mode 100644
index 00000000000..44bd979741e
--- /dev/null
+++ b/app/models/clusters/applications/ingress.rb
@@ -0,0 +1,44 @@
+module Clusters
+  module Applications
+    class Ingress < ActiveRecord::Base
+      self.table_name = 'clusters_applications_ingress'
+
+      include ::Clusters::Concerns::ApplicationStatus
+
+      belongs_to :cluster, class_name: 'Clusters::Cluster', foreign_key: :cluster_id
+
+      validates :cluster, presence: true
+
+      default_value_for :ingress_type, :nginx
+      default_value_for :version, :nginx
+
+      after_initialize :set_initial_status
+
+      enum ingress_type: {
+        nginx: 1
+      }
+
+      def self.application_name
+        self.to_s.demodulize.underscore
+      end
+
+      def set_initial_status
+        return unless not_installable?
+
+        self.status = 'installable' if cluster&.application_helm_installed?
+      end
+
+      def name
+        self.class.application_name
+      end
+
+      def chart
+        'stable/nginx-ingress'
+      end
+
+      def install_command
+        Gitlab::Kubernetes::Helm::InstallCommand.new(name, false, chart)
+      end
+    end
+  end
+end
diff --git a/app/models/clusters/cluster.rb b/app/models/clusters/cluster.rb
new file mode 100644
index 00000000000..185d9473aab
--- /dev/null
+++ b/app/models/clusters/cluster.rb
@@ -0,0 +1,102 @@
+module Clusters
+  class Cluster < ActiveRecord::Base
+    include Presentable
+
+    self.table_name = 'clusters'
+
+    APPLICATIONS = {
+      Applications::Helm.application_name => Applications::Helm,
+      Applications::Ingress.application_name => Applications::Ingress
+    }.freeze
+
+    belongs_to :user
+
+    has_many :cluster_projects, class_name: 'Clusters::Project'
+    has_many :projects, through: :cluster_projects, class_name: '::Project'
+
+    # we force autosave to happen when we save `Cluster` model
+    has_one :provider_gcp, class_name: 'Clusters::Providers::Gcp', autosave: true
+
+    # We have to ":destroy" it today to ensure that we clean also the Kubernetes Integration
+    has_one :platform_kubernetes, class_name: 'Clusters::Platforms::Kubernetes', autosave: true, dependent: :destroy # rubocop:disable Cop/ActiveRecordDependent
+
+    has_one :application_helm, class_name: 'Clusters::Applications::Helm'
+    has_one :application_ingress, class_name: 'Clusters::Applications::Ingress'
+
+    accepts_nested_attributes_for :provider_gcp, update_only: true
+    accepts_nested_attributes_for :platform_kubernetes, update_only: true
+
+    validates :name, cluster_name: true
+    validate :restrict_modification, on: :update
+
+    # TODO: Move back this into Clusters::Platforms::Kubernetes in 10.3
+    # We need callback here because `enabled` belongs to Clusters::Cluster
+    # Callbacks in Clusters::Platforms::Kubernetes will not be called after update
+    after_save :update_kubernetes_integration!
+
+    delegate :status, to: :provider, allow_nil: true
+    delegate :status_reason, to: :provider, allow_nil: true
+    delegate :on_creation?, to: :provider, allow_nil: true
+    delegate :update_kubernetes_integration!, to: :platform, allow_nil: true
+
+    delegate :active?, to: :platform_kubernetes, prefix: true, allow_nil: true
+    delegate :installed?, to: :application_helm, prefix: true, allow_nil: true
+
+    enum platform_type: {
+      kubernetes: 1
+    }
+
+    enum provider_type: {
+      user: 0,
+      gcp: 1
+    }
+
+    scope :enabled, -> { where(enabled: true) }
+    scope :disabled, -> { where(enabled: false) }
+
+    def status_name
+      if provider
+        provider.status_name
+      else
+        :created
+      end
+    end
+
+    def applications
+      [
+        application_helm || build_application_helm,
+        application_ingress || build_application_ingress
+      ]
+    end
+
+    def provider
+      return provider_gcp if gcp?
+    end
+
+    def platform
+      return platform_kubernetes if kubernetes?
+    end
+
+    def first_project
+      return @first_project if defined?(@first_project)
+
+      @first_project = projects.first
+    end
+    alias_method :project, :first_project
+
+    def kubeclient
+      platform_kubernetes.kubeclient if kubernetes?
+    end
+
+    private
+
+    def restrict_modification
+      if provider&.on_creation?
+        errors.add(:base, "cannot modify during creation")
+        return false
+      end
+
+      true
+    end
+  end
+end
diff --git a/app/models/clusters/concerns/application_status.rb b/app/models/clusters/concerns/application_status.rb
new file mode 100644
index 00000000000..7b7c8eac773
--- /dev/null
+++ b/app/models/clusters/concerns/application_status.rb
@@ -0,0 +1,43 @@
+module Clusters
+  module Concerns
+    module ApplicationStatus
+      extend ActiveSupport::Concern
+
+      included do
+        state_machine :status, initial: :not_installable do
+          state :not_installable, value: -2
+          state :errored, value: -1
+          state :installable, value: 0
+          state :scheduled, value: 1
+          state :installing, value: 2
+          state :installed, value: 3
+
+          event :make_scheduled do
+            transition [:installable, :errored] => :scheduled
+          end
+
+          event :make_installing do
+            transition [:scheduled] => :installing
+          end
+
+          event :make_installed do
+            transition [:installing] => :installed
+          end
+
+          event :make_errored do
+            transition any => :errored
+          end
+
+          before_transition any => [:scheduled] do |app_status, _|
+            app_status.status_reason = nil
+          end
+
+          before_transition any => [:errored] do |app_status, transition|
+            status_reason = transition.args.first
+            app_status.status_reason = status_reason if status_reason
+          end
+        end
+      end
+    end
+  end
+end
diff --git a/app/models/clusters/platforms/kubernetes.rb b/app/models/clusters/platforms/kubernetes.rb
new file mode 100644
index 00000000000..6dc1ee810d3
--- /dev/null
+++ b/app/models/clusters/platforms/kubernetes.rb
@@ -0,0 +1,109 @@
+module Clusters
+  module Platforms
+    class Kubernetes < ActiveRecord::Base
+      self.table_name = 'cluster_platforms_kubernetes'
+
+      belongs_to :cluster, inverse_of: :platform_kubernetes, class_name: 'Clusters::Cluster'
+
+      attr_encrypted :password,
+        mode: :per_attribute_iv,
+        key: Gitlab::Application.secrets.db_key_base,
+        algorithm: 'aes-256-cbc'
+
+      attr_encrypted :token,
+        mode: :per_attribute_iv,
+        key: Gitlab::Application.secrets.db_key_base,
+        algorithm: 'aes-256-cbc'
+
+      before_validation :enforce_namespace_to_lower_case
+
+      validates :namespace,
+        allow_blank: true,
+        length: 1..63,
+        format: {
+          with: Gitlab::Regex.kubernetes_namespace_regex,
+          message: Gitlab::Regex.kubernetes_namespace_regex_message
+        }
+
+      # We expect to be `active?` only when enabled and cluster is created (the api_url is assigned)
+      validates :api_url, url: true, presence: true
+      validates :token, presence: true
+
+      # TODO: Glue code till we migrate Kubernetes Integration into Platforms::Kubernetes
+      after_destroy :destroy_kubernetes_integration!
+
+      alias_attribute :ca_pem, :ca_cert
+
+      delegate :project, to: :cluster, allow_nil: true
+      delegate :enabled?, to: :cluster, allow_nil: true
+
+      class << self
+        def namespace_for_project(project)
+          "#{project.path}-#{project.id}"
+        end
+      end
+
+      def actual_namespace
+        if namespace.present?
+          namespace
+        else
+          default_namespace
+        end
+      end
+
+      def default_namespace
+        self.class.namespace_for_project(project) if project
+      end
+
+      def kubeclient
+        @kubeclient ||= kubernetes_service.kubeclient if manages_kubernetes_service?
+      end
+
+      def update_kubernetes_integration!
+        raise 'Kubernetes service already configured' unless manages_kubernetes_service?
+
+        # This is neccesary, otheriwse enabled? returns true even though cluster updated with enabled: false
+        cluster.reload
+
+        ensure_kubernetes_service&.update!(
+          active: enabled?,
+          api_url: api_url,
+          namespace: namespace,
+          token: token,
+          ca_pem: ca_cert
+        )
+      end
+
+      def active?
+        manages_kubernetes_service?
+      end
+
+      private
+
+      def enforce_namespace_to_lower_case
+        self.namespace = self.namespace&.downcase
+      end
+
+      # TODO: glue code till we migrate Kubernetes Service into Platforms::Kubernetes class
+      def manages_kubernetes_service?
+        return true unless kubernetes_service&.active?
+
+        kubernetes_service.api_url == api_url
+      end
+
+      def destroy_kubernetes_integration!
+        return unless manages_kubernetes_service?
+
+        kubernetes_service&.destroy!
+      end
+
+      def kubernetes_service
+        @kubernetes_service ||= project&.kubernetes_service
+      end
+
+      def ensure_kubernetes_service
+        @kubernetes_service ||= kubernetes_service || project&.build_kubernetes_service
+      end
+    end
+  end
+end
diff --git a/app/models/clusters/project.rb b/app/models/clusters/project.rb
new file mode 100644
index 00000000000..eeb734b20b8
--- /dev/null
+++ b/app/models/clusters/project.rb
@@ -0,0 +1,8 @@
+module Clusters
+  class Project < ActiveRecord::Base
+    self.table_name = 'cluster_projects'
+
+    belongs_to :cluster, class_name: 'Clusters::Cluster'
+    belongs_to :project, class_name: '::Project'
+  end
+end
diff --git a/app/models/clusters/providers/gcp.rb b/app/models/clusters/providers/gcp.rb
new file mode 100644
index 00000000000..ee2e43ee9dd
--- /dev/null
+++ b/app/models/clusters/providers/gcp.rb
@@ -0,0 +1,79 @@
+module Clusters
+  module Providers
+    class Gcp < ActiveRecord::Base
+      self.table_name = 'cluster_providers_gcp'
+
+      belongs_to :cluster, inverse_of: :provider_gcp, class_name: 'Clusters::Cluster'
+
+      default_value_for :zone, 'us-central1-a'
+      default_value_for :num_nodes, 3
+      default_value_for :machine_type, 'n1-standard-2'
+
+      attr_encrypted :access_token,
+        mode: :per_attribute_iv,
+        key: Gitlab::Application.secrets.db_key_base,
+        algorithm: 'aes-256-cbc'
+
+      validates :gcp_project_id,
+        length: 1..63,
+        format: {
+          with: Gitlab::Regex.kubernetes_namespace_regex,
+          message: Gitlab::Regex.kubernetes_namespace_regex_message
+        }
+
+      validates :zone, presence: true
+
+      validates :num_nodes,
+        presence: true,
+        numericality: {
+          only_integer: true,
+          greater_than: 0
+        }
+
+      state_machine :status, initial: :scheduled do
+        state :scheduled, value: 1
+        state :creating, value: 2
+        state :created, value: 3
+        state :errored, value: 4
+
+        event :make_creating do
+          transition any - [:creating] => :creating
+        end
+
+        event :make_created do
+          transition any - [:created] => :created
+        end
+
+        event :make_errored do
+          transition any - [:errored] => :errored
+        end
+
+        before_transition any => [:errored, :created] do |provider|
+          provider.access_token = nil
+          provider.operation_id = nil
+        end
+
+        before_transition any => [:creating] do |provider, transition|
+          operation_id = transition.args.first
+          raise ArgumentError.new('operation_id is required') unless operation_id.present?
+          provider.operation_id = operation_id
+        end
+
+        before_transition any => [:errored] do |provider, transition|
+          status_reason = transition.args.first
+          provider.status_reason = status_reason if status_reason
+        end
+      end
+
+      def on_creation?
+        scheduled? || creating?
+      end
+
+      def api_client
+        return unless access_token
+
+        @api_client ||= GoogleApi::CloudPlatform::Client.new(access_token, nil)
+      end
+    end
+  end
+end
diff --git a/app/models/commit_status.rb b/app/models/commit_status.rb
index f3888528940..6b07dbdf3ea 100644
--- a/app/models/commit_status.rb
+++ b/app/models/commit_status.rb
@@ -14,7 +14,6 @@ class CommitStatus < ActiveRecord::Base
   delegate :sha, :short_sha, to: :pipeline
 
   validates :pipeline, presence: true, unless: :importing?
-
   validates :name, presence: true, unless: :importing?
 
   alias_attribute :author, :user
@@ -46,6 +45,17 @@ class CommitStatus < ActiveRecord::Base
     runner_system_failure: 4
   }
 
+  ##
+  # We still create some CommitStatuses outside of CreatePipelineService.
+  #
+  # These are pages deployments and external statuses.
+  #
+  before_create unless: :importing? do
+    Ci::EnsureStageService.new(project, user).execute(self) do |stage|
+      self.run_after_commit { StageUpdateWorker.perform_async(stage.id) }
+    end
+  end
+
   state_machine :status do
     event :process do
       transition [:skipped, :manual] => :created
diff --git a/app/models/concerns/avatarable.rb b/app/models/concerns/avatarable.rb
index 2ec70203710..10659030910 100644
--- a/app/models/concerns/avatarable.rb
+++ b/app/models/concerns/avatarable.rb
@@ -4,15 +4,26 @@ module Avatarable
   def avatar_path(only_path: true)
     return unless self[:avatar].present?
 
-    # If only_path is true then use the relative path of avatar.
-    # Otherwise use full path (including host).
     asset_host = ActionController::Base.asset_host
-    gitlab_host = only_path ? gitlab_config.relative_url_root : gitlab_config.url
+    use_asset_host = asset_host.present?
 
-    # If asset_host is set then it is expected that assets are handled by a standalone host.
-    # That means we do not want to get GitLab's relative_url_root option anymore.
-    host = (asset_host.present? && (!respond_to?(:public?) || public?)) ? asset_host : gitlab_host
+    # Avatars for private and internal groups and projects require authentication to be viewed,
+    # which means they can only be served by Rails, on the regular GitLab host.
+    # If an asset host is configured, we need to return the fully qualified URL
+    # instead of only the avatar path, so that Rails doesn't prefix it with the asset host.
+    if use_asset_host && respond_to?(:public?) && !public?
+      use_asset_host = false
+      only_path = false
+    end
 
-    [host, avatar.url].join
+    url_base = ""
+    if use_asset_host
+      url_base << asset_host unless only_path
+    else
+      url_base << gitlab_config.base_url unless only_path
+      url_base << gitlab_config.relative_url_root
+    end
+
+    url_base + avatar.url
   end
 end
diff --git a/app/models/concerns/ignorable_column.rb b/app/models/concerns/ignorable_column.rb
index eb9f3423e48..03793e8bcbb 100644
--- a/app/models/concerns/ignorable_column.rb
+++ b/app/models/concerns/ignorable_column.rb
@@ -21,8 +21,8 @@ module IgnorableColumn
       @ignored_columns ||= Set.new
     end
 
-    def ignore_column(name)
-      ignored_columns << name.to_s
+    def ignore_column(*names)
+      ignored_columns.merge(names.map(&:to_s))
     end
   end
 end
diff --git a/app/models/concerns/issuable.rb b/app/models/concerns/issuable.rb
index a928b9d6367..35090181bd9 100644
--- a/app/models/concerns/issuable.rb
+++ b/app/models/concerns/issuable.rb
@@ -17,6 +17,8 @@ module Issuable
   include Importable
   include Editable
   include AfterCommitQueue
+  include Sortable
+  include CreatedAtFilterable
 
   # This object is used to gather issuable meta data for displaying
   # upvotes, downvotes, notes and closing merge requests count for issues and merge requests
@@ -253,7 +255,7 @@ module Issuable
     participants(user).include?(user)
   end
 
-  def to_hook_data(user, old_labels: [], old_assignees: [])
+  def to_hook_data(user, old_labels: [], old_assignees: [], old_total_time_spent: nil)
     changes = previous_changes
 
     if old_labels != labels
@@ -268,6 +270,10 @@ module Issuable
       end
     end
 
+    if old_total_time_spent != total_time_spent
+      changes[:total_time_spent] = [old_total_time_spent, total_time_spent]
+    end
+
     Gitlab::HookData::IssuableBuilder.new(self).build(user: user, changes: changes)
   end
 
diff --git a/app/models/concerns/milestoneish.rb b/app/models/concerns/milestoneish.rb
index 0f506e6aa25..c22fb01a4ba 100644
--- a/app/models/concerns/milestoneish.rb
+++ b/app/models/concerns/milestoneish.rb
@@ -86,6 +86,14 @@ module Milestoneish
     false
   end
 
+  def total_issue_time_spent
+    @total_issue_time_spent ||= issues.joins(:timelogs).sum(:time_spent)
+  end
+
+  def human_total_issue_time_spent
+    Gitlab::TimeTrackingFormatter.output(total_issue_time_spent)
+  end
+
   private
 
   def count_issues_by_state(user)
diff --git a/app/models/diff_note.rb b/app/models/diff_note.rb
index d88a92dc027..ae5f138a920 100644
--- a/app/models/diff_note.rb
+++ b/app/models/diff_note.rb
@@ -18,7 +18,8 @@ class DiffNote < Note
   validate :positions_complete
   validate :verify_supported
 
-  before_validation :set_original_position, :update_position, on: :create
+  before_validation :set_original_position, on: :create
+  before_validation :update_position, on: :create, if: :on_text?
   before_validation :set_line_code
   after_save :keep_around_commits
 
diff --git a/app/models/external_issue.rb b/app/models/external_issue.rb
index 0bf18e529f0..9ff56f229bc 100644
--- a/app/models/external_issue.rb
+++ b/app/models/external_issue.rb
@@ -47,4 +47,8 @@ class ExternalIssue
 
     id
   end
+
+  def notes
+    Note.none
+  end
 end
diff --git a/app/models/gcp/cluster.rb b/app/models/gcp/cluster.rb
deleted file mode 100644
index 162a690c0e3..00000000000
--- a/app/models/gcp/cluster.rb
+++ /dev/null
@@ -1,116 +0,0 @@
-module Gcp
-  class Cluster < ActiveRecord::Base
-    extend Gitlab::Gcp::Model
-    include Presentable
-
-    belongs_to :project, inverse_of: :cluster
-    belongs_to :user
-    belongs_to :service
-
-    scope :enabled, -> { where(enabled: true) }
-    scope :disabled, -> { where(enabled: false) }
-
-    default_value_for :gcp_cluster_zone, 'us-central1-a'
-    default_value_for :gcp_cluster_size, 3
-    default_value_for :gcp_machine_type, 'n1-standard-4'
-
-    attr_encrypted :password,
-      mode: :per_attribute_iv,
-      key: Gitlab::Application.secrets.db_key_base,
-      algorithm: 'aes-256-cbc'
-
-    attr_encrypted :kubernetes_token,
-      mode: :per_attribute_iv,
-      key: Gitlab::Application.secrets.db_key_base,
-      algorithm: 'aes-256-cbc'
-
-    attr_encrypted :gcp_token,
-      mode: :per_attribute_iv,
-      key: Gitlab::Application.secrets.db_key_base,
-      algorithm: 'aes-256-cbc'
-
-    validates :gcp_project_id,
-      length: 1..63,
-      format: {
-        with: Gitlab::Regex.kubernetes_namespace_regex,
-        message: Gitlab::Regex.kubernetes_namespace_regex_message
-      }
-
-    validates :gcp_cluster_name,
-      length: 1..63,
-      format: {
-        with: Gitlab::Regex.kubernetes_namespace_regex,
-        message: Gitlab::Regex.kubernetes_namespace_regex_message
-      }
-
-    validates :gcp_cluster_zone, presence: true
-
-    validates :gcp_cluster_size,
-      presence: true,
-      numericality: {
-        only_integer: true,
-        greater_than: 0
-      }
-
-    validates :project_namespace,
-      allow_blank: true,
-      length: 1..63,
-      format: {
-        with: Gitlab::Regex.kubernetes_namespace_regex,
-        message: Gitlab::Regex.kubernetes_namespace_regex_message
-      }
-
-    # if we do not do status transition we prevent change
-    validate :restrict_modification, on: :update, unless: :status_changed?
-
-    state_machine :status, initial: :scheduled do
-      state :scheduled, value: 1
-      state :creating, value: 2
-      state :created, value: 3
-      state :errored, value: 4
-
-      event :make_creating do
-        transition any - [:creating] => :creating
-      end
-
-      event :make_created do
-        transition any - [:created] => :created
-      end
-
-      event :make_errored do
-        transition any - [:errored] => :errored
-      end
-
-      before_transition any => [:errored, :created] do |cluster|
-        cluster.gcp_token = nil
-        cluster.gcp_operation_id = nil
-      end
-
-      before_transition any => [:errored] do |cluster, transition|
-        status_reason = transition.args.first
-        cluster.status_reason = status_reason if status_reason
-      end
-    end
-
-    def project_namespace_placeholder
-      "#{project.path}-#{project.id}"
-    end
-
-    def on_creation?
-      scheduled? || creating?
-    end
-
-    def api_url
-      'https://' + endpoint if endpoint
-    end
-
-    def restrict_modification
-      if on_creation?
-        errors.add(:base, "cannot modify during creation")
-        return false
-      end
-
-      true
-    end
-  end
-end
diff --git a/app/models/group.rb b/app/models/group.rb
index c660de7fcb6..8cf632fb566 100644
--- a/app/models/group.rb
+++ b/app/models/group.rb
@@ -26,6 +26,7 @@ class Group < Namespace
   has_many :notification_settings, dependent: :destroy, as: :source # rubocop:disable Cop/ActiveRecordDependent
   has_many :labels, class_name: 'GroupLabel'
   has_many :variables, class_name: 'Ci::GroupVariable'
+  has_many :custom_attributes, class_name: 'GroupCustomAttribute'
 
   validate :avatar_type, if: ->(user) { user.avatar.present? && user.avatar_changed? }
   validate :visibility_level_allowed_by_projects
diff --git a/app/models/group_custom_attribute.rb b/app/models/group_custom_attribute.rb
new file mode 100644
index 00000000000..8157d602d67
--- /dev/null
+++ b/app/models/group_custom_attribute.rb
@@ -0,0 +1,6 @@
+class GroupCustomAttribute < ActiveRecord::Base
+  belongs_to :group
+
+  validates :group, :key, :value, presence: true
+  validates :key, uniqueness: { scope: [:group_id] }
+end
diff --git a/app/models/issue.rb b/app/models/issue.rb
index fc590f9257e..b5abc8f57b0 100644
--- a/app/models/issue.rb
+++ b/app/models/issue.rb
@@ -5,11 +5,9 @@ class Issue < ActiveRecord::Base
   include Issuable
   include Noteable
   include Referable
-  include Sortable
   include Spammable
   include FasterCacheKeys
   include RelativePositioning
-  include CreatedAtFilterable
   include TimeTrackable
 
   DueDateStruct = Struct.new(:title, :name).freeze
@@ -264,10 +262,6 @@ class Issue < ActiveRecord::Base
     true
   end
 
-  def update_project_counter_caches?
-    state_changed? || confidential_changed?
-  end
-
   def update_project_counter_caches
     Projects::OpenIssuesCountService.new(project).refresh_cache
   end
diff --git a/app/models/key.rb b/app/models/key.rb
index f119b15c737..815fd1de909 100644
--- a/app/models/key.rb
+++ b/app/models/key.rb
@@ -27,8 +27,10 @@ class Key < ActiveRecord::Base
 
   after_commit :add_to_shell, on: :create
   after_create :post_create_hook
+  after_create :refresh_user_cache
   after_commit :remove_from_shell, on: :destroy
   after_destroy :post_destroy_hook
+  after_destroy :refresh_user_cache
 
   def key=(value)
     value&.delete!("\n\r")
@@ -76,6 +78,12 @@ class Key < ActiveRecord::Base
     )
   end
 
+  def refresh_user_cache
+    return unless user
+
+    Users::KeysCountService.new(user).refresh_cache
+  end
+
   def post_destroy_hook
     SystemHooksService.new.execute_hooks_for(self, :destroy)
   end
diff --git a/app/models/lfs_object.rb b/app/models/lfs_object.rb
index b7cf96abe83..fc586fa216e 100644
--- a/app/models/lfs_object.rb
+++ b/app/models/lfs_object.rb
@@ -6,16 +6,8 @@ class LfsObject < ActiveRecord::Base
 
   mount_uploader :file, LfsObjectUploader
 
-  def storage_project(project)
-    if project && project.forked?
-      storage_project(project.forked_from_project)
-    else
-      project
-    end
-  end
-
   def project_allowed_access?(project)
-    projects.exists?(storage_project(project).id)
+    projects.exists?(project.lfs_storage_project.id)
   end
 
   def self.destroy_unreferenced
diff --git a/app/models/merge_request.rb b/app/models/merge_request.rb
index 3133dc9e7eb..f1a5cc73e83 100644
--- a/app/models/merge_request.rb
+++ b/app/models/merge_request.rb
@@ -3,12 +3,11 @@ class MergeRequest < ActiveRecord::Base
   include Issuable
   include Noteable
   include Referable
-  include Sortable
   include IgnorableColumn
-  include CreatedAtFilterable
   include TimeTrackable
 
-  ignore_column :locked_at
+  ignore_column :locked_at,
+                :ref_fetched
 
   belongs_to :target_project, class_name: "Project"
   belongs_to :source_project, class_name: "Project"
@@ -426,7 +425,7 @@ class MergeRequest < ActiveRecord::Base
   end
 
   def create_merge_request_diff
-    fetch_ref
+    fetch_ref!
 
     # n+1: https://gitlab.com/gitlab-org/gitlab-ce/issues/37435
     Gitlab::GitalyClient.allow_n_plus_1_calls do
@@ -577,7 +576,7 @@ class MergeRequest < ActiveRecord::Base
     commit_notes = Note
       .except(:order)
       .where(project_id: [source_project_id, target_project_id])
-      .where(noteable_type: 'Commit', commit_id: commit_ids)
+      .for_commit_id(commit_ids)
 
     # We're using a UNION ALL here since this results in better performance
     # compared to using OR statements. We're using UNION ALL since the queries
@@ -811,29 +810,14 @@ class MergeRequest < ActiveRecord::Base
     end
   end
 
-  def fetch_ref
-    write_ref
-    update_column(:ref_fetched, true)
+  def fetch_ref!
+    target_project.repository.fetch_source_branch!(source_project.repository, source_branch, ref_path)
   end
 
   def ref_path
     "refs/#{Repository::REF_MERGE_REQUEST}/#{iid}/head"
   end
 
-  def ref_fetched?
-    super ||
-      begin
-        computed_value = project.repository.ref_exists?(ref_path)
-        update_column(:ref_fetched, true) if computed_value
-
-        computed_value
-      end
-  end
-
-  def ensure_ref_fetched
-    fetch_ref unless ref_fetched?
-  end
-
   def in_locked_state
     begin
       lock_mr
@@ -881,7 +865,19 @@ class MergeRequest < ActiveRecord::Base
   #
   def all_commit_shas
     if persisted?
-      column_shas = MergeRequestDiffCommit.where(merge_request_diff: merge_request_diffs).limit(10_000).pluck('sha')
+      # MySQL doesn't support LIMIT in a subquery.
+      diffs_relation =
+        if Gitlab::Database.postgresql?
+          merge_request_diffs.order(id: :desc).limit(100)
+        else
+          merge_request_diffs
+        end
+
+      column_shas = MergeRequestDiffCommit
+                      .where(merge_request_diff: diffs_relation)
+                      .limit(10_000)
+                      .pluck('sha')
+
       serialised_shas = merge_request_diffs.where.not(st_commits: nil).flat_map(&:commit_shas)
 
       (column_shas + serialised_shas).uniq
@@ -962,10 +958,6 @@ class MergeRequest < ActiveRecord::Base
     true
   end
 
-  def update_project_counter_caches?
-    state_changed?
-  end
-
   def update_project_counter_caches
     Projects::OpenMergeRequestsCountService.new(target_project).refresh_cache
   end
@@ -975,10 +967,4 @@ class MergeRequest < ActiveRecord::Base
 
     project.merge_requests.merged.where(author_id: author_id).empty?
   end
-
-  private
-
-  def write_ref
-    target_project.repository.fetch_source_branch(source_project.repository, source_branch, ref_path)
-  end
 end
diff --git a/app/models/namespace.rb b/app/models/namespace.rb
index 0601a61a926..4d401e7ba18 100644
--- a/app/models/namespace.rb
+++ b/app/models/namespace.rb
@@ -36,7 +36,7 @@ class Namespace < ActiveRecord::Base
   validates :path,
     presence: true,
     length: { maximum: 255 },
-    dynamic_path: true
+    namespace_path: true
 
   validate :nesting_level_allowed
 
diff --git a/app/models/pages_domain.rb b/app/models/pages_domain.rb
index 2e824cda525..43c77f3f2a2 100644
--- a/app/models/pages_domain.rb
+++ b/app/models/pages_domain.rb
@@ -69,6 +69,10 @@ class PagesDomain < ActiveRecord::Base
     current < x509.not_before || x509.not_after < current
   end
 
+  def expiration
+    x509&.not_after
+  end
+
   def subject
     return unless x509
     x509.subject.to_s
diff --git a/app/models/project.rb b/app/models/project.rb
index 3f810ee977b..894ded2a9f6 100644
--- a/app/models/project.rb
+++ b/app/models/project.rb
@@ -186,7 +186,10 @@ class Project < ActiveRecord::Base
   has_one :import_data, class_name: 'ProjectImportData', inverse_of: :project, autosave: true
   has_one :project_feature, inverse_of: :project
   has_one :statistics, class_name: 'ProjectStatistics'
-  has_one :cluster, class_name: 'Gcp::Cluster', inverse_of: :project
+
+  has_one :cluster_project, class_name: 'Clusters::Project'
+  has_one :cluster, through: :cluster_project, class_name: 'Clusters::Cluster'
+  has_many :clusters, through: :cluster_project, class_name: 'Clusters::Cluster'
 
   # Container repositories need to remove data from the container registry,
   # which is not managed by the DB. Hence we're still using dependent: :destroy
@@ -213,6 +216,7 @@ class Project < ActiveRecord::Base
   has_many :active_runners, -> { active }, through: :runner_projects, source: :runner, class_name: 'Ci::Runner'
 
   has_one :auto_devops, class_name: 'ProjectAutoDevops'
+  has_many :custom_attributes, class_name: 'ProjectCustomAttribute'
 
   accepts_nested_attributes_for :variables, allow_destroy: true
   accepts_nested_attributes_for :project_feature, update_only: true
@@ -240,10 +244,8 @@ class Project < ActiveRecord::Base
               message: Gitlab::Regex.project_name_regex_message }
   validates :path,
     presence: true,
-    dynamic_path: true,
+    project_path: true,
     length: { maximum: 255 },
-    format: { with: Gitlab::PathRegex.project_path_format_regex,
-              message: Gitlab::PathRegex.project_path_format_message },
     uniqueness: { scope: :namespace_id }
 
   validates :namespace, presence: true
@@ -363,6 +365,7 @@ class Project < ActiveRecord::Base
   scope :abandoned, -> { where('projects.last_activity_at < ?', 6.months.ago) }
 
   scope :excluding_project, ->(project) { where.not(id: project) }
+  scope :import_started, -> { where(import_status: 'started') }
 
   state_machine :import_status, initial: :none do
     event :import_schedule do
@@ -701,10 +704,6 @@ class Project < ActiveRecord::Base
     import_type == 'gitea'
   end
 
-  def github_import?
-    import_type == 'github'
-  end
-
   def check_limit
     unless creator.can_create_project? || namespace.kind == 'group'
       projects_limit = creator.projects_limit
@@ -1044,6 +1043,18 @@ class Project < ActiveRecord::Base
     forked_from_project || fork_network&.root_project
   end
 
+  def lfs_storage_project
+    @lfs_storage_project ||= begin
+      result = self
+
+      # TODO: Make this go to the fork_network root immeadiatly
+      # dependant on the discussion in: https://gitlab.com/gitlab-org/gitlab-ce/issues/39769
+      result = result.fork_source while result&.forked?
+
+      result || self
+    end
+  end
+
   def personal?
     !group
   end
@@ -1188,6 +1199,10 @@ class Project < ActiveRecord::Base
     !!repository.exists?
   end
 
+  def wiki_repository_exists?
+    wiki.repository_exists?
+  end
+
   # update visibility_level of forks
   def update_forks_visibility_level
     return unless visibility_level < visibility_level_was
@@ -1431,6 +1446,31 @@ class Project < ActiveRecord::Base
     reload_repository!
   end
 
+  def after_import
+    repository.after_import
+    import_finish
+    remove_import_jid
+    update_project_counter_caches
+  end
+
+  def update_project_counter_caches
+    classes = [
+      Projects::OpenIssuesCountService,
+      Projects::OpenMergeRequestsCountService
+    ]
+
+    classes.each do |klass|
+      klass.new(self).refresh_cache
+    end
+  end
+
+  def remove_import_jid
+    return unless import_jid
+
+    Gitlab::SidekiqStatus.unset(import_jid)
+    update_column(:import_jid, nil)
+  end
+
   def running_or_pending_build_count(force: false)
     Rails.cache.fetch(['projects', id, 'running_or_pending_build_count'], force: force) do
       builds.running_or_pending.count(:all)
@@ -1688,6 +1728,17 @@ class Project < ActiveRecord::Base
     Gitlab::ReferenceCounter.new(gl_repository(is_wiki: wiki))
   end
 
+  # Refreshes the expiration time of the associated import job ID.
+  #
+  # This method can be used by asynchronous importers to refresh the status,
+  # preventing the StuckImportJobsWorker from marking the import as failed.
+  def refresh_import_jid_expiration
+    return unless import_jid
+
+    Gitlab::SidekiqStatus
+      .set(import_jid, StuckImportJobsWorker::IMPORT_JOBS_EXPIRATION)
+  end
+
   private
 
   def storage
diff --git a/app/models/project_custom_attribute.rb b/app/models/project_custom_attribute.rb
new file mode 100644
index 00000000000..3f1a7b86a82
--- /dev/null
+++ b/app/models/project_custom_attribute.rb
@@ -0,0 +1,6 @@
+class ProjectCustomAttribute < ActiveRecord::Base
+  belongs_to :project
+
+  validates :project, :key, :value, presence: true
+  validates :key, uniqueness: { scope: [:project_id] }
+end
diff --git a/app/models/project_services/chat_message/issue_message.rb b/app/models/project_services/chat_message/issue_message.rb
index 1327b075858..3273f41dbd2 100644
--- a/app/models/project_services/chat_message/issue_message.rb
+++ b/app/models/project_services/chat_message/issue_message.rb
@@ -39,7 +39,7 @@ module ChatMessage
     private
 
     def message
-      if state == 'opened'
+      if opened_issue?
         "[#{project_link}] Issue #{state} by #{user_combined_name}"
       else
         "[#{project_link}] Issue #{issue_link} #{state} by #{user_combined_name}"
diff --git a/app/models/project_services/kubernetes_service.rb b/app/models/project_services/kubernetes_service.rb
index 5c0b3338a62..5080acffb3c 100644
--- a/app/models/project_services/kubernetes_service.rb
+++ b/app/models/project_services/kubernetes_service.rb
@@ -136,6 +136,10 @@ class KubernetesService < DeploymentService
     { pods: read_pods }
   end
 
+  def kubeclient
+    @kubeclient ||= build_kubeclient!
+  end
+
   TEMPLATE_PLACEHOLDER = 'Kubernetes namespace'.freeze
 
   private
diff --git a/app/models/project_services/prometheus_service.rb b/app/models/project_services/prometheus_service.rb
index 217f753f05f..fa7b3f2bcaf 100644
--- a/app/models/project_services/prometheus_service.rb
+++ b/app/models/project_services/prometheus_service.rb
@@ -25,7 +25,7 @@ class PrometheusService < MonitoringService
   end
 
   def description
-    'Prometheus monitoring'
+    s_('PrometheusService|Prometheus monitoring')
   end
 
   def self.to_param
@@ -38,8 +38,8 @@ class PrometheusService < MonitoringService
         type: 'text',
         name: 'api_url',
         title: 'API URL',
-        placeholder: 'Prometheus API Base URL, like http://prometheus.example.com/',
-        help: 'By default, Prometheus listens on ‘http://localhost:9090’. It’s not recommended to change the default address and port as this might affect or conflict with other services running on the GitLab server.',
+        placeholder: s_('PrometheusService|Prometheus API Base URL, like http://prometheus.example.com/'),
+        help: s_('PrometheusService|By default, Prometheus listens on ‘http://localhost:9090’. It’s not recommended to change the default address and port as this might affect or conflict with other services running on the GitLab server.'),
         required: true
       }
     ]
diff --git a/app/models/project_wiki.rb b/app/models/project_wiki.rb
index 43de6809178..3eecbea8cbf 100644
--- a/app/models/project_wiki.rb
+++ b/app/models/project_wiki.rb
@@ -21,7 +21,7 @@ class ProjectWiki
   end
 
   delegate :empty?, to: :pages
-  delegate :repository_storage_path, to: :project
+  delegate :repository_storage_path, :hashed_storage?, to: :project
 
   def path
     @project.path + '.wiki'
diff --git a/app/models/repository.rb b/app/models/repository.rb
index 69cddb36b2e..3a89fa9264b 100644
--- a/app/models/repository.rb
+++ b/app/models/repository.rb
@@ -906,13 +906,13 @@ class Repository
     branch = Gitlab::Git::Branch.find(self, branch_or_name)
 
     if branch
-      root_ref_sha = commit(root_ref).sha
-      same_head = branch.target == root_ref_sha
+      @root_ref_sha ||= commit(root_ref).sha
+      same_head = branch.target == @root_ref_sha
       merged =
         if pre_loaded_merged_branches
           pre_loaded_merged_branches.include?(branch.name)
         else
-          ancestor?(branch.target, root_ref_sha)
+          ancestor?(branch.target, @root_ref_sha)
         end
 
       !same_head && merged
@@ -969,8 +969,12 @@ class Repository
     gitlab_shell.fetch_remote(raw_repository, remote, ssh_auth: ssh_auth, forced: forced, no_tags: no_tags)
   end
 
-  def fetch_source_branch(source_repository, source_branch, local_ref)
-    raw_repository.fetch_source_branch(source_repository.raw_repository, source_branch, local_ref)
+  def fetch_source_branch!(source_repository, source_branch, local_ref)
+    raw_repository.fetch_source_branch!(source_repository.raw_repository, source_branch, local_ref)
+  end
+
+  def remote_exists?(name)
+    raw_repository.remote_exists?(name)
   end
 
   def compare_source_branch(target_branch_name, source_repository, source_branch_name, straight:)
@@ -1058,6 +1062,10 @@ class Repository
     blob_data_at(sha, path)
   end
 
+  def fetch_ref(source_repository, source_ref:, target_ref:)
+    raw_repository.fetch_ref(source_repository.raw_repository, source_ref: source_ref, target_ref: target_ref)
+  end
+
   private
 
   # TODO Generice finder, later split this on finders by Ref or Oid
diff --git a/app/models/user.rb b/app/models/user.rb
index bcda4564595..be8112749bf 100644
--- a/app/models/user.rb
+++ b/app/models/user.rb
@@ -146,7 +146,7 @@ class User < ActiveRecord::Base
     presence: true,
     numericality: { greater_than_or_equal_to: 0, less_than_or_equal_to: Gitlab::Database::MAX_INT_VALUE }
   validates :username,
-    dynamic_path: true,
+    user_path: true,
     presence: true,
     uniqueness: { case_sensitive: false }
 
@@ -164,12 +164,13 @@ class User < ActiveRecord::Base
   before_validation :set_notification_email, if: :email_changed?
   before_validation :set_public_email, if: :public_email_changed?
   before_save :ensure_incoming_email_token
-  before_save :ensure_user_rights_and_limits, if: :external_changed?
+  before_save :ensure_user_rights_and_limits, if: ->(user) { user.new_record? || user.external_changed? }
   before_save :skip_reconfirmation!, if: ->(user) { user.email_changed? && user.read_only_attribute?(:email) }
   before_save :check_for_verified_email, if: ->(user) { user.email_changed? && !user.new_record? }
   after_save :ensure_namespace_correct
   after_update :username_changed_hook, if: :username_changed?
   after_destroy :post_destroy_hook
+  after_destroy :remove_key_cache
   after_commit :update_emails_with_primary_email, on: :update, if: -> { previous_changes.key?('email') }
   after_commit :update_invalid_gpg_signatures, on: :update, if: -> { previous_changes.key?('email') }
 
@@ -267,18 +268,23 @@ class User < ActiveRecord::Base
       end
     end
 
+    def for_github_id(id)
+      joins(:identities)
+        .where(identities: { provider: :github, extern_uid: id.to_s })
+    end
+
     # Find a User by their primary email or any associated secondary email
     def find_by_any_email(email)
-      sql = 'SELECT *
-      FROM users
-      WHERE id IN (
-        SELECT id FROM users WHERE email = :email
-        UNION
-        SELECT emails.user_id FROM emails WHERE email = :email
-      )
-      LIMIT 1;'
+      by_any_email(email).take
+    end
+
+    # Returns a relation containing all the users for the given Email address
+    def by_any_email(email)
+      users = where(email: email)
+      emails = joins(:emails).where(emails: { email: email })
+      union = Gitlab::SQL::Union.new([users, emails])
 
-      User.find_by_sql([sql, { email: email }]).first
+      from("(#{union.to_sql}) #{table_name}")
     end
 
     def filter(filter_name)
@@ -619,7 +625,9 @@ class User < ActiveRecord::Base
   end
 
   def require_ssh_key?
-    keys.count == 0 && Gitlab::ProtocolAccess.allowed?('ssh')
+    count = Users::KeysCountService.new(self).count
+
+    count.zero? && Gitlab::ProtocolAccess.allowed?('ssh')
   end
 
   def require_password_creation?
@@ -881,6 +889,10 @@ class User < ActiveRecord::Base
     system_hook_service.execute_hooks_for(self, :destroy)
   end
 
+  def remove_key_cache
+    Users::KeysCountService.new(self).delete_cache
+  end
+
   def delete_async(deleted_by:, params: {})
     block if params[:hard_delete]
     DeleteUserWorker.perform_async(deleted_by.id, id, params)
@@ -916,7 +928,16 @@ class User < ActiveRecord::Base
   end
 
   def manageable_namespaces
-    @manageable_namespaces ||= [namespace] + owned_groups + masters_groups
+    @manageable_namespaces ||= [namespace] + manageable_groups
+  end
+
+  def manageable_groups
+    union = Gitlab::SQL::Union.new([owned_groups.select(:id),
+                                    masters_groups.select(:id)])
+    arel_union = Arel::Nodes::SqlLiteral.new(union.to_sql)
+    owned_and_master_groups = Group.where(Group.arel_table[:id].in(arel_union))
+
+    Gitlab::GroupHierarchy.new(owned_and_master_groups).base_and_descendants
   end
 
   def namespaces
@@ -1139,8 +1160,9 @@ class User < ActiveRecord::Base
       self.can_create_group = false
       self.projects_limit   = 0
     else
-      self.can_create_group = gitlab_config.default_can_create_group
-      self.projects_limit = current_application_settings.default_projects_limit
+      # Only revert these back to the default if they weren't specifically changed in this update.
+      self.can_create_group = gitlab_config.default_can_create_group unless can_create_group_changed?
+      self.projects_limit = current_application_settings.default_projects_limit unless projects_limit_changed?
     end
   end
 
diff --git a/app/policies/ci/build_policy.rb b/app/policies/ci/build_policy.rb
index 984e5482288..1ab391a5a9d 100644
--- a/app/policies/ci/build_policy.rb
+++ b/app/policies/ci/build_policy.rb
@@ -10,6 +10,15 @@ module Ci
       end
     end
 
-    rule { protected_ref }.prevent :update_build
+    condition(:owner_of_job) do
+      can?(:developer_access) && @subject.triggered_by?(@user)
+    end
+
+    rule { protected_ref }.policy do
+      prevent :update_build
+      prevent :erase_build
+    end
+
+    rule { can?(:master_access) | owner_of_job }.enable :erase_build
   end
 end
diff --git a/app/policies/gcp/cluster_policy.rb b/app/policies/clusters/cluster_policy.rb
index e77173ea6e1..1f7c13072b9 100644
--- a/app/policies/gcp/cluster_policy.rb
+++ b/app/policies/clusters/cluster_policy.rb
@@ -1,8 +1,8 @@
-module Gcp
+module Clusters
   class ClusterPolicy < BasePolicy
     alias_method :cluster, :subject
 
-    delegate { @subject.project }
+    delegate { cluster.project }
 
     rule { can?(:master_access) }.policy do
       enable :update_cluster
diff --git a/app/presenters/gcp/cluster_presenter.rb b/app/presenters/clusters/cluster_presenter.rb
index f7908f92a37..01cb59d0d44 100644
--- a/app/presenters/gcp/cluster_presenter.rb
+++ b/app/presenters/clusters/cluster_presenter.rb
@@ -1,9 +1,9 @@
-module Gcp
+module Clusters
   class ClusterPresenter < Gitlab::View::Presenter::Delegated
     presents :cluster
 
     def gke_cluster_url
-      "https://console.cloud.google.com/kubernetes/clusters/details/#{gcp_cluster_zone}/#{gcp_cluster_name}"
+      "https://console.cloud.google.com/kubernetes/clusters/details/#{provider.zone}/#{name}" if gcp?
     end
   end
 end
diff --git a/app/serializers/blob_entity.rb b/app/serializers/blob_entity.rb
index 56f173e5a27..ad039a2623d 100644
--- a/app/serializers/blob_entity.rb
+++ b/app/serializers/blob_entity.rb
@@ -3,10 +3,6 @@ class BlobEntity < Grape::Entity
 
   expose :id, :path, :name, :mode
 
-  expose :last_commit do |blob|
-    request.project.repository.last_commit_for_path(blob.commit_id, blob.path)
-  end
-
   expose :icon do |blob|
     IconsHelper.file_type_icon_class('file', blob.mode, blob.name)
   end
diff --git a/app/serializers/build_details_entity.rb b/app/serializers/build_details_entity.rb
index 8c89eea607f..69d46f5ec14 100644
--- a/app/serializers/build_details_entity.rb
+++ b/app/serializers/build_details_entity.rb
@@ -6,7 +6,7 @@ class BuildDetailsEntity < JobEntity
   expose :pipeline, using: PipelineEntity
 
   expose :erased_by, if: -> (*) { build.erased? }, using: UserEntity
-  expose :erase_path, if: -> (*) { build.erasable? && can?(current_user, :update_build, project) } do |build|
+  expose :erase_path, if: -> (*) { build.erasable? && can?(current_user, :erase_build, build) } do |build|
     erase_project_job_path(project, build)
   end
 
diff --git a/app/serializers/cluster_application_entity.rb b/app/serializers/cluster_application_entity.rb
new file mode 100644
index 00000000000..3f9a275ad08
--- /dev/null
+++ b/app/serializers/cluster_application_entity.rb
@@ -0,0 +1,5 @@
+class ClusterApplicationEntity < Grape::Entity
+  expose :name
+  expose :status_name, as: :status
+  expose :status_reason
+end
diff --git a/app/serializers/cluster_entity.rb b/app/serializers/cluster_entity.rb
index 08a113c4d8a..7e5b0997878 100644
--- a/app/serializers/cluster_entity.rb
+++ b/app/serializers/cluster_entity.rb
@@ -3,4 +3,5 @@ class ClusterEntity < Grape::Entity
 
   expose :status_name, as: :status
   expose :status_reason
+  expose :applications, using: ClusterApplicationEntity
 end
diff --git a/app/serializers/cluster_serializer.rb b/app/serializers/cluster_serializer.rb
index 2c87202a105..2e13c1501e7 100644
--- a/app/serializers/cluster_serializer.rb
+++ b/app/serializers/cluster_serializer.rb
@@ -2,6 +2,6 @@ class ClusterSerializer < BaseSerializer
   entity ClusterEntity
 
   def represent_status(resource)
-    represent(resource, { only: [:status, :status_reason] })
+    represent(resource, { only: [:status, :status_reason, :applications] })
   end
 end
diff --git a/app/serializers/issue_entity.rb b/app/serializers/issue_entity.rb
index 5f47592e4ad..9d52b8d9752 100644
--- a/app/serializers/issue_entity.rb
+++ b/app/serializers/issue_entity.rb
@@ -3,7 +3,6 @@ class IssueEntity < IssuableEntity
 
   expose :state
   expose :deleted_at
-  expose :branch_name
   expose :confidential
   expose :discussion_locked
   expose :assignees, using: API::Entities::UserBasic
diff --git a/app/serializers/tree_entity.rb b/app/serializers/tree_entity.rb
index 555e5cf83bd..9f1b485347f 100644
--- a/app/serializers/tree_entity.rb
+++ b/app/serializers/tree_entity.rb
@@ -3,10 +3,6 @@ class TreeEntity < Grape::Entity
 
   expose :id, :path, :name, :mode
 
-  expose :last_commit do |tree|
-    request.project.repository.last_commit_for_path(tree.commit_id, tree.path)
-  end
-
   expose :icon do |tree|
     IconsHelper.file_type_icon_class('folder', tree.mode, tree.name)
   end
diff --git a/app/serializers/tree_root_entity.rb b/app/serializers/tree_root_entity.rb
index 69702ae1493..496f070ddbd 100644
--- a/app/serializers/tree_root_entity.rb
+++ b/app/serializers/tree_root_entity.rb
@@ -18,4 +18,8 @@ class TreeRootEntity < Grape::Entity
 
     project_tree_path(request.project, File.join(request.ref, parent_tree_path))
   end
+
+  expose :last_commit_path do |tree|
+    logs_file_project_ref_path(request.project, request.ref, tree.path)
+  end
 end
diff --git a/app/services/base_count_service.rb b/app/services/base_count_service.rb
new file mode 100644
index 00000000000..99cc9a196e6
--- /dev/null
+++ b/app/services/base_count_service.rb
@@ -0,0 +1,34 @@
+# Base class for services that count a single resource such as the number of
+# issues for a project.
+class BaseCountService
+  def relation_for_count
+    raise(
+      NotImplementedError,
+      '"relation_for_count" must be implemented and return an ActiveRecord::Relation'
+    )
+  end
+
+  def count
+    Rails.cache.fetch(cache_key, raw: raw?) { uncached_count }.to_i
+  end
+
+  def refresh_cache
+    Rails.cache.write(cache_key, uncached_count, raw: raw?)
+  end
+
+  def uncached_count
+    relation_for_count.count
+  end
+
+  def delete_cache
+    Rails.cache.delete(cache_key)
+  end
+
+  def raw?
+    false
+  end
+
+  def cache_key
+    raise NotImplementedError, 'cache_key must be implemented and return a String'
+  end
+end
diff --git a/app/services/base_renderer.rb b/app/services/base_renderer.rb
new file mode 100644
index 00000000000..d6e30bd7008
--- /dev/null
+++ b/app/services/base_renderer.rb
@@ -0,0 +1,7 @@
+class BaseRenderer
+  attr_reader :current_user
+
+  def initialize(current_user = nil)
+    @current_user = current_user
+  end
+end
diff --git a/app/services/ci/create_cluster_service.rb b/app/services/ci/create_cluster_service.rb
deleted file mode 100644
index f7ee0e468e2..00000000000
--- a/app/services/ci/create_cluster_service.rb
+++ /dev/null
@@ -1,15 +0,0 @@
-module Ci
-  class CreateClusterService < BaseService
-    def execute(access_token)
-      params['gcp_machine_type'] ||= GoogleApi::CloudPlatform::Client::DEFAULT_MACHINE_TYPE
-
-      cluster_params =
-        params.merge(user: current_user,
-                     gcp_token: access_token)
-
-      project.create_cluster(cluster_params).tap do |cluster|
-        ClusterProvisionWorker.perform_async(cluster.id) if cluster.persisted?
-      end
-    end
-  end
-end
diff --git a/app/services/ci/ensure_stage_service.rb b/app/services/ci/ensure_stage_service.rb
new file mode 100644
index 00000000000..dc2f49e8db1
--- /dev/null
+++ b/app/services/ci/ensure_stage_service.rb
@@ -0,0 +1,39 @@
+module Ci
+  ##
+  # We call this service everytime we persist a CI/CD job.
+  #
+  # In most cases a job should already have a stage assigned,  but in cases it
+  # doesn't have we need to either find existing one or create a brand new
+  # stage.
+  #
+  class EnsureStageService < BaseService
+    def execute(build)
+      @build = build
+
+      return if build.stage_id.present?
+      return if build.invalid?
+
+      ensure_stage.tap do |stage|
+        build.stage_id = stage.id
+
+        yield stage if block_given?
+      end
+    end
+
+    private
+
+    def ensure_stage
+      find_stage || create_stage
+    end
+
+    def find_stage
+      @build.pipeline.stages.find_by(name: @build.stage)
+    end
+
+    def create_stage
+      Ci::Stage.create!(name: @build.stage,
+                        pipeline: @build.pipeline,
+                        project: @build.project)
+    end
+  end
+end
diff --git a/app/services/ci/fetch_gcp_operation_service.rb b/app/services/ci/fetch_gcp_operation_service.rb
deleted file mode 100644
index 0b68e4d6ea9..00000000000
--- a/app/services/ci/fetch_gcp_operation_service.rb
+++ /dev/null
@@ -1,17 +0,0 @@
-module Ci
-  class FetchGcpOperationService
-    def execute(cluster)
-      api_client =
-        GoogleApi::CloudPlatform::Client.new(cluster.gcp_token, nil)
-
-      operation = api_client.projects_zones_operations(
-        cluster.gcp_project_id,
-        cluster.gcp_cluster_zone,
-        cluster.gcp_operation_id)
-
-      yield(operation) if block_given?
-    rescue Google::Apis::ServerError, Google::Apis::ClientError, Google::Apis::AuthorizationError => e
-      return cluster.make_errored!("Failed to request to CloudPlatform; #{e.message}")
-    end
-  end
-end
diff --git a/app/services/ci/finalize_cluster_creation_service.rb b/app/services/ci/finalize_cluster_creation_service.rb
deleted file mode 100644
index 347875c5697..00000000000
--- a/app/services/ci/finalize_cluster_creation_service.rb
+++ /dev/null
@@ -1,33 +0,0 @@
-module Ci
-  class FinalizeClusterCreationService
-    def execute(cluster)
-      api_client =
-        GoogleApi::CloudPlatform::Client.new(cluster.gcp_token, nil)
-
-      begin
-        gke_cluster = api_client.projects_zones_clusters_get(
-          cluster.gcp_project_id,
-          cluster.gcp_cluster_zone,
-          cluster.gcp_cluster_name)
-      rescue Google::Apis::ServerError, Google::Apis::ClientError, Google::Apis::AuthorizationError => e
-        return cluster.make_errored!("Failed to request to CloudPlatform; #{e.message}")
-      end
-
-      endpoint = gke_cluster.endpoint
-      api_url = 'https://' + endpoint
-      ca_cert = Base64.decode64(gke_cluster.master_auth.cluster_ca_certificate)
-      username = gke_cluster.master_auth.username
-      password = gke_cluster.master_auth.password
-
-      kubernetes_token = Ci::FetchKubernetesTokenService.new(
-        api_url, ca_cert, username, password).execute
-
-      unless kubernetes_token
-        return cluster.make_errored!('Failed to get a default token of kubernetes')
-      end
-
-      Ci::IntegrateClusterService.new.execute(
-        cluster, endpoint, ca_cert, kubernetes_token, username, password)
-    end
-  end
-end
diff --git a/app/services/ci/integrate_cluster_service.rb b/app/services/ci/integrate_cluster_service.rb
deleted file mode 100644
index d123ce8d26b..00000000000
--- a/app/services/ci/integrate_cluster_service.rb
+++ /dev/null
@@ -1,26 +0,0 @@
-module Ci
-  class IntegrateClusterService
-    def execute(cluster, endpoint, ca_cert, token, username, password)
-      Gcp::Cluster.transaction do
-        cluster.update!(
-          enabled: true,
-          endpoint: endpoint,
-          ca_cert: ca_cert,
-          kubernetes_token: token,
-          username: username,
-          password: password,
-          service: cluster.project.find_or_initialize_service('kubernetes'),
-          status_event: :make_created)
-
-        cluster.service.update!(
-          active: true,
-          api_url: cluster.api_url,
-          ca_pem: ca_cert,
-          namespace: cluster.project_namespace,
-          token: token)
-      end
-    rescue ActiveRecord::RecordInvalid => e
-      cluster.make_errored!("Failed to integrate cluster into kubernetes_service: #{e.message}")
-    end
-  end
-end
diff --git a/app/services/ci/pipeline_trigger_service.rb b/app/services/ci/pipeline_trigger_service.rb
index 120af8c1e61..a9813d774bb 100644
--- a/app/services/ci/pipeline_trigger_service.rb
+++ b/app/services/ci/pipeline_trigger_service.rb
@@ -1,5 +1,7 @@
 module Ci
   class PipelineTriggerService < BaseService
+    include Gitlab::Utils::StrongMemoize
+
     def execute
       if trigger_from_token
         create_pipeline_from_trigger(trigger_from_token)
@@ -26,9 +28,9 @@ module Ci
     end
 
     def trigger_from_token
-      return @trigger if defined?(@trigger)
-
-      @trigger = Ci::Trigger.find_by_token(params[:token].to_s)
+      strong_memoize(:trigger) do
+        Ci::Trigger.find_by_token(params[:token].to_s)
+      end
     end
 
     def create_pipeline_variables!(pipeline)
diff --git a/app/services/ci/provision_cluster_service.rb b/app/services/ci/provision_cluster_service.rb
deleted file mode 100644
index 52d80b01813..00000000000
--- a/app/services/ci/provision_cluster_service.rb
+++ /dev/null
@@ -1,36 +0,0 @@
-module Ci
-  class ProvisionClusterService
-    def execute(cluster)
-      api_client =
-        GoogleApi::CloudPlatform::Client.new(cluster.gcp_token, nil)
-
-      begin
-        operation = api_client.projects_zones_clusters_create(
-          cluster.gcp_project_id,
-          cluster.gcp_cluster_zone,
-          cluster.gcp_cluster_name,
-          cluster.gcp_cluster_size,
-          machine_type: cluster.gcp_machine_type)
-      rescue Google::Apis::ServerError, Google::Apis::ClientError, Google::Apis::AuthorizationError => e
-        return cluster.make_errored!("Failed to request to CloudPlatform; #{e.message}")
-      end
-
-      unless operation.status == 'RUNNING' || operation.status == 'PENDING'
-        return cluster.make_errored!("Operation status is unexpected; #{operation.status_message}")
-      end
-
-      cluster.gcp_operation_id = api_client.parse_operation_id(operation.self_link)
-
-      unless cluster.gcp_operation_id
-        return cluster.make_errored!('Can not find operation_id from self_link')
-      end
-
-      if cluster.make_creating
-        WaitForClusterCreationWorker.perform_in(
-          WaitForClusterCreationWorker::INITIAL_INTERVAL, cluster.id)
-      else
-        return cluster.make_errored!("Failed to update cluster record; #{cluster.errors}")
-      end
-    end
-  end
-end
diff --git a/app/services/ci/update_cluster_service.rb b/app/services/ci/update_cluster_service.rb
deleted file mode 100644
index 70d88fca660..00000000000
--- a/app/services/ci/update_cluster_service.rb
+++ /dev/null
@@ -1,22 +0,0 @@
-module Ci
-  class UpdateClusterService < BaseService
-    def execute(cluster)
-      Gcp::Cluster.transaction do
-        cluster.update!(params)
-
-        if params['enabled'] == 'true'
-          cluster.service.update!(
-            active: true,
-            api_url: cluster.api_url,
-            ca_pem: cluster.ca_cert,
-            namespace: cluster.project_namespace,
-            token: cluster.kubernetes_token)
-        else
-          cluster.service.update!(active: false)
-        end
-      end
-    rescue ActiveRecord::RecordInvalid => e
-      cluster.errors.add(:base, e.message)
-    end
-  end
-end
diff --git a/app/services/clusters/applications/base_helm_service.rb b/app/services/clusters/applications/base_helm_service.rb
new file mode 100644
index 00000000000..9a4ce31cb39
--- /dev/null
+++ b/app/services/clusters/applications/base_helm_service.rb
@@ -0,0 +1,29 @@
+module Clusters
+  module Applications
+    class BaseHelmService
+      attr_accessor :app
+
+      def initialize(app)
+        @app = app
+      end
+
+      protected
+
+      def cluster
+        app.cluster
+      end
+
+      def kubeclient
+        cluster.kubeclient
+      end
+
+      def helm_api
+        @helm_api ||= Gitlab::Kubernetes::Helm.new(kubeclient)
+      end
+
+      def install_command
+        @install_command ||= app.install_command
+      end
+    end
+  end
+end
diff --git a/app/services/clusters/applications/check_installation_progress_service.rb b/app/services/clusters/applications/check_installation_progress_service.rb
new file mode 100644
index 00000000000..bde090eaeec
--- /dev/null
+++ b/app/services/clusters/applications/check_installation_progress_service.rb
@@ -0,0 +1,65 @@
+module Clusters
+  module Applications
+    class CheckInstallationProgressService < BaseHelmService
+      def execute
+        return unless app.installing?
+
+        case installation_phase
+        when Gitlab::Kubernetes::Pod::SUCCEEDED
+          on_success
+        when Gitlab::Kubernetes::Pod::FAILED
+          on_failed
+        else
+          check_timeout
+        end
+      rescue KubeException => ke
+        app.make_errored!("Kubernetes error: #{ke.message}") unless app.errored?
+      end
+
+      private
+
+      def on_success
+        app.make_installed!
+      ensure
+        remove_installation_pod
+      end
+
+      def on_failed
+        app.make_errored!(installation_errors || 'Installation silently failed')
+      ensure
+        remove_installation_pod
+      end
+
+      def check_timeout
+        if timeouted?
+          begin
+            app.make_errored!('Installation timeouted')
+          ensure
+            remove_installation_pod
+          end
+        else
+          ClusterWaitForAppInstallationWorker.perform_in(
+            ClusterWaitForAppInstallationWorker::INTERVAL, app.name, app.id)
+        end
+      end
+
+      def timeouted?
+        Time.now.utc - app.updated_at.to_time.utc > ClusterWaitForAppInstallationWorker::TIMEOUT
+      end
+
+      def remove_installation_pod
+        helm_api.delete_installation_pod!(install_command.pod_name)
+      rescue
+        # no-op
+      end
+
+      def installation_phase
+        helm_api.installation_status(install_command.pod_name)
+      end
+
+      def installation_errors
+        helm_api.installation_log(install_command.pod_name)
+      end
+    end
+  end
+end
diff --git a/app/services/clusters/applications/install_service.rb b/app/services/clusters/applications/install_service.rb
new file mode 100644
index 00000000000..8ceeec687cd
--- /dev/null
+++ b/app/services/clusters/applications/install_service.rb
@@ -0,0 +1,21 @@
+module Clusters
+  module Applications
+    class InstallService < BaseHelmService
+      def execute
+        return unless app.scheduled?
+
+        begin
+          app.make_installing!
+          helm_api.install(install_command)
+
+          ClusterWaitForAppInstallationWorker.perform_in(
+            ClusterWaitForAppInstallationWorker::INTERVAL, app.name, app.id)
+        rescue KubeException => ke
+          app.make_errored!("Kubernetes error: #{ke.message}")
+        rescue StandardError
+          app.make_errored!("Can't start installation process")
+        end
+      end
+    end
+  end
+end
diff --git a/app/services/clusters/applications/schedule_installation_service.rb b/app/services/clusters/applications/schedule_installation_service.rb
new file mode 100644
index 00000000000..eb8caa68ef7
--- /dev/null
+++ b/app/services/clusters/applications/schedule_installation_service.rb
@@ -0,0 +1,22 @@
+module Clusters
+  module Applications
+    class ScheduleInstallationService < ::BaseService
+      def execute
+        application_class.find_or_create_by!(cluster: cluster).try do |application|
+          application.make_scheduled!
+          ClusterInstallAppWorker.perform_async(application.name, application.id)
+        end
+      end
+
+      private
+
+      def application_class
+        params[:application_class]
+      end
+
+      def cluster
+        params[:cluster]
+      end
+    end
+  end
+end
diff --git a/app/services/clusters/create_service.rb b/app/services/clusters/create_service.rb
new file mode 100644
index 00000000000..1d407739b21
--- /dev/null
+++ b/app/services/clusters/create_service.rb
@@ -0,0 +1,29 @@
+module Clusters
+  class CreateService < BaseService
+    attr_reader :access_token
+
+    def execute(access_token)
+      @access_token = access_token
+
+      create_cluster.tap do |cluster|
+        ClusterProvisionWorker.perform_async(cluster.id) if cluster.persisted?
+      end
+    end
+
+    private
+
+    def create_cluster
+      Clusters::Cluster.create(cluster_params)
+    end
+
+    def cluster_params
+      return @cluster_params if defined?(@cluster_params)
+
+      params[:provider_gcp_attributes].try do |provider|
+        provider[:access_token] = access_token
+      end
+
+      @cluster_params = params.merge(user: current_user, projects: [project])
+    end
+  end
+end
diff --git a/app/services/clusters/gcp/fetch_operation_service.rb b/app/services/clusters/gcp/fetch_operation_service.rb
new file mode 100644
index 00000000000..a4cd3ca5c11
--- /dev/null
+++ b/app/services/clusters/gcp/fetch_operation_service.rb
@@ -0,0 +1,16 @@
+module Clusters
+  module Gcp
+    class FetchOperationService
+      def execute(provider)
+        operation = provider.api_client.projects_zones_operations(
+          provider.gcp_project_id,
+          provider.zone,
+          provider.operation_id)
+
+        yield(operation) if block_given?
+      rescue Google::Apis::ServerError, Google::Apis::ClientError, Google::Apis::AuthorizationError => e
+        provider.make_errored!("Failed to request to CloudPlatform; #{e.message}")
+      end
+    end
+  end
+end
diff --git a/app/services/clusters/gcp/finalize_creation_service.rb b/app/services/clusters/gcp/finalize_creation_service.rb
new file mode 100644
index 00000000000..cea56f4e849
--- /dev/null
+++ b/app/services/clusters/gcp/finalize_creation_service.rb
@@ -0,0 +1,56 @@
+module Clusters
+  module Gcp
+    class FinalizeCreationService
+      attr_reader :provider
+
+      def execute(provider)
+        @provider = provider
+
+        configure_provider
+        configure_kubernetes
+
+        cluster.save!
+      rescue Google::Apis::ServerError, Google::Apis::ClientError, Google::Apis::AuthorizationError => e
+        provider.make_errored!("Failed to request to CloudPlatform; #{e.message}")
+      rescue ActiveRecord::RecordInvalid => e
+        provider.make_errored!("Failed to configure GKE Cluster: #{e.message}")
+      end
+
+      private
+
+      def configure_provider
+        provider.endpoint = gke_cluster.endpoint
+        provider.status_event = :make_created
+      end
+
+      def configure_kubernetes
+        cluster.platform_type = :kubernetes
+        cluster.build_platform_kubernetes(
+          api_url: 'https://' + gke_cluster.endpoint,
+          ca_cert: Base64.decode64(gke_cluster.master_auth.cluster_ca_certificate),
+          username: gke_cluster.master_auth.username,
+          password: gke_cluster.master_auth.password,
+          token: request_kuberenetes_token)
+      end
+
+      def request_kuberenetes_token
+        Ci::FetchKubernetesTokenService.new(
+          'https://' + gke_cluster.endpoint,
+          Base64.decode64(gke_cluster.master_auth.cluster_ca_certificate),
+          gke_cluster.master_auth.username,
+          gke_cluster.master_auth.password).execute
+      end
+
+      def gke_cluster
+        @gke_cluster ||= provider.api_client.projects_zones_clusters_get(
+          provider.gcp_project_id,
+          provider.zone,
+          cluster.name)
+      end
+
+      def cluster
+        @cluster ||= provider.cluster
+      end
+    end
+  end
+end
diff --git a/app/services/clusters/gcp/provision_service.rb b/app/services/clusters/gcp/provision_service.rb
new file mode 100644
index 00000000000..8beea5a8cfb
--- /dev/null
+++ b/app/services/clusters/gcp/provision_service.rb
@@ -0,0 +1,47 @@
+module Clusters
+  module Gcp
+    class ProvisionService
+      attr_reader :provider
+
+      def execute(provider)
+        @provider = provider
+
+        get_operation_id do |operation_id|
+          if provider.make_creating(operation_id)
+            WaitForClusterCreationWorker.perform_in(
+              Clusters::Gcp::VerifyProvisionStatusService::INITIAL_INTERVAL,
+              provider.cluster_id)
+          else
+            provider.make_errored!("Failed to update provider record; #{provider.errors}")
+          end
+        end
+      end
+
+      private
+
+      def get_operation_id
+        operation = provider.api_client.projects_zones_clusters_create(
+          provider.gcp_project_id,
+          provider.zone,
+          provider.cluster.name,
+          provider.num_nodes,
+          machine_type: provider.machine_type)
+
+        unless operation.status == 'PENDING' || operation.status == 'RUNNING'
+          return provider.make_errored!("Operation status is unexpected; #{operation.status_message}")
+        end
+
+        operation_id = provider.api_client.parse_operation_id(operation.self_link)
+
+        unless operation_id
+          return provider.make_errored!('Can not find operation_id from self_link')
+        end
+
+        yield(operation_id)
+
+      rescue Google::Apis::ServerError, Google::Apis::ClientError, Google::Apis::AuthorizationError => e
+        provider.make_errored!("Failed to request to CloudPlatform; #{e.message}")
+      end
+    end
+  end
+end
diff --git a/app/services/clusters/gcp/verify_provision_status_service.rb b/app/services/clusters/gcp/verify_provision_status_service.rb
new file mode 100644
index 00000000000..bc33756f27c
--- /dev/null
+++ b/app/services/clusters/gcp/verify_provision_status_service.rb
@@ -0,0 +1,48 @@
+module Clusters
+  module Gcp
+    class VerifyProvisionStatusService
+      attr_reader :provider
+
+      INITIAL_INTERVAL = 2.minutes
+      EAGER_INTERVAL = 10.seconds
+      TIMEOUT = 20.minutes
+
+      def execute(provider)
+        @provider = provider
+
+        request_operation do |operation|
+          case operation.status
+          when 'PENDING', 'RUNNING'
+            continue_creation(operation)
+          when 'DONE'
+            finalize_creation
+          else
+            return provider.make_errored!("Unexpected operation status; #{operation.status} #{operation.status_message}")
+          end
+        end
+      end
+
+      private
+
+      def continue_creation(operation)
+        if elapsed_time_from_creation(operation) < TIMEOUT
+          WaitForClusterCreationWorker.perform_in(EAGER_INTERVAL, provider.cluster_id)
+        else
+          provider.make_errored!("Cluster creation time exceeds timeout; #{TIMEOUT}")
+        end
+      end
+
+      def elapsed_time_from_creation(operation)
+        Time.now.utc - operation.start_time.to_time.utc
+      end
+
+      def finalize_creation
+        Clusters::Gcp::FinalizeCreationService.new.execute(provider)
+      end
+
+      def request_operation(&blk)
+        Clusters::Gcp::FetchOperationService.new.execute(provider, &blk)
+      end
+    end
+  end
+end
diff --git a/app/services/clusters/update_service.rb b/app/services/clusters/update_service.rb
new file mode 100644
index 00000000000..989218e32a2
--- /dev/null
+++ b/app/services/clusters/update_service.rb
@@ -0,0 +1,7 @@
+module Clusters
+  class UpdateService < BaseService
+    def execute(cluster)
+      cluster.update(params)
+    end
+  end
+end
diff --git a/app/services/delete_merged_branches_service.rb b/app/services/delete_merged_branches_service.rb
index 077268b2388..cb235a85daf 100644
--- a/app/services/delete_merged_branches_service.rb
+++ b/app/services/delete_merged_branches_service.rb
@@ -13,7 +13,7 @@ class DeleteMergedBranchesService < BaseService
       # Prevent deletion of branches relevant to open merge requests
       branches -= merge_request_branch_names
       # Prevent deletion of protected branches
-      branches = branches.reject { |branch| project.protected_for?(branch) }
+      branches = branches.reject { |branch| ProtectedBranch.protected?(project, branch) }
 
       branches.each do |branch|
         DeleteBranchService.new(project, current_user).execute(branch)
diff --git a/app/services/events/render_service.rb b/app/services/events/render_service.rb
new file mode 100644
index 00000000000..0b62d8aedf1
--- /dev/null
+++ b/app/services/events/render_service.rb
@@ -0,0 +1,21 @@
+module Events
+  class RenderService < BaseRenderer
+    def execute(events, atom_request: false)
+      events.map(&:note).compact.group_by(&:project).each do |project, notes|
+        render_notes(notes, project, atom_request)
+      end
+    end
+
+    private
+
+    def render_notes(notes, project, atom_request)
+      Notes::RenderService.new(current_user).execute(notes, project, render_options(atom_request))
+    end
+
+    def render_options(atom_request)
+      return {} unless atom_request
+
+      { only_path: false, xhtml: true }
+    end
+  end
+end
diff --git a/app/services/issuable_base_service.rb b/app/services/issuable_base_service.rb
index 68b49d880f7..39a7299ff60 100644
--- a/app/services/issuable_base_service.rb
+++ b/app/services/issuable_base_service.rb
@@ -172,6 +172,7 @@ class IssuableBaseService < BaseService
     old_labels = issuable.labels.to_a
     old_mentioned_users = issuable.mentioned_users.to_a
     old_assignees = issuable.assignees.to_a
+    old_total_time_spent = issuable.total_time_spent
 
     label_ids = process_label_ids(params, existing_label_ids: issuable.label_ids)
     params[:label_ids] = label_ids if labels_changing?(issuable.label_ids, label_ids)
@@ -187,7 +188,7 @@ class IssuableBaseService < BaseService
 
       # We have to perform this check before saving the issuable as Rails resets
       # the changed fields upon calling #save.
-      update_project_counters = issuable.project && issuable.update_project_counter_caches?
+      update_project_counters = issuable.project && update_project_counter_caches?(issuable)
 
       if issuable.with_transaction_returning_status { issuable.save }
         # We do not touch as it will affect a update on updated_at field
@@ -208,7 +209,12 @@ class IssuableBaseService < BaseService
         invalidate_cache_counts(issuable, users: affected_assignees.compact)
         after_update(issuable)
         issuable.create_new_cross_references!(current_user)
-        execute_hooks(issuable, 'update', old_labels: old_labels, old_assignees: old_assignees)
+        execute_hooks(
+          issuable,
+          'update',
+          old_labels: old_labels,
+          old_assignees: old_assignees,
+          old_total_time_spent: old_total_time_spent)
 
         issuable.update_project_counter_caches if update_project_counters
       end
@@ -288,4 +294,8 @@ class IssuableBaseService < BaseService
   # override if needed
   def execute_hooks(issuable, action = 'open', params = {})
   end
+
+  def update_project_counter_caches?(issuable)
+    issuable.state_changed?
+  end
 end
diff --git a/app/services/issues/base_service.rb b/app/services/issues/base_service.rb
index 735257c4779..0f711bcc3cf 100644
--- a/app/services/issues/base_service.rb
+++ b/app/services/issues/base_service.rb
@@ -1,7 +1,7 @@
 module Issues
   class BaseService < ::IssuableBaseService
-    def hook_data(issue, action, old_labels: [], old_assignees: [])
-      hook_data = issue.to_hook_data(current_user, old_labels: old_labels, old_assignees: old_assignees)
+    def hook_data(issue, action, old_labels: [], old_assignees: [], old_total_time_spent: nil)
+      hook_data = issue.to_hook_data(current_user, old_labels: old_labels, old_assignees: old_assignees, old_total_time_spent: old_total_time_spent)
       hook_data[:object_attributes][:action] = action
 
       hook_data
@@ -22,8 +22,8 @@ module Issues
         issue, issue.project, current_user, old_assignees)
     end
 
-    def execute_hooks(issue, action = 'open', old_labels: [], old_assignees: [])
-      issue_data  = hook_data(issue, action, old_labels: old_labels, old_assignees: old_assignees)
+    def execute_hooks(issue, action = 'open', old_labels: [], old_assignees: [], old_total_time_spent: nil)
+      issue_data  = hook_data(issue, action, old_labels: old_labels, old_assignees: old_assignees, old_total_time_spent: old_total_time_spent)
       hooks_scope = issue.confidential? ? :confidential_issue_hooks : :issue_hooks
       issue.project.execute_hooks(issue_data, hooks_scope)
       issue.project.execute_services(issue_data, hooks_scope)
@@ -45,5 +45,9 @@ module Issues
         params.delete(:assignee_ids)
       end
     end
+
+    def update_project_counter_caches?(issue)
+      super || issue.confidential_changed?
+    end
   end
 end
diff --git a/app/services/merge_requests/base_service.rb b/app/services/merge_requests/base_service.rb
index 112606a82d7..d3938b065bc 100644
--- a/app/services/merge_requests/base_service.rb
+++ b/app/services/merge_requests/base_service.rb
@@ -18,8 +18,8 @@ module MergeRequests
       super if changed_title
     end
 
-    def hook_data(merge_request, action, old_rev: nil, old_labels: [], old_assignees: [])
-      hook_data = merge_request.to_hook_data(current_user, old_labels: old_labels, old_assignees: old_assignees)
+    def hook_data(merge_request, action, old_rev: nil, old_labels: [], old_assignees: [], old_total_time_spent: nil)
+      hook_data = merge_request.to_hook_data(current_user, old_labels: old_labels, old_assignees: old_assignees, old_total_time_spent: old_total_time_spent)
       hook_data[:object_attributes][:action] = action
       if old_rev && !Gitlab::Git.blank_ref?(old_rev)
         hook_data[:object_attributes][:oldrev] = old_rev
@@ -28,9 +28,9 @@ module MergeRequests
       hook_data
     end
 
-    def execute_hooks(merge_request, action = 'open', old_rev: nil, old_labels: [], old_assignees: [])
+    def execute_hooks(merge_request, action = 'open', old_rev: nil, old_labels: [], old_assignees: [], old_total_time_spent: nil)
       if merge_request.project
-        merge_data = hook_data(merge_request, action, old_rev: old_rev, old_labels: old_labels, old_assignees: old_assignees)
+        merge_data = hook_data(merge_request, action, old_rev: old_rev, old_labels: old_labels, old_assignees: old_assignees, old_total_time_spent: old_total_time_spent)
         merge_request.project.execute_hooks(merge_data, :merge_request_hooks)
         merge_request.project.execute_services(merge_data, :merge_request_hooks)
       end
diff --git a/app/services/merge_requests/merge_service.rb b/app/services/merge_requests/merge_service.rb
index 156e7b2f078..1da4dbd9e96 100644
--- a/app/services/merge_requests/merge_service.rb
+++ b/app/services/merge_requests/merge_service.rb
@@ -18,15 +18,7 @@ module MergeRequests
 
       @merge_request = merge_request
 
-      unless @merge_request.mergeable?
-        return handle_merge_error(log_message: 'Merge request is not mergeable', save_message_on_model: true)
-      end
-
-      @source = find_merge_source
-
-      unless @source
-        return handle_merge_error(log_message: 'No source for merge', save_message_on_model: true)
-      end
+      error_check!
 
       merge_request.in_locked_state do
         if commit
@@ -41,6 +33,19 @@ module MergeRequests
 
     private
 
+    def error_check!
+      error =
+        if @merge_request.should_be_rebased?
+          'Only fast-forward merge is allowed for your project. Please update your source branch'
+        elsif !@merge_request.mergeable?
+          'Merge request is not mergeable'
+        elsif !source
+          'No source for merge'
+        end
+
+      raise MergeError, error if error
+    end
+
     def commit
       message = params[:commit_message] || merge_request.merge_commit_message
 
@@ -91,8 +96,8 @@ module MergeRequests
       merge_request.to_reference(full: true)
     end
 
-    def find_merge_source
-      merge_request.diff_head_sha
+    def source
+      @source ||= @merge_request.diff_head_sha
     end
   end
 end
diff --git a/app/services/notes/render_service.rb b/app/services/notes/render_service.rb
new file mode 100644
index 00000000000..a77e98c2b07
--- /dev/null
+++ b/app/services/notes/render_service.rb
@@ -0,0 +1,21 @@
+module Notes
+  class RenderService < BaseRenderer
+    # Renders a collection of Note instances.
+    #
+    # notes - The notes to render.
+    # project - The project to use for redacting.
+    # user - The user viewing the notes.
+
+    # Possible options:
+    # requested_path - The request path.
+    # project_wiki - The project's wiki.
+    # ref - The current Git reference.
+    # only_path - flag to turn relative paths into absolute ones.
+    # xhtml - flag to save the html in XHTML
+    def execute(notes, project, **opts)
+      renderer = Banzai::ObjectRenderer.new(project, current_user, **opts)
+
+      renderer.render(notes, :note)
+    end
+  end
+end
diff --git a/app/services/projects/count_service.rb b/app/services/projects/count_service.rb
index aa034315280..7e575b2d6f3 100644
--- a/app/services/projects/count_service.rb
+++ b/app/services/projects/count_service.rb
@@ -1,7 +1,7 @@
 module Projects
   # Base class for the various service classes that count project data (e.g.
   # issues or forks).
-  class CountService
+  class CountService < BaseCountService
     # The version of the cache format. This should be bumped whenever the
     # underlying logic changes. This removes the need for explicitly flushing
     # all caches.
@@ -11,29 +11,6 @@ module Projects
       @project = project
     end
 
-    def relation_for_count
-      raise(
-        NotImplementedError,
-        '"relation_for_count" must be implemented and return an ActiveRecord::Relation'
-      )
-    end
-
-    def count
-      Rails.cache.fetch(cache_key) { uncached_count }
-    end
-
-    def refresh_cache
-      Rails.cache.write(cache_key, uncached_count)
-    end
-
-    def uncached_count
-      relation_for_count.count
-    end
-
-    def delete_cache
-      Rails.cache.delete(cache_key)
-    end
-
     def cache_key_name
       raise(
         NotImplementedError,
diff --git a/app/services/projects/forks_count_service.rb b/app/services/projects/forks_count_service.rb
index 3a0fa84b868..d9bdf3a8ad7 100644
--- a/app/services/projects/forks_count_service.rb
+++ b/app/services/projects/forks_count_service.rb
@@ -1,6 +1,6 @@
 module Projects
   # Service class for getting and caching the number of forks of a project.
-  class ForksCountService < CountService
+  class ForksCountService < Projects::CountService
     def relation_for_count
       @project.forks
     end
diff --git a/app/services/projects/import_service.rb b/app/services/projects/import_service.rb
index 455b302d819..c3b11341b4d 100644
--- a/app/services/projects/import_service.rb
+++ b/app/services/projects/import_service.rb
@@ -4,8 +4,18 @@ module Projects
 
     Error = Class.new(StandardError)
 
+    # Returns true if this importer is supposed to perform its work in the
+    # background.
+    #
+    # This method will only return `true` if async importing is explicitly
+    # supported by an importer class (`Gitlab::GithubImport::ParallelImporter`
+    # for example).
+    def async?
+      has_importer? && !!importer_class.try(:async?)
+    end
+
     def execute
-      add_repository_to_project unless project.gitlab_project_import?
+      add_repository_to_project
 
       import_data
 
@@ -17,6 +27,14 @@ module Projects
     private
 
     def add_repository_to_project
+      if project.external_import? && !unknown_url?
+        raise Error, 'Blocked import URL.' if Gitlab::UrlBlocker.blocked_url?(project.import_url)
+      end
+
+      # We should skip the repository for a GitHub import or GitLab project import,
+      # because these importers fetch the project repositories for us.
+      return if has_importer? && importer_class.try(:imports_repository?)
+
       if unknown_url?
         # In this case, we only want to import issues, not a repository.
         create_repository
@@ -32,12 +50,6 @@ module Projects
     end
 
     def import_repository
-      raise Error, 'Blocked import URL.' if Gitlab::UrlBlocker.blocked_url?(project.import_url)
-
-      # We should return early for a GitHub import because the new GitHub
-      # importer fetch the project repositories for us.
-      return if project.github_import?
-
       begin
         if project.gitea_import?
           fetch_repository
@@ -75,12 +87,16 @@ module Projects
       end
     end
 
+    def importer_class
+      @importer_class ||= Gitlab::ImportSources.importer(project.import_type)
+    end
+
     def has_importer?
       Gitlab::ImportSources.importer_names.include?(project.import_type)
     end
 
     def importer
-      Gitlab::ImportSources.importer(project.import_type).new(project)
+      importer_class.new(project)
     end
 
     def unknown_url?
diff --git a/app/services/projects/open_issues_count_service.rb b/app/services/projects/open_issues_count_service.rb
index 3c0d186a73c..25de97325e2 100644
--- a/app/services/projects/open_issues_count_service.rb
+++ b/app/services/projects/open_issues_count_service.rb
@@ -1,7 +1,7 @@
 module Projects
   # Service class for counting and caching the number of open issues of a
   # project.
-  class OpenIssuesCountService < CountService
+  class OpenIssuesCountService < Projects::CountService
     def relation_for_count
       # We don't include confidential issues in this number since this would
       # expose the number of confidential issues to non project members.
diff --git a/app/services/projects/open_merge_requests_count_service.rb b/app/services/projects/open_merge_requests_count_service.rb
index 2a90f78b90d..77e6448fd5e 100644
--- a/app/services/projects/open_merge_requests_count_service.rb
+++ b/app/services/projects/open_merge_requests_count_service.rb
@@ -1,7 +1,7 @@
 module Projects
   # Service class for counting and caching the number of open merge requests of
   # a project.
-  class OpenMergeRequestsCountService < CountService
+  class OpenMergeRequestsCountService < Projects::CountService
     def relation_for_count
       @project.merge_requests.opened
     end
diff --git a/app/services/system_note_service.rb b/app/services/system_note_service.rb
index 69bd19c1977..e946218824c 100644
--- a/app/services/system_note_service.rb
+++ b/app/services/system_note_service.rb
@@ -481,17 +481,7 @@ module SystemNoteService
   #
   # Returns Boolean
   def cross_reference_exists?(noteable, mentioner)
-    # Initial scope should be system notes of this noteable type
-    notes = Note.system.where(noteable_type: noteable.class)
-
-    notes =
-      if noteable.is_a?(Commit)
-        # Commits have non-integer IDs, so they're stored in `commit_id`
-        notes.where(commit_id: noteable.id)
-      else
-        notes.where(noteable_id: noteable.id)
-      end
-
+    notes = noteable.notes.system
     notes_for_mentioner(mentioner, noteable, notes).exists?
   end
 
diff --git a/app/services/users/keys_count_service.rb b/app/services/users/keys_count_service.rb
new file mode 100644
index 00000000000..f82d27eded9
--- /dev/null
+++ b/app/services/users/keys_count_service.rb
@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+
+module Users
+  # Service class for getting the number of SSH keys that belong to a user.
+  class KeysCountService < BaseCountService
+    attr_reader :user
+
+    # user - The User for which to get the number of SSH keys.
+    def initialize(user)
+      @user = user
+    end
+
+    def relation_for_count
+      user.keys
+    end
+
+    def raw?
+      # Since we're storing simple integers we don't need all of the additional
+      # Marshal data Rails includes by default.
+      true
+    end
+
+    def cache_key
+      "users/key-count-service/#{user.id}"
+    end
+  end
+end
diff --git a/app/validators/abstract_path_validator.rb b/app/validators/abstract_path_validator.rb
new file mode 100644
index 00000000000..adbccb65a84
--- /dev/null
+++ b/app/validators/abstract_path_validator.rb
@@ -0,0 +1,38 @@
+class AbstractPathValidator < ActiveModel::EachValidator
+  extend Gitlab::EncodingHelper
+
+  def self.path_regex
+    raise NotImplementedError
+  end
+
+  def self.format_regex
+    raise NotImplementedError
+  end
+
+  def self.format_error_message
+    raise NotImplementedError
+  end
+
+  def self.full_path(record, value)
+    value
+  end
+
+  def self.valid_path?(path)
+    encode!(path)
+    "#{path}/" =~ path_regex
+  end
+
+  def validate_each(record, attribute, value)
+    unless value =~ self.class.format_regex
+      record.errors.add(attribute, self.class.format_error_message)
+      return
+    end
+
+    full_path = self.class.full_path(record, value)
+    return unless full_path
+
+    unless self.class.valid_path?(full_path)
+      record.errors.add(attribute, "#{value} is a reserved name")
+    end
+  end
+end
diff --git a/app/validators/cluster_name_validator.rb b/app/validators/cluster_name_validator.rb
new file mode 100644
index 00000000000..13ec342f399
--- /dev/null
+++ b/app/validators/cluster_name_validator.rb
@@ -0,0 +1,24 @@
+# ClusterNameValidator
+#
+# Custom validator for ClusterName.
+class ClusterNameValidator < ActiveModel::EachValidator
+  def validate_each(record, attribute, value)
+    if record.user?
+      unless value.present?
+        record.errors.add(attribute, " has to be present")
+      end
+    elsif record.gcp?
+      if record.persisted? && record.name_changed?
+        record.errors.add(attribute, " can not be changed because it's synchronized with provider")
+      end
+
+      unless value.length >= 1 && value.length <= 63
+        record.errors.add(attribute, " is invalid syntax")
+      end
+
+      unless value =~ Gitlab::Regex.kubernetes_namespace_regex
+        record.errors.add(attribute, Gitlab::Regex.kubernetes_namespace_regex_message)
+      end
+    end
+  end
+end
diff --git a/app/validators/dynamic_path_validator.rb b/app/validators/dynamic_path_validator.rb
deleted file mode 100644
index 4688aabc2a8..00000000000
--- a/app/validators/dynamic_path_validator.rb
+++ /dev/null
@@ -1,53 +0,0 @@
-# DynamicPathValidator
-#
-# Custom validator for GitLab path values.
-# These paths are assigned to `Namespace` (& `Group` as a subclass) & `Project`
-#
-# Values are checked for formatting and exclusion from a list of illegal path
-# names.
-class DynamicPathValidator < ActiveModel::EachValidator
-  extend Gitlab::EncodingHelper
-
-  class << self
-    def valid_user_path?(path)
-      encode!(path)
-      "#{path}/" =~ Gitlab::PathRegex.root_namespace_path_regex
-    end
-
-    def valid_group_path?(path)
-      encode!(path)
-      "#{path}/" =~ Gitlab::PathRegex.full_namespace_path_regex
-    end
-
-    def valid_project_path?(path)
-      encode!(path)
-      "#{path}/" =~ Gitlab::PathRegex.full_project_path_regex
-    end
-  end
-
-  def path_valid_for_record?(record, value)
-    full_path = record.respond_to?(:build_full_path) ? record.build_full_path : value
-
-    return true unless full_path
-
-    case record
-    when Project
-      self.class.valid_project_path?(full_path)
-    when Group
-      self.class.valid_group_path?(full_path)
-    else # User or non-Group Namespace
-      self.class.valid_user_path?(full_path)
-    end
-  end
-
-  def validate_each(record, attribute, value)
-    unless value =~ Gitlab::PathRegex.namespace_format_regex
-      record.errors.add(attribute, Gitlab::PathRegex.namespace_format_message)
-      return
-    end
-
-    unless path_valid_for_record?(record, value)
-      record.errors.add(attribute, "#{value} is a reserved name")
-    end
-  end
-end
diff --git a/app/validators/namespace_path_validator.rb b/app/validators/namespace_path_validator.rb
new file mode 100644
index 00000000000..4a0aa64ae0c
--- /dev/null
+++ b/app/validators/namespace_path_validator.rb
@@ -0,0 +1,19 @@
+class NamespacePathValidator < AbstractPathValidator
+  extend Gitlab::EncodingHelper
+
+  def self.path_regex
+    Gitlab::PathRegex.full_namespace_path_regex
+  end
+
+  def self.format_regex
+    Gitlab::PathRegex.namespace_format_regex
+  end
+
+  def self.format_error_message
+    Gitlab::PathRegex.namespace_format_message
+  end
+
+  def self.full_path(record, value)
+    record.build_full_path
+  end
+end
diff --git a/app/validators/project_path_validator.rb b/app/validators/project_path_validator.rb
new file mode 100644
index 00000000000..829b596ad3c
--- /dev/null
+++ b/app/validators/project_path_validator.rb
@@ -0,0 +1,19 @@
+class ProjectPathValidator < AbstractPathValidator
+  extend Gitlab::EncodingHelper
+
+  def self.path_regex
+    Gitlab::PathRegex.full_project_path_regex
+  end
+
+  def self.format_regex
+    Gitlab::PathRegex.project_path_format_regex
+  end
+
+  def self.format_error_message
+    Gitlab::PathRegex.project_path_format_message
+  end
+
+  def self.full_path(record, value)
+    record.build_full_path
+  end
+end
diff --git a/app/validators/user_path_validator.rb b/app/validators/user_path_validator.rb
new file mode 100644
index 00000000000..adf02901802
--- /dev/null
+++ b/app/validators/user_path_validator.rb
@@ -0,0 +1,15 @@
+class UserPathValidator < AbstractPathValidator
+  extend Gitlab::EncodingHelper
+
+  def self.path_regex
+    Gitlab::PathRegex.root_namespace_path_regex
+  end
+
+  def self.format_regex
+    Gitlab::PathRegex.namespace_format_regex
+  end
+
+  def self.format_error_message
+    Gitlab::PathRegex.namespace_format_message
+  end
+end
diff --git a/app/views/admin/appearances/_form.html.haml b/app/views/admin/appearances/_form.html.haml
index 935787d1a4a..4a2238fe277 100644
--- a/app/views/admin/appearances/_form.html.haml
+++ b/app/views/admin/appearances/_form.html.haml
@@ -43,7 +43,7 @@
       = f.hidden_field :header_logo_cache
       = f.file_field :header_logo, class: ""
       .hint
-        Maximum file size is 1MB. Pages are optimized for a 72x72 px header logo
+        Maximum file size is 1MB. Pages are optimized for a 28px tall header logo
 
   .form-actions
     = f.submit 'Save', class: 'btn btn-save append-right-10'
diff --git a/app/views/admin/background_jobs/show.html.haml b/app/views/admin/background_jobs/show.html.haml
index 3ef8f2a3acb..f0cc4d7ee62 100644
--- a/app/views/admin/background_jobs/show.html.haml
+++ b/app/views/admin/background_jobs/show.html.haml
@@ -42,4 +42,4 @@
 
 
   .panel.panel-default
-    %iframe{ src: sidekiq_path, width: '100%', height: 970, style: "border: none" }
+    %iframe{ src: sidekiq_path, width: '100%', height: 970, style: "border: 0" }
diff --git a/app/views/admin/runners/index.html.haml b/app/views/admin/runners/index.html.haml
index 4965dffab9d..4f60be698e9 100644
--- a/app/views/admin/runners/index.html.haml
+++ b/app/views/admin/runners/index.html.haml
@@ -64,7 +64,7 @@
               %th Projects
               %th Jobs
               %th Tags
-              %th Last contact
+              %th= link_to 'Last contact', admin_runners_path(params.slice(:search).merge(sort: 'contacted_asc'))
               %th
 
           - @runners.each do |runner|
diff --git a/app/views/admin/runners/show.html.haml b/app/views/admin/runners/show.html.haml
index df2bf27be9d..6d8fad0eb8d 100644
--- a/app/views/admin/runners/show.html.haml
+++ b/app/views/admin/runners/show.html.haml
@@ -99,7 +99,7 @@
 
           %td.build-link
             - if project
-              = link_to ci_status_path(build.pipeline) do
+              = link_to pipeline_path(build.pipeline) do
                 %strong= build.pipeline.short_sha
 
           %td.timestamp
diff --git a/app/views/dashboard/projects/_blank_state_admin_welcome.html.haml b/app/views/dashboard/projects/_blank_state_admin_welcome.html.haml
index 57544559824..573a4b93d67 100644
--- a/app/views/dashboard/projects/_blank_state_admin_welcome.html.haml
+++ b/app/views/dashboard/projects/_blank_state_admin_welcome.html.haml
@@ -1,33 +1,41 @@
-.blank-state
-  .blank-state-icon
-    = custom_icon("add_new_user", size: 50)
-  .blank-state-body
-    %h3.blank-state-title
-      Add user
-    %p.blank-state-text
-      Add your team members and others to GitLab.
-    = link_to new_admin_user_path, class: "btn btn-new" do
-      New user
+.blank-state-row
+  = link_to new_project_path, class: "blank-state-link" do
+    .blank-state
+      .blank-state-icon
+        = custom_icon("add_new_project", size: 50)
+      .blank-state-body
+        %h3.blank-state-title
+          Create a project
+        %p.blank-state-text
+          Projects are where you store your code, access issues, wiki and other features of GitLab.
 
-.blank-state
-  .blank-state-icon
-    = custom_icon("configure_server", size: 50)
-  .blank-state-body
-    %h3.blank-state-title
-      Configure GitLab
-    %p.blank-state-text
-      Make adjustments to how your GitLab instance is set up.
-    = link_to admin_root_path, class: "btn btn-new" do
-      Configure
+  - if current_user.can_create_group?
+    = link_to admin_root_path, class: "blank-state-link" do
+      .blank-state
+        .blank-state-icon
+          = custom_icon("add_new_group", size: 50)
+        .blank-state-body
+          %h3.blank-state-title
+            Create a group
+          %p.blank-state-text
+            Groups are a great way to organize projects and people.
 
-- if current_user.can_create_group?
-  .blank-state
-    .blank-state-icon
-      = custom_icon("add_new_group", size: 50)
-    .blank-state-body
-      %h3.blank-state-title
-        Create a group
-      %p.blank-state-text
-        Groups are a great way to organize projects and people.
-      = link_to new_group_path, class: "btn btn-new" do
-        New group
+    = link_to new_admin_user_path, class: "blank-state-link" do
+      .blank-state
+        .blank-state-icon
+          = custom_icon("add_new_user", size: 50)
+        .blank-state-body
+          %h3.blank-state-title
+            Add people
+          %p.blank-state-text
+            Add your team members and others to GitLab.
+
+  = link_to admin_root_path, class: "blank-state-link" do
+    .blank-state
+      .blank-state-icon
+        = custom_icon("configure_server", size: 50)
+      .blank-state-body
+        %h3.blank-state-title
+          Configure GitLab
+        %p.blank-state-text
+          Make adjustments to how your GitLab instance is set up.
diff --git a/app/views/dashboard/projects/_blank_state_welcome.html.haml b/app/views/dashboard/projects/_blank_state_welcome.html.haml
index a93a3415ee1..8d5bddbb288 100644
--- a/app/views/dashboard/projects/_blank_state_welcome.html.haml
+++ b/app/views/dashboard/projects/_blank_state_welcome.html.haml
@@ -1,48 +1,58 @@
 - public_project_count = ProjectsFinder.new(current_user: current_user).execute.count
 
-- if current_user.can_create_group?
-  .blank-state
-    .blank-state-icon
-      = custom_icon("add_new_group", size: 50)
-    .blank-state-body
-      %h3.blank-state-title
-        Create a group for several dependent projects.
-      %p.blank-state-text
-        Groups are the best way to manage projects and members.
-      = link_to new_group_path, class: "btn btn-new" do
-        New group
+.blank-state-row
+  - if current_user.can_create_project?
+    = link_to new_project_path, class: "blank-state-link" do
+      .blank-state
+        .blank-state-icon
+          = custom_icon("add_new_project", size: 50)
+        .blank-state-body
+          %h3.blank-state-title
+            Create a project
+          %p.blank-state-text
+            Projects are where you store your code, access issues, wiki and other features of GitLab.
+  - else
+    .blank-state
+      .blank-state-icon
+        = custom_icon("add_new_project", size: 50)
+      .blank-state-body
+        %h3.blank-state-title
+          Create a project
+        %p.blank-state-text
+          If you are added to a project, it will be displayed here.
 
-.blank-state
-  .blank-state-icon
-    = custom_icon("add_new_project", size: 50)
-  .blank-state-body
-    %h3.blank-state-title
-      Create a project
-    %p.blank-state-text
-      - if current_user.can_create_project?
-        You don't have access to any projects right now.
-        You can create up to
-        %strong= number_with_delimiter(current_user.projects_limit)
-        = succeed "." do
-          = "project".pluralize(current_user.projects_limit)
-      - else
-        If you are added to a project, it will be displayed here.
-    - if current_user.can_create_project?
-      = link_to new_project_path, class: "btn btn-new" do
-        New project
+  - if current_user.can_create_group?
+    = link_to new_group_path, class: "blank-state-link" do
+      .blank-state
+        .blank-state-icon
+          = custom_icon("add_new_group", size: 50)
+        .blank-state-body
+          %h3.blank-state-title
+            Create a group
+          %p.blank-state-text
+            Groups are the best way to manage projects and members.
 
-- if public_project_count > 0
-  .blank-state
-    .blank-state-icon
-      = custom_icon("globe", size: 50)
-    .blank-state-body
-      %h3.blank-state-title
-        Explore public projects
-      %p.blank-state-text
-        There are
-        = number_with_delimiter(public_project_count)
-        public projects on this server.
-        Public projects are an easy way to allow
-        everyone to have read-only access.
-      = link_to trending_explore_projects_path, class: "btn btn-new" do
-        Browse projects
+  - if public_project_count > 0
+    = link_to trending_explore_projects_path, class: "blank-state-link" do
+      .blank-state
+        .blank-state-icon
+          = custom_icon("globe", size: 50)
+        .blank-state-body
+          %h3.blank-state-title
+            Explore public projects
+          %p.blank-state-text
+            There are
+            = number_with_delimiter(public_project_count)
+            public projects on this server.
+            Public projects are an easy way to allow
+            everyone to have read-only access.
+
+  = link_to "https://docs.gitlab.com/", class: "blank-state-link" do
+    .blank-state
+      .blank-state-icon
+        = custom_icon("lightbulb", size: 50)
+      .blank-state-body
+        %h3.blank-state-title
+          Learn more about GitLab
+        %p.blank-state-text
+          Take a look at the documentation to discover all of GitLab's capabilities.
diff --git a/app/views/dashboard/projects/_zero_authorized_projects.html.haml b/app/views/dashboard/projects/_zero_authorized_projects.html.haml
index ad3fac6d164..18a82feb189 100644
--- a/app/views/dashboard/projects/_zero_authorized_projects.html.haml
+++ b/app/views/dashboard/projects/_zero_authorized_projects.html.haml
@@ -1,12 +1,13 @@
-.row.blank-state-parent-container
+.blank-state-parent-container
   .section-container.section-welcome{ class: "#{ 'section-admin-welcome' if current_user.admin? }" }
     .container.section-body
-      .blank-state.blank-state-welcome
-        %h2.blank-state-welcome-title
-          Welcome to GitLab
-        %p.blank-state-text
-          Code, test, and deploy together
-      - if current_user.admin?
-        = render "blank_state_admin_welcome"
-      - else
-        = render "blank_state_welcome"
+      .row
+        .blank-state-welcome
+          %h2.blank-state-welcome-title
+            Welcome to GitLab
+          %p.blank-state-text
+            Code, test, and deploy together
+        - if current_user.admin?
+          = render "blank_state_admin_welcome"
+        - else
+          = render "blank_state_welcome"
diff --git a/app/views/dashboard/todos/_todo.html.haml b/app/views/dashboard/todos/_todo.html.haml
index 38fd053ae65..efe1fb99efc 100644
--- a/app/views/dashboard/todos/_todo.html.haml
+++ b/app/views/dashboard/todos/_todo.html.haml
@@ -36,7 +36,7 @@
     .todo-body
       .todo-note
         .md
-          = event_note(todo.body, project: todo.project)
+          = first_line_in_markdown(todo, :body, 150, project: todo.project)
 
   - if todo.pending?
     .todo-actions
diff --git a/app/views/doorkeeper/applications/_form.html.haml b/app/views/doorkeeper/applications/_form.html.haml
index b3313c7c985..cf0e0de1ca4 100644
--- a/app/views/doorkeeper/applications/_form.html.haml
+++ b/app/views/doorkeeper/applications/_form.html.haml
@@ -1,4 +1,4 @@
-= form_for application, url: doorkeeper_submit_path(application), html: {role: 'form'} do |f|
+= form_for application, url: doorkeeper_submit_path(application), html: { role: 'form', class: 'doorkeeper-app-form' } do |f|
   = form_errors(application)
 
   .form-group
diff --git a/app/views/doorkeeper/authorizations/new.html.haml b/app/views/doorkeeper/authorizations/new.html.haml
index 8ba88906714..6d9c6b5572a 100644
--- a/app/views/doorkeeper/authorizations/new.html.haml
+++ b/app/views/doorkeeper/authorizations/new.html.haml
@@ -1,5 +1,5 @@
 %main{ :role => "main" }
-  .modal-no-backdrop
+  .modal-no-backdrop.modal-doorkeepr-auth
     .modal-content
       .modal-header
         %h3.page-title
@@ -16,14 +16,26 @@
               %strong= @pre_auth.client.name
               will allow them to interact with GitLab as an admin as well. Proceed with caution.
         %p
-          You are about to authorize
+          An application called
           = link_to @pre_auth.client.name, @pre_auth.redirect_uri, target: '_blank', rel: 'noopener noreferrer'
-          to use your account.
-          - if @pre_auth.scopes
+          is requesting access to your GitLab account.
+
+          - auth_app_owner = @pre_auth.client.application.owner
+          - if auth_app_owner
+            This application was created by
+            = succeed "." do
+              = link_to auth_app_owner.name, user_path(auth_app_owner)
+
+          Please note that this application is not provided by GitLab and you should verify its authenticity before
+          allowing access.
+        - if @pre_auth.scopes
+          %p
             This application will be able to:
             %ul
               - @pre_auth.scopes.each do |scope|
-                %li= t scope, scope: [:doorkeeper, :scopes]
+                %li
+                  %strong= t scope, scope: [:doorkeeper, :scopes]
+                  .scope-description= t scope, scope: [:doorkeeper, :scope_desc]
         .form-actions.text-right
           = form_tag oauth_authorization_path, method: :delete, class: 'inline'  do
             = hidden_field_tag :client_id, @pre_auth.client.uid
diff --git a/app/views/events/_event_note.atom.haml b/app/views/events/_event_note.atom.haml
index 6fa2f9bd4db..7e264eb5575 100644
--- a/app/views/events/_event_note.atom.haml
+++ b/app/views/events/_event_note.atom.haml
@@ -1,2 +1,2 @@
 %div{ xmlns: "http://www.w3.org/1999/xhtml" }
-  = markdown(note.note, pipeline: :atom, project: note.project, author: note.author)
+  = markdown_field(note, :note)
diff --git a/app/views/events/event/_note.html.haml b/app/views/events/event/_note.html.haml
index df4b9562215..de6383e4097 100644
--- a/app/views/events/event/_note.html.haml
+++ b/app/views/events/event/_note.html.haml
@@ -10,7 +10,7 @@
 .event-body
   .event-note
     .md
-      = event_note(event.target.note, project: event.project)
+      = first_line_in_markdown(event.target, :note, 150, project: event.project)
     - note = event.target
     - if note.attachment.url
       - if note.attachment.image?
diff --git a/app/views/layouts/_search.html.haml b/app/views/layouts/_search.html.haml
index 29387d6627e..4c5cc249159 100644
--- a/app/views/layouts/_search.html.haml
+++ b/app/views/layouts/_search.html.haml
@@ -5,7 +5,7 @@
 - if @group && @group.persisted? && @group.path
   - group_data_attrs = { group_path: j(@group.path), name: @group.name, issues_path: issues_group_path(j(@group.path)), mr_path: merge_requests_group_path(j(@group.path)) }
 - if @project && @project.persisted?
-  - project_data_attrs = { project_path: j(@project.path), name: j(@project.name), issues_path: project_issues_path(@project), mr_path: project_merge_requests_path(@project) }
+  - project_data_attrs = { project_path: j(@project.path), name: j(@project.name), issues_path: project_issues_path(@project), mr_path: project_merge_requests_path(@project), issues_disabled: !@project.issues_enabled? }
 .search.search-form{ class: "#{'has-location-badge' if label.present?}" }
   = form_tag search_path, method: :get, class: 'navbar-form' do |f|
     .search-input-container
diff --git a/app/views/layouts/header/_default.html.haml b/app/views/layouts/header/_default.html.haml
index 5ff6ac5fc00..e2407f6a428 100644
--- a/app/views/layouts/header/_default.html.haml
+++ b/app/views/layouts/header/_default.html.haml
@@ -7,7 +7,7 @@
           = link_to root_path, title: 'Dashboard', id: 'logo' do
             = brand_header_logo
             %span.logo-text.hidden-xs
-              = render 'shared/logo_type.svg'
+              = brand_header_logo_type
 
         - if current_user
           = render "layouts/nav/dashboard"
@@ -61,7 +61,7 @@
                       = link_to "Help", help_path
                   %li.divider
                   %li
-                    = link_to "Sign out", destroy_user_session_path, method: :delete, class: "sign-out-link"
+                    = link_to "Sign out", destroy_user_session_path, class: "sign-out-link"
             - if session[:impersonator_id]
               %li.impersonation
                 = link_to admin_impersonation_path, class: 'impersonation-btn', method: :delete, title: "Stop impersonation", aria: { label: 'Stop impersonation' }, data: { toggle: 'tooltip', placement: 'bottom', container: 'body' } do
diff --git a/app/views/notify/_note_email.html.haml b/app/views/notify/_note_email.html.haml
index a80518f7986..3e36da31ea3 100644
--- a/app/views/notify/_note_email.html.haml
+++ b/app/views/notify/_note_email.html.haml
@@ -1,10 +1,15 @@
 - discussion = @note.discussion if @note.part_of_discussion?
+- diff_discussion = discussion&.diff_discussion?
+- on_image = discussion.on_image? if diff_discussion
+
 - if discussion
+  - phrase_end_char = on_image ? "." : ":"
+
   %p.details
-    = succeed ':' do
+    = succeed phrase_end_char do
       = link_to @note.author_name, user_url(@note.author)
 
-      - if discussion.diff_discussion?
+      - if diff_discussion
         - if discussion.new_discussion?
           started a new discussion
         - else
@@ -21,7 +26,7 @@
   %p.details
     #{link_to @note.author_name, user_url(@note.author)} commented:
 
-- if discussion&.diff_discussion?
+- if diff_discussion && !on_image
   = content_for :head do
     = stylesheet_link_tag 'mailers/highlighted_diff_email'
 
diff --git a/app/views/projects/clusters/_advanced_settings.html.haml b/app/views/projects/clusters/_advanced_settings.html.haml
index 6c162481dd8..97532f1e2bd 100644
--- a/app/views/projects/clusters/_advanced_settings.html.haml
+++ b/app/views/projects/clusters/_advanced_settings.html.haml
@@ -10,5 +10,5 @@
     %label.text-danger
       = s_('ClusterIntegration|Remove cluster integration')
     %p
-      = s_('ClusterIntegration|Removing cluster integration will remove the cluster configuration you have added to this project. It will not delete your project.')
+      = s_('ClusterIntegration|Removing cluster integration will remove the cluster configuration you have added to this project. It will not delete your cluster on Google Container Engine.')
     = link_to(s_('ClusterIntegration|Remove integration'), namespace_project_cluster_path(@project.namespace, @project, @cluster.id), method: :delete, class: 'btn btn-danger', data: { confirm: "Are you sure you want to remove cluster integration from this project? This will not delete your cluster on Google Container Engine"})
diff --git a/app/views/projects/clusters/_form.html.haml b/app/views/projects/clusters/_form.html.haml
index 371cdb1e403..1f8ae463d0f 100644
--- a/app/views/projects/clusters/_form.html.haml
+++ b/app/views/projects/clusters/_form.html.haml
@@ -4,34 +4,32 @@
       - link_to_help_page = link_to(s_('ClusterIntegration|help page'), help_page_path('user/project/clusters/index'), target: '_blank', rel: 'noopener noreferrer')
       = s_('ClusterIntegration|Read our %{link_to_help_page} on cluster integration.').html_safe % { link_to_help_page: link_to_help_page}
 
-      = form_for [@project.namespace.becomes(Namespace), @project, @cluster] do |field|
+      = form_for @cluster, url: namespace_project_clusters_path(@project.namespace, @project, @cluster), as: :cluster do |field|
+        = field.hidden_field :provider_type, value: :gcp
         = form_errors(@cluster)
         .form-group
-          = field.label :gcp_cluster_name, s_('ClusterIntegration|Cluster name')
-          = field.text_field :gcp_cluster_name, class: 'form-control'
+          = field.label :name, s_('ClusterIntegration|Cluster name')
+          = field.text_field :name, class: 'form-control'
 
-        .form-group
-          = field.label :gcp_project_id, s_('ClusterIntegration|Google Cloud Platform project ID')
-          = link_to(s_('ClusterIntegration|See your projects'), 'https://console.cloud.google.com/home/dashboard', target: '_blank', rel: 'noopener noreferrer')
-          = field.text_field :gcp_project_id, class: 'form-control'
-
-        .form-group
-          = field.label :gcp_cluster_zone, s_('ClusterIntegration|Zone')
-          = link_to(s_('ClusterIntegration|See zones'), 'https://cloud.google.com/compute/docs/regions-zones/regions-zones', target: '_blank', rel: 'noopener noreferrer')
-          = field.text_field :gcp_cluster_zone, class: 'form-control', placeholder: 'us-central1-a'
+        = field.fields_for :provider_gcp, @cluster.provider_gcp do |provider_gcp_field|
+          .form-group
+            = provider_gcp_field.label :gcp_project_id, s_('ClusterIntegration|Google Cloud Platform project ID')
+            = link_to(s_('ClusterIntegration|See your projects'), 'https://console.cloud.google.com/home/dashboard', target: '_blank', rel: 'noopener noreferrer')
+            = provider_gcp_field.text_field :gcp_project_id, class: 'form-control'
 
-        .form-group
-          = field.label :gcp_cluster_size, s_('ClusterIntegration|Number of nodes')
-          = field.text_field :gcp_cluster_size, class: 'form-control', placeholder: '3'
+          .form-group
+            = provider_gcp_field.label :zone, s_('ClusterIntegration|Zone')
+            = link_to(s_('ClusterIntegration|See zones'), 'https://cloud.google.com/compute/docs/regions-zones/regions-zones', target: '_blank', rel: 'noopener noreferrer')
+            = provider_gcp_field.text_field :zone, class: 'form-control', placeholder: 'us-central1-a'
 
-        .form-group
-          = field.label :gcp_machine_type, s_('ClusterIntegration|Machine type')
-          = link_to(s_('ClusterIntegration|See machine types'), 'https://cloud.google.com/compute/docs/machine-types', target: '_blank', rel: 'noopener noreferrer')
-          = field.text_field :gcp_machine_type, class: 'form-control', placeholder: 'n1-standard-4'
+          .form-group
+            = provider_gcp_field.label :num_nodes, s_('ClusterIntegration|Number of nodes')
+            = provider_gcp_field.text_field :num_nodes, class: 'form-control', placeholder: '3'
 
           .form-group
-          = field.label :project_namespace, s_('ClusterIntegration|Project namespace (optional, unique)')
-          = field.text_field :project_namespace, class: 'form-control', placeholder: @cluster.project_namespace_placeholder
+            = provider_gcp_field.label :machine_type, s_('ClusterIntegration|Machine type')
+            = link_to(s_('ClusterIntegration|See machine types'), 'https://cloud.google.com/compute/docs/machine-types', target: '_blank', rel: 'noopener noreferrer')
+            = provider_gcp_field.text_field :machine_type, class: 'form-control', placeholder: 'n1-standard-2'
 
         .form-group
           = field.submit s_('ClusterIntegration|Create cluster'), class: 'btn btn-save'
diff --git a/app/views/projects/clusters/_header.html.haml b/app/views/projects/clusters/_header.html.haml
index 0134d46491c..beb798e7154 100644
--- a/app/views/projects/clusters/_header.html.haml
+++ b/app/views/projects/clusters/_header.html.haml
@@ -11,4 +11,4 @@
       = s_('ClusterIntegration|Make sure your account %{link_to_requirements} to create clusters').html_safe % { link_to_requirements: link_to_requirements }
     %li
       - link_to_container_project = link_to(s_('ClusterIntegration|Google Container Engine project'), target: '_blank', rel: 'noopener noreferrer')
-      = s_('ClusterIntegration|A %{link_to_container_project} must have been created under this account').html_safe % { link_to_container_project: link_to_container_project }
+      = s_('ClusterIntegration|This account must have permissions to create a cluster in the %{link_to_container_project} specified below').html_safe % { link_to_container_project: link_to_container_project }
diff --git a/app/views/projects/clusters/new.html.haml b/app/views/projects/clusters/new.html.haml
index c538d41ffad..6b321f60212 100644
--- a/app/views/projects/clusters/new.html.haml
+++ b/app/views/projects/clusters/new.html.haml
@@ -1,9 +1,20 @@
 - breadcrumb_title "Cluster"
-- page_title _("New Cluster")
+- page_title _("Cluster")
 
 .row.prepend-top-default
   .col-sm-4
     = render 'sidebar'
   .col-sm-8
-    = render 'header'
-= render 'form'
+    - if @project.kubernetes_service&.active?
+      %h4.prepend-top-0= s_('ClusterIntegration|Cluster management')
+
+      %p= s_('ClusterIntegration|A cluster has been set up on this project through the Kubernetes integration page')
+      = link_to s_('ClusterIntegration|Manage Kubernetes integration'), edit_project_service_path(@project, :kubernetes), class: 'btn append-bottom-20'
+
+    - else
+      %h4.prepend-top-0= s_('ClusterIntegration|Choose how to set up cluster integration')
+
+      %p= s_('ClusterIntegration|Create a new cluster on Google Container Engine right from GitLab')
+      = link_to s_('ClusterIntegration|Create on GKE'), providers_gcp_new_namespace_project_clusters_path(@project.namespace, @project), class: 'btn append-bottom-20'
+      %p= s_('ClusterIntegration|Enter the details for an existing Kubernetes cluster')
+      = link_to s_('ClusterIntegration|Add an existing cluster'), edit_project_service_path(@project, :kubernetes), class: 'btn append-bottom-20'
diff --git a/app/views/projects/clusters/new_gcp.html.haml b/app/views/projects/clusters/new_gcp.html.haml
new file mode 100644
index 00000000000..48e6b6ae8e8
--- /dev/null
+++ b/app/views/projects/clusters/new_gcp.html.haml
@@ -0,0 +1,10 @@
+- breadcrumb_title "Cluster"
+- page_title _("New Cluster")
+
+.row.prepend-top-default
+  .col-sm-4
+    = render 'sidebar'
+  .col-sm-8
+    = render 'header'
+
+= render 'form'
diff --git a/app/views/projects/clusters/show.html.haml b/app/views/projects/clusters/show.html.haml
index dbe6f8beb95..b7671f5e3c4 100644
--- a/app/views/projects/clusters/show.html.haml
+++ b/app/views/projects/clusters/show.html.haml
@@ -4,11 +4,18 @@
 
 - expanded = Rails.env.test?
 
-- status_path = status_namespace_project_cluster_path(@cluster.project.namespace, @cluster.project, @cluster.id, format: :json) if can?(current_user, :admin_cluster, @cluster) && @cluster.on_creation?
+- status_path = status_namespace_project_cluster_path(@cluster.project.namespace, @cluster.project, @cluster.id, format: :json) if can?(current_user, :admin_cluster, @cluster)
 .edit-cluster-form.js-edit-cluster-form{ data: { status_path: status_path,
+  install_helm_path: install_applications_namespace_project_cluster_path(@cluster.project.namespace, @cluster.project, @cluster, :helm),
+  install_ingress_path: install_applications_namespace_project_cluster_path(@cluster.project.namespace, @cluster.project, @cluster, :ingress),
   toggle_status: @cluster.enabled? ? 'true': 'false',
   cluster_status: @cluster.status_name,
-  cluster_status_reason: @cluster.status_reason } }
+  cluster_status_reason: @cluster.status_reason,
+  help_path: help_page_path('user/project/clusters/index.md', anchor: 'installing-applications') } }
+
+
+  .js-cluster-application-notice
+    .flash-container
 
   %section.settings.no-animate.expanded
     %h4= s_('ClusterIntegration|Enable cluster integration')
@@ -33,7 +40,7 @@
         - else
           = s_('ClusterIntegration|Cluster integration is disabled for this project.')
 
-    = form_for [@project.namespace.becomes(Namespace), @project, @cluster] do |field|
+    = form_for @cluster, url: namespace_project_cluster_path(@project.namespace, @project, @cluster), as: :cluster do |field|
       = form_errors(@cluster)
       .form-group.append-bottom-20
         %label.append-bottom-10
@@ -49,7 +56,9 @@
           .form-group
             = field.submit _('Save'), class: 'btn btn-success'
 
-  %section.settings.no-animate#js-cluster-details{ class: ('expanded' if expanded) }
+  .cluster-applications-table#js-cluster-applications
+
+  %section.settings#js-cluster-details
     .settings-header
       %h4= s_('ClusterIntegration|Cluster details')
       %button.btn.js-settings-toggle
@@ -59,12 +68,12 @@
     .settings-content
 
       .form_group.append-bottom-20
-        %label.append-bottom-10{ for: 'cluter-name' }
+        %label.append-bottom-10{ for: 'cluster-name' }
           = s_('ClusterIntegration|Cluster name')
         .input-group
-          %input.form-control.cluster-name{ value: @cluster.gcp_cluster_name, disabled: true }
+          %input.form-control.cluster-name{ value: @cluster.name, disabled: true }
           %span.input-group-addon.clipboard-addon
-            = clipboard_button(text: @cluster.gcp_cluster_name, title: s_('ClusterIntegration|Copy cluster name'))
+            = clipboard_button(text: @cluster.name, title: s_('ClusterIntegration|Copy cluster name'))
 
   %section.settings.no-animate#js-cluster-advanced-settings{ class: ('expanded' if expanded) }
     .settings-header
diff --git a/app/views/projects/commit/_ajax_signature.html.haml b/app/views/projects/commit/_ajax_signature.html.haml
index 83821326aec..36b28c731a1 100644
--- a/app/views/projects/commit/_ajax_signature.html.haml
+++ b/app/views/projects/commit/_ajax_signature.html.haml
@@ -1,2 +1,2 @@
 - if commit.has_signature?
-  %button{ class: commit_signature_badge_classes('js-loading-gpg-badge'), data: { toggle: 'tooltip', placement: 'auto top', title: 'GPG signature (loading...)', 'commit-sha' => commit.sha } }
+  %a{ href: 'javascript:void(0)', tabindex: 0, class: commit_signature_badge_classes('js-loading-gpg-badge'), data: { toggle: 'tooltip', placement: 'auto top', title: 'GPG signature (loading...)', 'commit-sha' => commit.sha } }
diff --git a/app/views/projects/commit/_commit_box.html.haml b/app/views/projects/commit/_commit_box.html.haml
index ff17372fdd9..8b9c1bbb602 100644
--- a/app/views/projects/commit/_commit_box.html.haml
+++ b/app/views/projects/commit/_commit_box.html.haml
@@ -61,13 +61,13 @@
     %span.cgray= n_('parent', 'parents', @commit.parents.count)
     - @commit.parents.each do |parent|
       = link_to parent.short_id, project_commit_path(@project, parent), class: "commit-sha"
-    %span.commit-info.branches
+    .commit-info.branches
       %i.fa.fa-spinner.fa-spin
 
   - if @commit.last_pipeline
     - last_pipeline = @commit.last_pipeline
     .well-segment.pipeline-info
-      .status-icon-container{ class: "ci-status-icon-#{@commit.status}" }
+      .status-icon-container{ class: "ci-status-icon-#{last_pipeline.status}" }
         = link_to project_pipeline_path(@project, last_pipeline.id) do
           = ci_icon_for_status(last_pipeline.status)
       #{ _('Pipeline') }
diff --git a/app/views/projects/commit/_limit_exceeded_message.html.haml b/app/views/projects/commit/_limit_exceeded_message.html.haml
new file mode 100644
index 00000000000..84a52d49487
--- /dev/null
+++ b/app/views/projects/commit/_limit_exceeded_message.html.haml
@@ -0,0 +1,8 @@
+.has-tooltip{ class: "limit-box limit-box-#{objects} prepend-left-5", data: { title: "Project has too many #{label_for_message} to search"} }
+  .limit-icon
+    - if objects == :branch
+      = icon('code-fork')
+    - else
+      = icon('tag')
+  .limit-message
+    %span #{label_for_message.capitalize} unavailable
diff --git a/app/views/projects/commit/_signature_badge.html.haml b/app/views/projects/commit/_signature_badge.html.haml
index edff018ba6d..44aa8002f12 100644
--- a/app/views/projects/commit/_signature_badge.html.haml
+++ b/app/views/projects/commit/_signature_badge.html.haml
@@ -24,5 +24,5 @@
 
   = link_to('Learn more about signing commits', help_page_path('user/project/repository/gpg_signed_commits/index.md'), class: 'gpg-popover-help-link')
 
-%button{ class: css_classes, data: { toggle: 'popover', html: 'true', placement: 'auto top', title: title, content: content } }
+%a{ href: 'javascript:void(0)', tabindex: 0, class: css_classes, data: { toggle: 'popover', html: 'true', placement: 'auto top', title: title, content: content } }
   = label
diff --git a/app/views/projects/commit/branches.html.haml b/app/views/projects/commit/branches.html.haml
index 911c9ddce06..8611129b356 100644
--- a/app/views/projects/commit/branches.html.haml
+++ b/app/views/projects/commit/branches.html.haml
@@ -1,15 +1,15 @@
-- if @branches.any? || @tags.any?
+- if @branches_limit_exceeded
+  = render 'limit_exceeded_message', objects: :branch, label_for_message: "branches"
+- elsif @branches.any?
   - branch = commit_default_branch(@project, @branches)
-  = link_to(project_ref_path(@project, branch), class: "label label-gray ref-name") do
-    = icon('code-fork')
-    = branch
+  = commit_branch_link(project_ref_path(@project, branch), branch)
 
-  -# `commit_default_branch` deletes the default branch from `@branches`,
-  -# so only render this if we have more branches left
-  - if @branches.any? || @tags.any?
-    %span
-      = link_to "…", "#", class: "js-details-expand label label-gray"
-
-      %span.js-details-content.hide
-        = commit_branches_links(@project, @branches) if @branches.any?
-        = commit_tags_links(@project, @tags) if @tags.any?
+- if @branches.any? || @tags.any? || @tags_limit_exceeded
+  %span
+    = link_to "…", "#", class: "js-details-expand label label-gray"
+    %span.js-details-content.hide
+      = commit_branches_links(@project, @branches)
+      - if @tags_limit_exceeded
+        = render 'limit_exceeded_message', objects: :tag, label_for_message: "tags"
+      - else
+        = commit_tags_links(@project, @tags)
diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml
index a16ffb433a5..a66177f20e9 100644
--- a/app/views/projects/commits/_commit.html.haml
+++ b/app/views/projects/commits/_commit.html.haml
@@ -1,11 +1,6 @@
 - ref = local_assigns.fetch(:ref)
-- if @note_counts
-  - note_count = @note_counts.fetch(commit.id, 0)
-- else
-  - notes = commit.notes
-  - note_count = notes.user.count
 
-- cache_key = [project.full_path, commit.id, current_application_settings, note_count, @path.presence, current_controller?(:commits), I18n.locale]
+- cache_key = [project.full_path, commit.id, current_application_settings, @path.presence, current_controller?(:commits), I18n.locale]
 - cache_key.push(commit.status(ref)) if commit.status(ref)
 
 = cache(cache_key, expires_in: 1.day) do
diff --git a/app/views/projects/issues/_nav_btns.html.haml b/app/views/projects/issues/_nav_btns.html.haml
index 13809da6523..0d39edb7bfd 100644
--- a/app/views/projects/issues/_nav_btns.html.haml
+++ b/app/views/projects/issues/_nav_btns.html.haml
@@ -3,8 +3,8 @@
 - if @can_bulk_update
   = button_tag "Edit issues", class: "btn btn-default append-right-10 js-bulk-update-toggle"
 = link_to "New issue", new_project_issue_path(@project,
-                                              issue: { assignee_id: issues_finder.assignee.try(:id),
-                                                       milestone_id: issues_finder.milestones.first.try(:id) }),
+                                              issue: { assignee_id: finder.assignee.try(:id),
+                                                       milestone_id: finder.milestones.first.try(:id) }),
                                               class: "btn btn-new",
                                               title: "New issue",
                                               id: "new_issue_link"
diff --git a/app/views/projects/issues/_new_branch.html.haml b/app/views/projects/issues/_new_branch.html.haml
index e1b4a49850a..4f78102be0c 100644
--- a/app/views/projects/issues/_new_branch.html.haml
+++ b/app/views/projects/issues/_new_branch.html.haml
@@ -1,3 +1,7 @@
+- can_create_merge_request = can?(current_user, :create_merge_request, @project)
+- data_action = can_create_merge_request ? 'create-mr' : 'create-branch'
+- value = can_create_merge_request ? 'Create a merge request' : 'Create a branch'
+
 - if can?(current_user, :push_code, @project)
   .create-mr-dropdown-wrap{ data: { can_create_path: can_create_branch_project_issue_path(@project, @issue), create_mr_path: create_merge_request_project_issue_path(@project, @issue), create_branch_path: project_branches_path(@project, branch_name: @issue.to_branch_name, issue_iid: @issue.iid) } }
     .btn-group.unavailable
@@ -6,20 +10,21 @@
         %span.text
           Checking branch availability…
     .btn-group.available.hide
-      %input.btn.js-create-merge-request.btn-inverted.btn-success{ type: 'button', value: 'Create a merge request', data: { action: 'create-mr' } }
+      %input.btn.js-create-merge-request.btn-inverted.btn-success{ type: 'button', value: value, data: { action: data_action } }
       %button.btn.btn-inverted.dropdown-toggle.btn-inverted.btn-success.js-dropdown-toggle{ type: 'button', data: { 'dropdown-trigger' => '#create-merge-request-dropdown' } }
         = icon('caret-down')
       %ul#create-merge-request-dropdown.dropdown-menu.dropdown-menu-align-right{ data: { dropdown: true } }
-        %li.droplab-item-selected{ role: 'button', data: { value: 'create-mr', 'text' => 'Create a merge request' } }
-          .menu-item
-            .icon-container
-              = icon('check')
-            .description
-              %strong Create a merge request
-              %span
-                Creates a merge request named after this issue, with source branch created from '#{@project.default_branch}'.
-        %li.divider.droplab-item-ignore
-        %li{ role: 'button', data: {  value: 'create-branch', 'text' => 'Create a branch' } }
+        - if can_create_merge_request
+          %li.droplab-item-selected{ role: 'button', data: { value: 'create-mr', 'text' => 'Create a merge request' } }
+            .menu-item
+              .icon-container
+                = icon('check')
+              .description
+                %strong Create a merge request
+                %span
+                  Creates a merge request named after this issue, with source branch created from '#{@project.default_branch}'.
+          %li.divider.droplab-item-ignore
+        %li{ class: [!can_create_merge_request && 'droplab-item-selected'], role: 'button', data: {  value: 'create-branch', 'text' => 'Create a branch' } }
           .menu-item
             .icon-container
               = icon('check')
diff --git a/app/views/projects/issues/show.html.haml b/app/views/projects/issues/show.html.haml
index b9fec8af4d7..c64eb506412 100644
--- a/app/views/projects/issues/show.html.haml
+++ b/app/views/projects/issues/show.html.haml
@@ -27,9 +27,9 @@
 
     .issuable-meta
       - if @issue.confidential
-        = icon('eye-slash', class: 'issuable-warning-icon')
+        .issuable-warning-icon.inline= sprite_icon('eye-slash', size: 16, css_class: 'icon')
       - if @issue.discussion_locked?
-        = icon('lock', class: 'issuable-warning-icon')
+        .issuable-warning-icon.inline= sprite_icon('lock', size: 16, css_class: 'icon')
       = issuable_meta(@issue, @project, "Issue")
 
   .issuable-actions.js-issuable-actions
diff --git a/app/views/projects/jobs/show.html.haml b/app/views/projects/jobs/show.html.haml
index ce0e3872240..2abd2c9e652 100644
--- a/app/views/projects/jobs/show.html.haml
+++ b/app/views/projects/jobs/show.html.haml
@@ -71,7 +71,7 @@
                     class: 'js-raw-link-controller has-tooltip controllers-buttons' do
               = icon('file-text-o')
 
-          - if can?(current_user, :update_build, @project) && @build.erasable?
+          - if @build.erasable? && can?(current_user, :erase_build, @build)
             = link_to erase_project_job_path(@project, @build),
                       method: :post,
                       data: { confirm: 'Are you sure you want to erase this build?', placement: 'top', container: 'body' },
diff --git a/app/views/projects/merge_requests/_mr_title.html.haml b/app/views/projects/merge_requests/_mr_title.html.haml
index 72d5c4961ec..75b3db7e505 100644
--- a/app/views/projects/merge_requests/_mr_title.html.haml
+++ b/app/views/projects/merge_requests/_mr_title.html.haml
@@ -16,7 +16,7 @@
 
     .issuable-meta
       - if @merge_request.discussion_locked?
-        = icon('lock', class: 'issuable-warning-icon')
+        .issuable-warning-icon.inline= sprite_icon('lock', size: 16, css_class: 'icon')
       = issuable_meta(@merge_request, @project, "Merge request")
 
   .issuable-actions.js-issuable-actions
diff --git a/app/views/projects/pipelines/index.html.haml b/app/views/projects/pipelines/index.html.haml
index f8627a3818b..b2e71cff6ce 100644
--- a/app/views/projects/pipelines/index.html.haml
+++ b/app/views/projects/pipelines/index.html.haml
@@ -9,12 +9,6 @@
     "error-state-svg-path" => image_path('illustrations/pipelines_failed.svg'),
     "new-pipeline-path" => new_project_pipeline_path(@project),
     "can-create-pipeline" => can?(current_user, :create_pipeline, @project).to_s,
-    "all-path" =>  project_pipelines_path(@project),
-    "pending-path" => project_pipelines_path(@project, scope: :pending),
-    "running-path" => project_pipelines_path(@project, scope: :running),
-    "finished-path" => project_pipelines_path(@project, scope: :finished),
-    "branches-path" => project_pipelines_path(@project, scope: :branches),
-    "tags-path" => project_pipelines_path(@project, scope: :tags),
     "has-ci" => @repository.gitlab_ci_yml,
     "ci-lint-path" => ci_lint_path } }
 
diff --git a/app/views/projects/protected_tags/_create_protected_tag.html.haml b/app/views/projects/protected_tags/_create_protected_tag.html.haml
index ea91e8af70e..f53b81cada6 100644
--- a/app/views/projects/protected_tags/_create_protected_tag.html.haml
+++ b/app/views/projects/protected_tags/_create_protected_tag.html.haml
@@ -2,7 +2,7 @@
   .create_access_levels-container
     = dropdown_tag('Select',
                    options: { toggle_class: 'js-allowed-to-create wide',
-                   dropdown_class: 'dropdown-menu-selectable',
+                   dropdown_class: 'dropdown-menu-selectable capitalize-header',
                    data: { field_name: 'protected_tag[create_access_levels_attributes][0][access_level]', input_id: 'create_access_levels_attributes' }})
 
 = render 'projects/protected_tags/shared/create_protected_tag'
diff --git a/app/views/projects/services/prometheus/_show.html.haml b/app/views/projects/services/prometheus/_show.html.haml
index d8e11500964..b0cb5ce5e8f 100644
--- a/app/views/projects/services/prometheus/_show.html.haml
+++ b/app/views/projects/services/prometheus/_show.html.haml
@@ -4,42 +4,39 @@
 .row.prepend-top-default.append-bottom-default.prometheus-metrics-monitoring.js-prometheus-metrics-monitoring
   .col-lg-3
     %h4.prepend-top-0
-      Metrics
+      = s_('PrometheusService|Metrics')
     %p
-      Metrics are automatically configured and monitored
-      based on a library of metrics from popular exporters.
-      = link_to 'More information', help_page_path('user/project/integrations/prometheus')
+      = s_('PrometheusService|Metrics are automatically configured and monitored based on a library of metrics from popular exporters.')
+      = link_to s_('PrometheusService|More information'), help_page_path('user/project/integrations/prometheus')
 
   .col-lg-9
     .panel.panel-default.js-panel-monitored-metrics{ data: { "active-metrics" => "#{project_prometheus_active_metrics_path(@project, :json)}" } }
       .panel-heading
         %h3.panel-title
-          Monitored
+          = s_('PrometheusService|Monitored')
           %span.badge.js-monitored-count 0
       .panel-body
         .loading-metrics.text-center.js-loading-metrics
           = icon('spinner spin 3x', class: 'metrics-load-spinner')
-          %p Finding and configuring metrics...
+          %p
+            = s_('PrometheusService|Finding and configuring metrics...')
         .empty-metrics.text-center.hidden.js-empty-metrics
           = custom_icon('icon_empty_metrics')
-          %p No metrics are being monitored. To start monitoring, deploy to an environment.
-          = link_to project_environments_path(@project), title: 'View environments', class: 'btn btn-success' do
-            View environments
+          %p
+            = s_('PrometheusService|No metrics are being monitored. To start monitoring, deploy to an environment.')
+          = link_to s_('PrometheusService|View environments'), project_environments_path(@project), class: 'btn btn-success'
         %ul.list-unstyled.metrics-list.hidden.js-metrics-list
 
     .panel.panel-default.hidden.js-panel-missing-env-vars
       .panel-heading
         %h3.panel-title
           = icon('caret-right lg fw', class: 'panel-toggle js-panel-toggle', 'aria-label' => 'Toggle panel')
-          Missing environment variable
+          = s_('PrometheusService|Missing environment variable')
           %span.badge.js-env-var-count 0
       .panel-body.hidden
         .flash-container
           .flash-notice
             .flash-text
-              To set up automatic monitoring, add the environment variable
-              %code
-                $CI_ENVIRONMENT_SLUG
-              to exporter&rsquo;s queries.
-              = link_to 'More information', help_page_path('user/project/integrations/prometheus', anchor: 'metrics-and-labels')
+              = s_("PrometheusService|To set up automatic monitoring, add the environment variable %{variable} to exporter's queries." % { variable: "<code>$CI_ENVIRONMENT_SLUG</code>" }).html_safe
+              = link_to s_('PrometheusService|More information'), help_page_path('user/project/integrations/prometheus', anchor: 'metrics-and-labels')
         %ul.list-unstyled.metrics-list.js-missing-var-metrics-list
diff --git a/app/views/projects/tags/_tag.html.haml b/app/views/projects/tags/_tag.html.haml
index 1927216e191..467f19b4c56 100644
--- a/app/views/projects/tags/_tag.html.haml
+++ b/app/views/projects/tags/_tag.html.haml
@@ -7,7 +7,7 @@
 
     - if protected_tag?(@project, tag)
       %span.label.label-success.prepend-left-4
-        protected
+        = s_('TagsPage|protected')
 
     - if tag.message.present?
       &nbsp;
@@ -18,7 +18,7 @@
         = render 'projects/branches/commit', commit: commit, project: @project
     - else
       %p
-        Cant find HEAD commit for this tag
+        = s_("TagsPage|Can't find HEAD commit for this tag")
     - if release && release.description.present?
       .description.prepend-top-default
         .wiki
@@ -28,9 +28,9 @@
     = render 'projects/buttons/download', project: @project, ref: tag.name, pipeline: @tags_pipelines[tag.name]
 
     - if can?(current_user, :push_code, @project)
-      = link_to edit_project_tag_release_path(@project, tag.name), class: 'btn has-tooltip', title: "Edit release notes", data: { container: "body" } do
+      = link_to edit_project_tag_release_path(@project, tag.name), class: 'btn has-tooltip', title: s_('TagsPage|Edit release notes'), data: { container: "body" } do
         = icon("pencil")
 
     - if can?(current_user, :admin_project, @project)
-      = link_to project_tag_path(@project, tag.name), class: "btn btn-remove remove-row has-tooltip #{protected_tag?(@project, tag) ? 'disabled' : ''}", title: "Delete tag", method: :delete, data: { confirm: "Deleting the '#{tag.name}' tag cannot be undone. Are you sure?", container: 'body' }, remote: true do
+      = link_to project_tag_path(@project, tag.name), class: "btn btn-remove remove-row has-tooltip #{protected_tag?(@project, tag) ? 'disabled' : ''}", title: s_('TagsPage|Delete tag'), method: :delete, data: { confirm: s_('TagsPage|Deleting the %{tag_name} tag cannot be undone. Are you sure?') % { tag_name: tag.name }, container: 'body' }, remote: true do
         = icon("trash-o")
diff --git a/app/views/projects/tags/index.html.haml b/app/views/projects/tags/index.html.haml
index 27d58d4c0e8..fd3b8c01b83 100644
--- a/app/views/projects/tags/index.html.haml
+++ b/app/views/projects/tags/index.html.haml
@@ -1,16 +1,16 @@
 - @no_container = true
 - @sort ||= sort_value_recently_updated
-- page_title "Tags"
+- page_title _('TagsPage|Tags')
 - add_to_breadcrumbs("Repository", project_tree_path(@project))
 
 .flex-list{ class: container_class }
   .top-area.adjust
     .nav-text.row-main-content
-      Tags give the ability to mark specific points in history as being important
+      = s_('TagsPage|Tags give the ability to mark specific points in history as being important')
 
     .nav-controls.row-fixed-content
       = form_tag(filter_tags_path, method: :get) do
-        = search_field_tag :search, params[:search], { placeholder: 'Filter by tag name', id: 'tag-search', class: 'form-control search-text-input input-short', spellcheck: false }
+        = search_field_tag :search, params[:search], { placeholder: s_('TagsPage|Filter by tag name'), id: 'tag-search', class: 'form-control search-text-input input-short', spellcheck: false }
 
       .dropdown
         %button.dropdown-toggle{ type: 'button', data: { toggle: 'dropdown'} }
@@ -19,13 +19,13 @@
           = icon('chevron-down')
         %ul.dropdown-menu.dropdown-menu-align-right.dropdown-menu-selectable
           %li.dropdown-header
-            Sort by
+            = s_('TagsPage|Sort by')
           - tags_sort_options_hash.each do |value, title|
             %li
               = link_to title, filter_tags_path(sort: value), class: ("is-active" if @sort == value)
       - if can?(current_user, :push_code, @project)
         = link_to new_project_tag_path(@project), class: 'btn btn-create new-tag-btn' do
-          New tag
+          = s_('TagsPage|New tag')
 
   .tags
     - if @tags.any?
@@ -36,9 +36,9 @@
 
     - else
       .nothing-here-block
-        Repository has no tags yet.
+        = s_('TagsPage|Repository has no tags yet.')
         %br
         %small
-          Use git tag command to add a new one:
+          = s_('TagsPage|Use git tag command to add a new one:')
           %br
           %span.monospace git tag -a v1.4 -m 'version 1.4'
diff --git a/app/views/projects/tags/new.html.haml b/app/views/projects/tags/new.html.haml
index 521b4d927bc..031efa903c5 100644
--- a/app/views/projects/tags/new.html.haml
+++ b/app/views/projects/tags/new.html.haml
@@ -1,4 +1,4 @@
-- page_title "New Tag"
+- page_title s_('TagsPage|New Tag')
 - default_ref = params[:ref] || @project.default_branch
 
 - if @error
@@ -7,7 +7,7 @@
     = @error
 
 %h3.page-title
-  New Tag
+  = s_('TagsPage|New Tag')
 %hr
 
 = form_tag namespace_project_tags_path, method: :post, id: "new-tag-form", class: "form-horizontal common-note-form tag-form js-quick-submit js-requires-input" do
@@ -23,21 +23,24 @@
         = button_tag type: 'button', title: default_ref, class: 'dropdown-menu-toggle wide form-control js-branch-select', required: true, data: { toggle: 'dropdown', selected: default_ref, field_name: 'ref' } do
           .text-left.dropdown-toggle-text= default_ref
         = render 'shared/ref_dropdown', dropdown_class: 'wide'
-      .help-block Existing branch name, tag, or commit SHA
+      .help-block
+        = s_('TagsPage|Existing branch name, tag, or commit SHA')
   .form-group
     = label_tag :message, nil, class: 'control-label'
     .col-sm-10
       = text_area_tag :message, @message, required: false, tabindex: 3, class: 'form-control', rows: 5
-      .help-block Optionally, add a message to the tag.
+      .help-block
+        = s_('TagsPage|Optionally, add a message to the tag.')
   %hr
   .form-group
-    = label_tag :release_description, 'Release notes', class: 'control-label'
+    = label_tag :release_description, s_('TagsPage|Release notes'), class: 'control-label'
     .col-sm-10
       = render layout: 'projects/md_preview', locals: { url: preview_markdown_path(@project), referenced_users: true } do
-        = render 'projects/zen', attr: :release_description, classes: 'note-textarea', placeholder: "Write your release notes or drag files here...", current_text: @release_description
+        = render 'projects/zen', attr: :release_description, classes: 'note-textarea', placeholder: s_('TagsPage|Write your release notes or drag files here...'), current_text: @release_description
         = render 'shared/notes/hints'
-      .help-block Optionally, add release notes to the tag. They will be stored in the GitLab database and displayed on the tags page.
+      .help-block
+        = s_('TagsPage|Optionally, add release notes to the tag. They will be stored in the GitLab database and displayed on the tags page.')
   .form-actions
-    = button_tag 'Create tag', class: 'btn btn-create', tabindex: 3
-    = link_to 'Cancel', project_tags_path(@project), class: 'btn btn-cancel'
+    = button_tag s_('TagsPage|Create tag'), class: 'btn btn-create', tabindex: 3
+    = link_to s_('TagsPage|Cancel'), project_tags_path(@project), class: 'btn btn-cancel'
 %script#availableRefs{ type: "application/json" }= @project.repository.ref_names.to_json.html_safe
diff --git a/app/views/projects/tags/show.html.haml b/app/views/projects/tags/show.html.haml
index 43aa2b27af6..dfe2c37ed8e 100644
--- a/app/views/projects/tags/show.html.haml
+++ b/app/views/projects/tags/show.html.haml
@@ -1,7 +1,7 @@
 - @no_container = true
-- add_to_breadcrumbs "Tags", project_tags_path(@project)
+- add_to_breadcrumbs s_('TagsPage|Tags'), project_tags_path(@project)
 - breadcrumb_title @tag.name
-- page_title @tag.name, "Tags"
+- page_title @tag.name, s_('TagsPage|Tags')
 
 %div{ class: container_class }
   .top-area.multi-line
@@ -12,25 +12,25 @@
           = @tag.name
         - if protected_tag?(@project, @tag)
           %span.label.label-success
-            protected
+            = s_('TagsPage|protected')
       - if @commit
         = render 'projects/branches/commit', commit: @commit, project: @project
       - else
-        Cant find HEAD commit for this tag
+        = s_("TagsPage|Can't find HEAD commit for this tag")
 
     .nav-controls.controls-flex
       - if can?(current_user, :push_code, @project)
-        = link_to edit_project_tag_release_path(@project, @tag.name), class: 'btn controls-item has-tooltip', title: 'Edit release notes' do
+        = link_to edit_project_tag_release_path(@project, @tag.name), class: 'btn controls-item has-tooltip', title: s_('TagsPage|Edit release notes') do
           = icon("pencil")
-      = link_to project_tree_path(@project, @tag.name), class: 'btn controls-item has-tooltip', title: 'Browse files' do
+      = link_to project_tree_path(@project, @tag.name), class: 'btn controls-item has-tooltip', title: s_('TagsPage|Browse files') do
         = icon('files-o')
-      = link_to project_commits_path(@project, @tag.name), class: 'btn controls-item has-tooltip', title: 'Browse commits' do
+      = link_to project_commits_path(@project, @tag.name), class: 'btn controls-item has-tooltip', title: s_('TagsPage|Browse commits') do
         = icon('history')
       .btn-container.controls-item
         = render 'projects/buttons/download', project: @project, ref: @tag.name
       - if can?(current_user, :admin_project, @project)
         .btn-container.controls-item-full
-          = link_to project_tag_path(@project, @tag.name), class: "btn btn-remove remove-row has-tooltip #{protected_tag?(@project, @tag) ? 'disabled' : ''}", title: "Delete tag", method: :delete, data: { confirm: "Deleting the '#{@tag.name}' tag cannot be undone. Are you sure?" } do
+          = link_to project_tag_path(@project, @tag.name), class: "btn btn-remove remove-row has-tooltip #{protected_tag?(@project, @tag) ? 'disabled' : ''}", title: s_('TagsPage|Delete tag'), method: :delete, data: { confirm: s_('TagsPage|Deleting the %{tag_name} tag cannot be undone. Are you sure?') % { tag_name: @tag.name } } do
             %i.fa.fa-trash-o
 
     - if @tag.message.present?
@@ -43,4 +43,4 @@
         .wiki
           = markdown_field(@release, :description)
     - else
-      This tag has no release notes.
+      = s_('TagsPage|This tag has no release notes.')
diff --git a/app/views/projects/tree/_truncated_notice_tree_row.html.haml b/app/views/projects/tree/_truncated_notice_tree_row.html.haml
new file mode 100644
index 00000000000..693b641888b
--- /dev/null
+++ b/app/views/projects/tree/_truncated_notice_tree_row.html.haml
@@ -0,0 +1,7 @@
+%tr.tree-truncated-warning
+  %td{ colspan: '3' }
+    = icon('exclamation-triangle fw')
+    %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/shared/_ref_switcher.html.haml b/app/views/shared/_ref_switcher.html.haml
index 6d7c9633913..6356e9f92cb 100644
--- a/app/views/shared/_ref_switcher.html.haml
+++ b/app/views/shared/_ref_switcher.html.haml
@@ -7,7 +7,7 @@
   - @options && @options.each do |key, value|
     = hidden_field_tag key, value, id: nil
   .dropdown
-    = dropdown_toggle dropdown_toggle_text, { toggle: "dropdown", selected: dropdown_toggle_text, ref: @ref, refs_url: refs_project_path(@project), field_name: 'ref', submit_form_on_click: true, visit: true }, { toggle_class: "js-project-refs-dropdown" }
+    = dropdown_toggle dropdown_toggle_text, { toggle: "dropdown", selected: dropdown_toggle_text, ref: @ref, refs_url: refs_project_path(@project, sort: 'updated_desc'), field_name: 'ref', submit_form_on_click: true, visit: true }, { toggle_class: "js-project-refs-dropdown" }
     .dropdown-menu.dropdown-menu-selectable.git-revision-dropdown.dropdown-menu-paging{ class: ("dropdown-menu-align-right" if local_assigns[:align_right]) }
       .dropdown-page-one
         = dropdown_title _("Switch branch/tag")
diff --git a/app/views/shared/icons/_add_new_project.svg b/app/views/shared/icons/_add_new_project.svg
index 3c1e15453df..cf8762944ca 100644
--- a/app/views/shared/icons/_add_new_project.svg
+++ b/app/views/shared/icons/_add_new_project.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="78" height="82" viewBox="0 0 78 82"><g fill="none" fill-rule="evenodd"><path fill="#F9F9F9" d="M2.12 42c-.08.99-.12 1.99-.12 3 0 20.435 16.565 37 37 37s37-16.565 37-37c0-1.01-.04-2.01-.12-3C74.353 61.032 58.425 76 39 76 19.575 76 3.647 61.032 2.12 42z"/><path fill="#EEE" fill-rule="nonzero" d="M39 78C17.46 78 0 60.54 0 39S17.46 0 39 0s39 17.46 39 39-17.46 39-39 39zm0-4c19.33 0 35-15.67 35-35S58.33 4 39 4 4 19.67 4 39s15.67 35 35 35z"/><path fill="#FEE1D3" fill-rule="nonzero" d="M30 24a4 4 0 0 0-4 4v22a4 4 0 0 0 4 4h18a4 4 0 0 0 4-4V28a4 4 0 0 0-4-4H30zm0-4h18a8 8 0 0 1 8 8v22a8 8 0 0 1-8 8H30a8 8 0 0 1-8-8V28a8 8 0 0 1 8-8z"/><path fill="#FC6D26" d="M33 30h8a2 2 0 1 1 0 4h-8a2 2 0 1 1 0-4zm0 7h12a2 2 0 1 1 0 4H33a2 2 0 1 1 0-4zm0 7h12a2 2 0 1 1 0 4H33a2 2 0 1 1 0-4z"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" width="78" height="82" viewBox="0 0 78 82"><g fill="none" fill-rule="evenodd"><path fill="#F9F9F9" d="M2.12 42c-.08.99-.12 1.99-.12 3 0 20.435 16.565 37 37 37s37-16.565 37-37c0-1.01-.04-2.01-.12-3C74.353 61.032 58.425 76 39 76S3.647 61.032 2.12 42z"/><path fill="#EEE" fill-rule="nonzero" d="M39 78C17.46 78 0 60.54 0 39S17.46 0 39 0s39 17.46 39 39-17.46 39-39 39zm0-4c19.33 0 35-15.67 35-35S58.33 4 39 4 4 19.67 4 39s15.67 35 35 35z"/><path fill="#E1DBF2" fill-rule="nonzero" d="M30 24c-2.21 0-4 1.79-4 4v22c0 2.21 1.79 4 4 4h18c2.21 0 4-1.79 4-4V28c0-2.21-1.79-4-4-4H30zm0-4h18c4.418 0 8 3.582 8 8v22c0 4.418-3.582 8-8 8H30c-4.418 0-8-3.582-8-8V28c0-4.418 3.582-8 8-8z"/><path fill="#6B4FBB" d="M33 30h8c1.105 0 2 .895 2 2s-.895 2-2 2h-8c-1.105 0-2-.895-2-2s.895-2 2-2zm0 7h12c1.105 0 2 .895 2 2s-.895 2-2 2H33c-1.105 0-2-.895-2-2s.895-2 2-2zm0 7h12c1.105 0 2 .895 2 2s-.895 2-2 2H33c-1.105 0-2-.895-2-2s.895-2 2-2z"/></g></svg>
diff --git a/app/views/shared/icons/_icon_autodevops.svg b/app/views/shared/icons/_icon_autodevops.svg
index 423ca6d760d..7e47c084bde 100644
--- a/app/views/shared/icons/_icon_autodevops.svg
+++ b/app/views/shared/icons/_icon_autodevops.svg
@@ -29,7 +29,7 @@
     </g>
     <g fill-rule="nonzero" transform="rotate(15 -315.035 277.714)">
       <path fill="#FFFFFF" d="M12.275,10.57 C13.986216,9.15630755 15.921048,8.03765363 18,7.26 L18,5.5 C18,2.463 20.47,0 23.493,0 L26.507,0 C27.9648848,0.000530018716 29.3628038,0.580386367 30.3930274,1.61192286 C31.4232511,2.64345935 32.0013267,4.04211574 32,5.5 L32,7.26 C34.098,8.043 36.03,9.17 37.725,10.57 L39.253,9.688 C41.8816141,8.17268496 45.2407537,9.07039379 46.763,11.695 L48.27,14.305 C48.9984289,15.5678669 49.1951495,17.0684426 48.8168566,18.4763972 C48.4385638,19.8843518 47.5162683,21.0842673 46.253,21.812 L44.728,22.693 C44.907,23.769 45,24.873 45,26 C45,27.127 44.907,28.231 44.728,29.307 L46.253,30.187 C48.8800379,31.705769 49.7822744,35.0642181 48.27,37.695 L46.763,40.305 C46.0335844,41.5673849 44.8323832,42.4881439 43.4238487,42.8645658 C42.0153143,43.2409877 40.5149245,43.0422119 39.253,42.312 L37.725,41.43 C36.013784,42.8436924 34.078952,43.9623464 32,44.74 L32,46.5 C32,49.537 29.53,52 26.507,52 L23.493,52 C22.0351152,51.99947 20.6371962,51.4196136 19.6069726,50.3880771 C18.5767489,49.3565406 17.9986733,47.9578843 18,46.5 L18,44.74 C15.921048,43.9623464 13.986216,42.8436924 12.275,41.43 L10.747,42.312 C8.11838594,43.827315 4.75924629,42.9296062 3.237,40.305 L1.73,37.695 C1.00157113,36.4321331 0.804850523,34.9315574 1.18314337,33.5236028 C1.56143621,32.1156482 2.48373172,30.9157327 3.747,30.188 L5.272,29.307 C5.09051204,28.2140265 4.9995366,27.107939 5,26 C5,24.873 5.093,23.769 5.272,22.693 L3.747,21.813 C1.11996213,20.294231 0.217725591,16.9357819 1.73,14.305 L3.237,11.695 C3.96641559,10.4326151 5.16761682,9.51185609 6.57615125,9.13543417 C7.98468568,8.75901226 9.48507553,8.95778814 10.747,9.688 L12.275,10.57 Z"/>
-      <path class="animated spin-cw infinite" fill="#E1DBF1" d="M17.9996486,7.25963195 L18.0000013,5.49772675 C18.0034459,2.46713881 20.4561478,0.00952173148 23.493,0 L26.507,0 C29.542757,0 32,2.46161709 32,5.5 L32,7.25850184 C34.0799663,8.03664754 36.0149544,9.15559094 37.7260175,10.5694605 L39.2547869,9.68691874 C41.8812087,8.17416302 45.2363972,9.06948854 46.7630175,11.6949424 L48.270687,14.3061027 C48.9989901,15.569417 49.1952874,17.0704122 48.816349,18.4785295 C48.4374106,19.8866468 47.5143145,21.0864021 46.2530682,21.8120114 L44.7278655,22.6926677 C44.9091017,23.7802451 45,24.8850821 45,26 C45,27.1144218 44.9091826,28.218078 44.7278653,29.3073326 L46.2547984,30.1889888 C48.8778516,31.7070439 49.7801588,35.0599752 48.2700175,37.6950576 L46.7625317,40.3058986 C46.0327098,41.5684739 44.8309328,42.4891542 43.4219037,42.8651509 C42.0128746,43.2411475 40.512172,43.0416186 39.2533538,42.312255 L37.7244858,41.4299789 C36.013753,42.8435912 34.0794396,43.9622923 32.0003514,44.7403681 L31.9999987,46.5022733 C31.9965541,49.5328612 29.5438522,51.9904783 26.507,52 L23.493,52 C20.457243,52 18,49.5383829 18,46.5 L18,44.7414988 C15.9200337,43.9633525 13.9850456,42.8444091 12.2739825,41.4305395 L10.7452131,42.3130813 C8.11879127,43.825837 4.76360277,42.9305115 3.23698247,40.3050576 L1.72931303,37.6938973 C1.0010099,36.430583 0.804712603,34.9295878 1.18365098,33.5214705 C1.56258936,32.1133532 2.48568546,30.9135979 3.74693178,30.1879886 L5.27213454,29.3073323 C5.09089825,28.2197549 5,27.114918 5.00000019,26.0008761 C4.99951488,24.8930059 5.0904571,23.7869854 5.27213502,22.6926675 L3.74520157,21.8110112 C1.12214836,20.2929561 0.219841192,16.9400248 1.72998247,14.3049424 L3.23746831,11.6941014 C3.96729024,10.4315261 5.16906725,9.51084579 6.5780963,9.13484913 C7.98712536,8.75885247 9.48782803,8.95838137 10.7466462,9.687745 L12.2748018,10.56961 C14.0209791,9.13635584 15.9392199,8.03072455 17.9996486,7.25963195 Z M13.7518374,14.537862 C13.108069,15.069723 12.2016163,15.1456339 11.4783538,14.728255 L8.74433999,13.1505123 C8.40103903,12.9516035 7.99274958,12.8973186 7.60940137,12.9996143 C7.22605315,13.10191 6.89909107,13.3523954 6.70101753,13.6950576 L5.19724591,16.2994454 C4.78547321,17.0179634 5.03203388,17.9341714 5.74706822,18.3479886 L8.47306822,19.9219886 C9.19530115,20.3390079 9.58295216,21.1604138 9.44574883,21.983032 L9.21798321,23.3486236 C9.07251948,24.2246212 8.99961081,25.111131 9,26 C9,26.8953847 9.0728258,27.7804297 9.21774883,28.649968 L9.44574883,30.016968 C9.58295216,30.8395862 9.19530115,31.6609921 8.47306822,32.0780114 L5.74435077,33.6535776 C5.40046982,33.851417 5.14932721,34.1778291 5.04623114,34.5609292 C4.94313508,34.9440294 4.9965408,35.3523984 5.19401753,35.6949424 L6.69795587,38.2996585 C7.11427713,39.0156351 8.03110189,39.260288 8.7470791,38.8479035 L11.4770791,37.2719035 C12.200376,36.8543519 13.1069795,36.9302031 13.7508374,37.462138 L14.8210499,38.3463136 C16.1898549,39.4774943 17.737648,40.3725891 19.3990866,40.9941596 L20.6990866,41.4791596 C21.4813437,41.7710017 22,42.5180761 22,43.353 L22,46.5 C22,47.3308348 22.6679761,48 23.493,48 L26.5007228,48.0000099 C27.328845,47.9974107 27.99906,47.3258525 28,46.5 L28,43.353 C28,42.5185702 28.5180515,41.771829 29.2996486,41.4796319 L30.599003,40.9938734 C32.261836,40.3715765 33.8093225,39.4764853 35.1790197,38.3444304 L36.2490197,37.4614304 C36.8927697,36.9301861 37.798736,36.8545694 38.5216462,37.271745 L41.25566,38.8494877 C41.598961,39.0483965 42.0072504,39.1026814 42.3905986,39.0003857 C42.7739468,38.89809 43.1009089,38.6476046 43.2989825,38.3049424 L44.8027541,35.7005546 C45.2145268,34.9820366 44.9679661,34.0658286 44.2529318,33.6520114 L41.5269318,32.0780114 C40.8046988,31.6609921 40.4170478,30.8395862 40.5542512,30.016968 L40.7821577,28.6505288 C40.9272286,27.7792134 41,26.8950523 41,26 C41,25.1046153 40.9271742,24.2195703 40.7822512,23.350032 L40.5542512,21.983032 C40.4170478,21.1604138 40.8046988,20.3390079 41.5269318,19.9219886 L44.2556492,18.3464224 C44.5995302,18.148583 44.8506728,17.8221709 44.9537689,17.4390708 C45.0568649,17.0559706 45.0034592,16.6476016 44.8059825,16.3050576 L43.3020441,13.7003415 C42.8857229,12.9843649 41.9688981,12.739712 41.2529209,13.1520965 L38.5229209,14.7280965 C37.799624,15.1456481 36.8930205,15.0697969 36.2491626,14.537862 L35.1789501,13.6536864 C33.8101451,12.5225057 32.262352,11.6274109 30.6021792,11.0063122 L29.3021792,10.5223122 C28.5192618,10.230826 28,9.48341836 28,8.648 L28,5.5 C28,4.66916515 27.3320239,4 26.507,4 L23.4992772,3.99999015 C22.671155,4.00258933 22.00094,4.67414748 22,5.5 L22,8.647 C22,9.48142977 21.4819485,10.228171 20.7003514,10.5203681 L19.400997,11.0061266 C17.738164,11.6284235 16.1906775,12.5235147 14.822142,13.6546103 C14.8121128,13.6628994 14.4553446,13.9573166 13.7518374,14.537862 Z"/>
+      <path fill="#E1DBF1" d="M17.9996486,7.25963195 L18.0000013,5.49772675 C18.0034459,2.46713881 20.4561478,0.00952173148 23.493,0 L26.507,0 C29.542757,0 32,2.46161709 32,5.5 L32,7.25850184 C34.0799663,8.03664754 36.0149544,9.15559094 37.7260175,10.5694605 L39.2547869,9.68691874 C41.8812087,8.17416302 45.2363972,9.06948854 46.7630175,11.6949424 L48.270687,14.3061027 C48.9989901,15.569417 49.1952874,17.0704122 48.816349,18.4785295 C48.4374106,19.8866468 47.5143145,21.0864021 46.2530682,21.8120114 L44.7278655,22.6926677 C44.9091017,23.7802451 45,24.8850821 45,26 C45,27.1144218 44.9091826,28.218078 44.7278653,29.3073326 L46.2547984,30.1889888 C48.8778516,31.7070439 49.7801588,35.0599752 48.2700175,37.6950576 L46.7625317,40.3058986 C46.0327098,41.5684739 44.8309328,42.4891542 43.4219037,42.8651509 C42.0128746,43.2411475 40.512172,43.0416186 39.2533538,42.312255 L37.7244858,41.4299789 C36.013753,42.8435912 34.0794396,43.9622923 32.0003514,44.7403681 L31.9999987,46.5022733 C31.9965541,49.5328612 29.5438522,51.9904783 26.507,52 L23.493,52 C20.457243,52 18,49.5383829 18,46.5 L18,44.7414988 C15.9200337,43.9633525 13.9850456,42.8444091 12.2739825,41.4305395 L10.7452131,42.3130813 C8.11879127,43.825837 4.76360277,42.9305115 3.23698247,40.3050576 L1.72931303,37.6938973 C1.0010099,36.430583 0.804712603,34.9295878 1.18365098,33.5214705 C1.56258936,32.1133532 2.48568546,30.9135979 3.74693178,30.1879886 L5.27213454,29.3073323 C5.09089825,28.2197549 5,27.114918 5.00000019,26.0008761 C4.99951488,24.8930059 5.0904571,23.7869854 5.27213502,22.6926675 L3.74520157,21.8110112 C1.12214836,20.2929561 0.219841192,16.9400248 1.72998247,14.3049424 L3.23746831,11.6941014 C3.96729024,10.4315261 5.16906725,9.51084579 6.5780963,9.13484913 C7.98712536,8.75885247 9.48782803,8.95838137 10.7466462,9.687745 L12.2748018,10.56961 C14.0209791,9.13635584 15.9392199,8.03072455 17.9996486,7.25963195 Z M13.7518374,14.537862 C13.108069,15.069723 12.2016163,15.1456339 11.4783538,14.728255 L8.74433999,13.1505123 C8.40103903,12.9516035 7.99274958,12.8973186 7.60940137,12.9996143 C7.22605315,13.10191 6.89909107,13.3523954 6.70101753,13.6950576 L5.19724591,16.2994454 C4.78547321,17.0179634 5.03203388,17.9341714 5.74706822,18.3479886 L8.47306822,19.9219886 C9.19530115,20.3390079 9.58295216,21.1604138 9.44574883,21.983032 L9.21798321,23.3486236 C9.07251948,24.2246212 8.99961081,25.111131 9,26 C9,26.8953847 9.0728258,27.7804297 9.21774883,28.649968 L9.44574883,30.016968 C9.58295216,30.8395862 9.19530115,31.6609921 8.47306822,32.0780114 L5.74435077,33.6535776 C5.40046982,33.851417 5.14932721,34.1778291 5.04623114,34.5609292 C4.94313508,34.9440294 4.9965408,35.3523984 5.19401753,35.6949424 L6.69795587,38.2996585 C7.11427713,39.0156351 8.03110189,39.260288 8.7470791,38.8479035 L11.4770791,37.2719035 C12.200376,36.8543519 13.1069795,36.9302031 13.7508374,37.462138 L14.8210499,38.3463136 C16.1898549,39.4774943 17.737648,40.3725891 19.3990866,40.9941596 L20.6990866,41.4791596 C21.4813437,41.7710017 22,42.5180761 22,43.353 L22,46.5 C22,47.3308348 22.6679761,48 23.493,48 L26.5007228,48.0000099 C27.328845,47.9974107 27.99906,47.3258525 28,46.5 L28,43.353 C28,42.5185702 28.5180515,41.771829 29.2996486,41.4796319 L30.599003,40.9938734 C32.261836,40.3715765 33.8093225,39.4764853 35.1790197,38.3444304 L36.2490197,37.4614304 C36.8927697,36.9301861 37.798736,36.8545694 38.5216462,37.271745 L41.25566,38.8494877 C41.598961,39.0483965 42.0072504,39.1026814 42.3905986,39.0003857 C42.7739468,38.89809 43.1009089,38.6476046 43.2989825,38.3049424 L44.8027541,35.7005546 C45.2145268,34.9820366 44.9679661,34.0658286 44.2529318,33.6520114 L41.5269318,32.0780114 C40.8046988,31.6609921 40.4170478,30.8395862 40.5542512,30.016968 L40.7821577,28.6505288 C40.9272286,27.7792134 41,26.8950523 41,26 C41,25.1046153 40.9271742,24.2195703 40.7822512,23.350032 L40.5542512,21.983032 C40.4170478,21.1604138 40.8046988,20.3390079 41.5269318,19.9219886 L44.2556492,18.3464224 C44.5995302,18.148583 44.8506728,17.8221709 44.9537689,17.4390708 C45.0568649,17.0559706 45.0034592,16.6476016 44.8059825,16.3050576 L43.3020441,13.7003415 C42.8857229,12.9843649 41.9688981,12.739712 41.2529209,13.1520965 L38.5229209,14.7280965 C37.799624,15.1456481 36.8930205,15.0697969 36.2491626,14.537862 L35.1789501,13.6536864 C33.8101451,12.5225057 32.262352,11.6274109 30.6021792,11.0063122 L29.3021792,10.5223122 C28.5192618,10.230826 28,9.48341836 28,8.648 L28,5.5 C28,4.66916515 27.3320239,4 26.507,4 L23.4992772,3.99999015 C22.671155,4.00258933 22.00094,4.67414748 22,5.5 L22,8.647 C22,9.48142977 21.4819485,10.228171 20.7003514,10.5203681 L19.400997,11.0061266 C17.738164,11.6284235 16.1906775,12.5235147 14.822142,13.6546103 C14.8121128,13.6628994 14.4553446,13.9573166 13.7518374,14.537862 Z"/>
       <g transform="rotate(15 -59.137 82.348)">
         <circle cx="8" cy="8" r="8" fill="#FFFFFF" transform="translate(.035 6.008)"/>
         <path fill="#6B4FBB" d="M7.40192379,14.7679492 C2.98364579,14.7679492 -0.598076211,11.1862272 -0.598076211,6.76794919 C-0.598076211,2.34967119 2.98364579,-1.23205081 7.40192379,-1.23205081 C11.8202018,-1.23205081 15.4019238,2.34967119 15.4019238,6.76794919 C15.4019238,11.1862272 11.8202018,14.7679492 7.40192379,14.7679492 Z M7.40192379,10.7679492 C9.61106279,10.7679492 11.4019238,8.97708819 11.4019238,6.76794919 C11.4019238,4.55881019 9.61106279,2.76794919 7.40192379,2.76794919 C5.19278479,2.76794919 3.40192379,4.55881019 3.40192379,6.76794919 C3.40192379,8.97708819 5.19278479,10.7679492 7.40192379,10.7679492 Z"/>
@@ -37,7 +37,7 @@
     </g>
     <g fill-rule="nonzero" transform="rotate(15 -402.968 460.884)">
       <path fill="#FFFFFF" d="M9.82,8.53730769 C11.1889728,7.39547918 12.7368384,6.49195101 14.4,5.86384615 L14.4,4.44230769 C14.4,1.98934615 16.376,0 18.7944,0 L21.2056,0 C22.3719078,0.00042809204 23.4902431,0.468773604 24.314422,1.30193769 C25.1386009,2.13510179 25.6010613,3.26478579 25.6,4.44230769 L25.6,5.86384615 C27.2784,6.49626923 28.824,7.40653846 30.18,8.53730769 L31.4024,7.82492308 C33.5052912,6.60101478 36.192603,7.32608729 37.4104,9.44596154 L38.616,11.5540385 C39.1987431,12.5740464 39.3561196,13.7860498 39.0534853,14.9232439 C38.750851,16.060438 38.0130146,17.0296006 37.0024,17.6173846 L35.7824,18.3289615 C35.9256,19.1980385 36,20.0897308 36,21 C36,21.9102692 35.9256,22.8019615 35.7824,23.6710385 L37.0024,24.3818077 C39.1040303,25.6085057 39.8258195,28.3210992 38.616,30.4459615 L37.4104,32.5540385 C36.8268675,33.573657 35.8659065,34.317347 34.739079,34.6213801 C33.6122515,34.9254132 32.4119396,34.7648634 31.4024,34.1750769 L30.18,33.4626923 C28.8110272,34.6045208 27.2631616,35.508049 25.6,36.1361538 L25.6,37.5576923 C25.6,40.0106538 23.624,42 21.2056,42 L18.7944,42 C17.6280922,41.9995719 16.5097569,41.5312264 15.685578,40.6980623 C14.8613991,39.8648982 14.3989387,38.7352142 14.4,37.5576923 L14.4,36.1361538 C12.7368384,35.508049 11.1889728,34.6045208 9.82,33.4626923 L8.5976,34.1750769 C6.49470875,35.3989852 3.80739703,34.6739127 2.5896,32.5540385 L1.384,30.4459615 C0.8012569,29.4259536 0.643880418,28.2139502 0.946514692,27.0767561 C1.24914897,25.939562 1.98698538,24.9703994 2.9976,24.3826154 L4.2176,23.6710385 C4.07240963,22.7882521 3.99962928,21.8948738 4,21 C4,20.0897308 4.0744,19.1980385 4.2176,18.3289615 L2.9976,17.6181923 C0.895969702,16.3914943 0.174180473,13.6789008 1.384,11.5540385 L2.5896,9.44596154 C3.17313247,8.42634297 4.13409345,7.682653 5.260921,7.37861991 C6.38774855,7.07458682 7.58806043,7.23513658 8.5976,7.82492308 L9.82,8.53730769 Z"/>
-      <path class="animated spin-ccw infinite" fill="#FEE1D3" d="M14.0000007,5.6038043 L14.0000013,4.44005609 C14.0029906,1.78475013 16.1390906,-0.376211234 18.7944,-0.384615385 L21.2056,-0.384615385 C23.8595941,-0.384615385 26,1.78021801 26,4.44230769 L26,5.60295806 C27.5208716,6.20655954 28.9434678,7.03621848 30.2204219,8.06411282 L31.1970056,7.49492104 C33.4941909,6.15907529 36.4301298,6.95005805 37.7609369,9.26076474 L38.9671983,11.3699991 C39.5988409,12.4761812 39.768854,13.7886936 39.4405746,15.0202941 C39.1116282,16.2543969 38.308799,17.3078735 37.2096539,17.946304 L36.2175721,18.5246428 C36.3390841,19.3401617 36.4,20.1667594 36.4,21 C36.4,21.8329668 36.339124,22.6588262 36.2175401,23.4753391 L37.2113882,24.0547082 C39.4944154,25.3886826 40.276605,28.3232105 38.9665369,30.6311583 L37.7604568,32.7400742 C37.1252608,33.8495148 36.0768547,34.6604208 34.8452776,34.9922248 C33.6111681,35.324711 32.2964469,35.1482289 31.195569,34.5042428 L30.2192355,33.9354047 C28.9426535,34.9630196 27.5206806,35.7924453 25.9999993,36.3961957 L25.9999987,37.5599439 C25.9970094,40.2152499 23.8609094,42.3762112 21.2056,42.3846154 L18.7944,42.3846154 C16.1404059,42.3846154 14,40.219782 14,37.5576923 L14,36.3970419 C12.4791284,35.7934405 11.0565322,34.9637815 9.77957815,33.9358872 L8.80299442,34.505079 C6.50580915,35.8409247 3.56987021,35.049942 2.23906313,32.7392353 L1.03280169,30.6300009 C0.401159146,29.5238188 0.231145999,28.2113064 0.559425405,26.9797059 C0.888371786,25.7456031 1.69120101,24.6921265 2.79034606,24.053696 L3.78242779,23.4753573 C3.66091587,22.6598457 3.60000002,21.8333228 3.60000019,21.0008678 C3.59964068,20.1722851 3.66061719,19.3449468 3.78254167,18.5247085 L2.78861183,17.9452918 C0.505584602,16.6113174 -0.276605002,13.6767895 1.03346313,11.3688417 L2.23954317,9.25992583 C2.87473915,8.15048519 3.92314533,7.33957919 5.15472238,7.00777521 C6.38883187,6.67528896 7.70355311,6.85177112 8.80443097,7.49575721 L9.78076186,8.06459377 C11.0573465,7.03698045 12.4793194,6.20755475 14.0000007,5.6038043 Z M11.2634746,12.0326234 C10.617233,12.5716613 9.7026973,12.6485026 8.97556903,12.2248582 L6.78774825,10.9501716 C6.60754053,10.8447551 6.39506809,10.8162338 6.19527576,10.8700606 C5.99295099,10.9245697 5.8183659,11.0596053 5.71133687,11.246543 L4.50892658,13.3490215 C4.28085652,13.7508163 4.41776119,14.2644394 4.80485394,14.4906191 L6.98565394,15.7619268 C7.70254629,16.1798426 8.08690703,16.9970357 7.95165511,17.8157512 L7.76948523,18.9184706 C7.65638664,19.6061109 7.59969735,20.3020342 7.6,21 C7.6,21.7031066 7.65662064,22.3978283 7.76925511,23.0801334 L7.95165511,24.1842488 C8.08690703,25.0029643 7.70254629,25.8201574 6.98565394,26.2380732 L4.80213007,27.5109659 C4.61772321,27.6180778 4.48116147,27.7972748 4.42448029,28.0099246 C4.36713215,28.2250767 4.39688141,28.454743 4.50573687,28.6453801 L5.70831165,30.7481858 C5.93243371,31.1373303 6.41410538,31.2670993 6.79049373,31.0482253 L8.97449373,29.7753023 C9.7016554,29.3514832 10.6163433,29.4282639 11.2626746,29.9673766 L12.1188867,30.6815536 C13.1796505,31.566598 14.3786867,32.2666727 15.6649769,32.7525215 L16.7049769,33.1442523 C17.4841581,33.4377419 18,34.1832625 18,35.0158846 L18,37.5576923 C18,38.02074 18.3597694,38.3846154 18.7944,38.3846154 L21.1992624,38.3846254 C21.6372484,38.3832375 21.9994819,38.0167881 22,37.5576923 L22,35.0158846 C22,34.18376 22.5152346,33.4385758 23.2937506,33.1447321 L24.3331012,32.7524389 C25.620867,32.2658727 26.8196661,31.5658006 27.8813806,30.679856 L28.7373806,29.9666637 C29.3836087,29.4282468 30.2976553,29.3517028 31.024431,29.7751418 L33.2122517,31.0498284 C33.3924595,31.1552449 33.6049319,31.1837662 33.8047242,31.1299394 C34.007049,31.0754303 34.1816341,30.9403947 34.2886631,30.753457 L35.4910734,28.6509785 C35.7191435,28.2491837 35.5822388,27.7355606 35.1951461,27.5093809 L33.0143461,26.2380732 C32.2974537,25.8201574 31.913093,25.0029643 32.0483449,24.1842488 L32.2306531,23.0806893 C32.3434217,22.3968737 32.4,21.7028459 32.4,21 C32.4,20.2968934 32.3433794,19.6021717 32.2307449,18.9198666 L32.0483449,17.8157512 C31.913093,16.9970357 32.2974537,16.1798426 33.0143461,15.7619268 L35.1978699,14.4890341 C35.3822768,14.3819222 35.5188385,14.2027252 35.5755197,13.9900754 C35.6328679,13.7749233 35.6031186,13.545257 35.4942631,13.3546199 L34.2916883,11.2518142 C34.0675663,10.8626697 33.5858946,10.7329007 33.2095063,10.9517747 L31.0255063,12.2246977 C30.2983446,12.6485168 29.3836567,12.5717361 28.7373254,12.0326234 L27.8811133,11.3184464 C26.8203495,10.433402 25.6213133,9.73332732 24.3362966,9.24795765 L23.2962966,8.85703457 C22.5164499,8.56389992 22,7.81804293 22,6.98492308 L22,4.44230769 C22,3.97925995 21.6402306,3.61538462 21.2056,3.61538462 L18.8007376,3.61537457 C18.3627516,3.61676247 18.0005181,3.98321188 18,4.44230769 L18,6.98411538 C18,7.81623999 17.4847654,8.56142419 16.7062494,8.85526793 L15.6668988,9.24756113 C14.379133,9.73412728 13.1803339,10.4341994 12.1197785,11.3191775 C12.1108094,11.3266617 11.8253748,11.564477 11.2634746,12.0326234 Z"/>
+      <path fill="#FEE1D3" d="M14.0000007,5.6038043 L14.0000013,4.44005609 C14.0029906,1.78475013 16.1390906,-0.376211234 18.7944,-0.384615385 L21.2056,-0.384615385 C23.8595941,-0.384615385 26,1.78021801 26,4.44230769 L26,5.60295806 C27.5208716,6.20655954 28.9434678,7.03621848 30.2204219,8.06411282 L31.1970056,7.49492104 C33.4941909,6.15907529 36.4301298,6.95005805 37.7609369,9.26076474 L38.9671983,11.3699991 C39.5988409,12.4761812 39.768854,13.7886936 39.4405746,15.0202941 C39.1116282,16.2543969 38.308799,17.3078735 37.2096539,17.946304 L36.2175721,18.5246428 C36.3390841,19.3401617 36.4,20.1667594 36.4,21 C36.4,21.8329668 36.339124,22.6588262 36.2175401,23.4753391 L37.2113882,24.0547082 C39.4944154,25.3886826 40.276605,28.3232105 38.9665369,30.6311583 L37.7604568,32.7400742 C37.1252608,33.8495148 36.0768547,34.6604208 34.8452776,34.9922248 C33.6111681,35.324711 32.2964469,35.1482289 31.195569,34.5042428 L30.2192355,33.9354047 C28.9426535,34.9630196 27.5206806,35.7924453 25.9999993,36.3961957 L25.9999987,37.5599439 C25.9970094,40.2152499 23.8609094,42.3762112 21.2056,42.3846154 L18.7944,42.3846154 C16.1404059,42.3846154 14,40.219782 14,37.5576923 L14,36.3970419 C12.4791284,35.7934405 11.0565322,34.9637815 9.77957815,33.9358872 L8.80299442,34.505079 C6.50580915,35.8409247 3.56987021,35.049942 2.23906313,32.7392353 L1.03280169,30.6300009 C0.401159146,29.5238188 0.231145999,28.2113064 0.559425405,26.9797059 C0.888371786,25.7456031 1.69120101,24.6921265 2.79034606,24.053696 L3.78242779,23.4753573 C3.66091587,22.6598457 3.60000002,21.8333228 3.60000019,21.0008678 C3.59964068,20.1722851 3.66061719,19.3449468 3.78254167,18.5247085 L2.78861183,17.9452918 C0.505584602,16.6113174 -0.276605002,13.6767895 1.03346313,11.3688417 L2.23954317,9.25992583 C2.87473915,8.15048519 3.92314533,7.33957919 5.15472238,7.00777521 C6.38883187,6.67528896 7.70355311,6.85177112 8.80443097,7.49575721 L9.78076186,8.06459377 C11.0573465,7.03698045 12.4793194,6.20755475 14.0000007,5.6038043 Z M11.2634746,12.0326234 C10.617233,12.5716613 9.7026973,12.6485026 8.97556903,12.2248582 L6.78774825,10.9501716 C6.60754053,10.8447551 6.39506809,10.8162338 6.19527576,10.8700606 C5.99295099,10.9245697 5.8183659,11.0596053 5.71133687,11.246543 L4.50892658,13.3490215 C4.28085652,13.7508163 4.41776119,14.2644394 4.80485394,14.4906191 L6.98565394,15.7619268 C7.70254629,16.1798426 8.08690703,16.9970357 7.95165511,17.8157512 L7.76948523,18.9184706 C7.65638664,19.6061109 7.59969735,20.3020342 7.6,21 C7.6,21.7031066 7.65662064,22.3978283 7.76925511,23.0801334 L7.95165511,24.1842488 C8.08690703,25.0029643 7.70254629,25.8201574 6.98565394,26.2380732 L4.80213007,27.5109659 C4.61772321,27.6180778 4.48116147,27.7972748 4.42448029,28.0099246 C4.36713215,28.2250767 4.39688141,28.454743 4.50573687,28.6453801 L5.70831165,30.7481858 C5.93243371,31.1373303 6.41410538,31.2670993 6.79049373,31.0482253 L8.97449373,29.7753023 C9.7016554,29.3514832 10.6163433,29.4282639 11.2626746,29.9673766 L12.1188867,30.6815536 C13.1796505,31.566598 14.3786867,32.2666727 15.6649769,32.7525215 L16.7049769,33.1442523 C17.4841581,33.4377419 18,34.1832625 18,35.0158846 L18,37.5576923 C18,38.02074 18.3597694,38.3846154 18.7944,38.3846154 L21.1992624,38.3846254 C21.6372484,38.3832375 21.9994819,38.0167881 22,37.5576923 L22,35.0158846 C22,34.18376 22.5152346,33.4385758 23.2937506,33.1447321 L24.3331012,32.7524389 C25.620867,32.2658727 26.8196661,31.5658006 27.8813806,30.679856 L28.7373806,29.9666637 C29.3836087,29.4282468 30.2976553,29.3517028 31.024431,29.7751418 L33.2122517,31.0498284 C33.3924595,31.1552449 33.6049319,31.1837662 33.8047242,31.1299394 C34.007049,31.0754303 34.1816341,30.9403947 34.2886631,30.753457 L35.4910734,28.6509785 C35.7191435,28.2491837 35.5822388,27.7355606 35.1951461,27.5093809 L33.0143461,26.2380732 C32.2974537,25.8201574 31.913093,25.0029643 32.0483449,24.1842488 L32.2306531,23.0806893 C32.3434217,22.3968737 32.4,21.7028459 32.4,21 C32.4,20.2968934 32.3433794,19.6021717 32.2307449,18.9198666 L32.0483449,17.8157512 C31.913093,16.9970357 32.2974537,16.1798426 33.0143461,15.7619268 L35.1978699,14.4890341 C35.3822768,14.3819222 35.5188385,14.2027252 35.5755197,13.9900754 C35.6328679,13.7749233 35.6031186,13.545257 35.4942631,13.3546199 L34.2916883,11.2518142 C34.0675663,10.8626697 33.5858946,10.7329007 33.2095063,10.9517747 L31.0255063,12.2246977 C30.2983446,12.6485168 29.3836567,12.5717361 28.7373254,12.0326234 L27.8811133,11.3184464 C26.8203495,10.433402 25.6213133,9.73332732 24.3362966,9.24795765 L23.2962966,8.85703457 C22.5164499,8.56389992 22,7.81804293 22,6.98492308 L22,4.44230769 C22,3.97925995 21.6402306,3.61538462 21.2056,3.61538462 L18.8007376,3.61537457 C18.3627516,3.61676247 18.0005181,3.98321188 18,4.44230769 L18,6.98411538 C18,7.81623999 17.4847654,8.56142419 16.7062494,8.85526793 L15.6668988,9.24756113 C14.379133,9.73412728 13.1803339,10.4341994 12.1197785,11.3191775 C12.1108094,11.3266617 11.8253748,11.564477 11.2634746,12.0326234 Z"/>
       <g transform="rotate(15 -47.892 66.043)">
         <ellipse cx="6.4" cy="6.462" fill="#FFFFFF" rx="6.4" ry="6.462" transform="translate(.028 4.853)"/>
         <path fill="#FC6D26" d="M5.92153903,11.9125743 C2.3834711,11.9125743 -0.478460969,9.0231237 -0.478460969,5.4664205 C-0.478460969,1.9097173 2.3834711,-0.979733345 5.92153903,-0.979733345 C9.45960696,-0.979733345 12.321539,1.9097173 12.321539,5.4664205 C12.321539,9.0231237 9.45960696,11.9125743 5.92153903,11.9125743 Z M5.92153903,8.71257435 C7.6854047,8.71257435 9.12153903,7.26263103 9.12153903,5.4664205 C9.12153903,3.67020997 7.6854047,2.22026666 5.92153903,2.22026666 C4.15767337,2.22026666 2.72153903,3.67020997 2.72153903,5.4664205 C2.72153903,7.26263103 4.15767337,8.71257435 5.92153903,8.71257435 Z"/>
diff --git a/app/views/shared/icons/_icon_hourglass.svg b/app/views/shared/icons/_icon_hourglass.svg
new file mode 100644
index 00000000000..fe7e497ce13
--- /dev/null
+++ b/app/views/shared/icons/_icon_hourglass.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path d="M10.331 4.889A2.988 2.988 0 0 0 11 3V2H5v1c0 .362.064.709.182 1.03l5.15.859zM3 14v-1c0-1.78.93-3.342 2.33-4.228.447-.327.67-.582.67-.764 0-.19-.242-.46-.725-.815A4.996 4.996 0 0 1 3 3V2H2a1 1 0 1 1 0-2h12a1 1 0 0 1 0 2h-1v1a4.997 4.997 0 0 1-2.39 4.266c-.407.3-.61.545-.61.734 0 .19.203.434.61.734A4.997 4.997 0 0 1 13 13v1h1a1 1 0 0 1 0 2H2a1 1 0 0 1 0-2h1zm8 0v-1a3 3 0 0 0-6 0v1h6z"/></svg>
diff --git a/app/views/shared/icons/_lightbulb.svg b/app/views/shared/icons/_lightbulb.svg
new file mode 100644
index 00000000000..2fcc4c65f99
--- /dev/null
+++ b/app/views/shared/icons/_lightbulb.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="78" height="82" viewBox="0 0 78 82"><g fill="none" fill-rule="evenodd"><path fill="#F9F9F9" d="M2.12 42c-.08.99-.12 1.99-.12 3 0 20.435 16.565 37 37 37s37-16.565 37-37c0-1.01-.04-2.01-.12-3C74.353 61.032 58.425 76 39 76S3.647 61.032 2.12 42z"/><path fill="#EEE" fill-rule="nonzero" d="M39 78C17.46 78 0 60.54 0 39S17.46 0 39 0s39 17.46 39 39-17.46 39-39 39zm0-4c19.33 0 35-15.67 35-35S58.33 4 39 4 4 19.67 4 39s15.67 35 35 35z"/><path fill="#6B4FBB" d="M33 52h12c1.105 0 2 .895 2 2s-.895 2-2 2H33c-1.105 0-2-.895-2-2s.895-2 2-2zm1 5h10c1.105 0 2 .895 2 2s-.895 2-2 2H34c-1.105 0-2-.895-2-2s.895-2 2-2z"/><path fill="#E1DBF2" fill-rule="nonzero" d="M45.542 46.932l.346-2.36c.198-1.348.737-2.623 1.566-3.705 3.025-3.946 4.485-7.29 4.547-9.96C52.153 24.41 46.843 20 39 20c-7.777 0-13 4.374-13 11 0 2.4 1.462 5.73 4.573 9.846.815 1.08 1.343 2.345 1.536 3.683l.353 2.456 13.08-.054zm-17.038.624L28.15 45.1c-.097-.67-.36-1.303-.768-1.842C23.794 38.51 22 34.424 22 31c0-9.39 7.61-15 17-15s17.218 5.614 17 15c-.085 3.64-1.875 7.74-5.37 12.3-.416.54-.685 1.18-.784 1.853l-.346 2.36c-.288 1.958-1.963 3.41-3.942 3.42l-13.08.053c-1.994.008-3.69-1.455-3.974-3.43z"/><path fill="#6B4FBB" d="M41 38.732c-.598-.345-1-.992-1-1.732 0-1.105.895-2 2-2s2 .895 2 2c0 .74-.402 1.387-1 1.732V42c0 .552-.448 1-1 1s-1-.448-1-1v-3.268zm-6 0c-.598-.345-1-.992-1-1.732 0-1.105.895-2 2-2s2 .895 2 2c0 .74-.402 1.387-1 1.732V42c0 .552-.448 1-1 1s-1-.448-1-1v-3.268z"/></g></svg>
diff --git a/app/views/shared/issuable/_filter.html.haml b/app/views/shared/issuable/_filter.html.haml
index d3f0aa2d339..8442d7ff4a2 100644
--- a/app/views/shared/issuable/_filter.html.haml
+++ b/app/views/shared/issuable/_filter.html.haml
@@ -1,4 +1,3 @@
-- finder = controller.controller_name == 'issues' ? issues_finder : merge_requests_finder
 - boards_page = controller.controller_name == 'boards'
 
 .issues-filters
diff --git a/app/views/shared/members/_member.html.haml b/app/views/shared/members/_member.html.haml
index 951b4dd7b36..2c27dd638a7 100644
--- a/app/views/shared/members/_member.html.haml
+++ b/app/views/shared/members/_member.html.haml
@@ -104,7 +104,6 @@
                       class: 'btn btn-remove prepend-left-10'
           - else
             = link_to member,
-                      remote: true,
                       method: :delete,
                       data: { confirm: remove_member_message(member) },
                       class: 'btn btn-remove prepend-left-10',
diff --git a/app/views/shared/milestones/_sidebar.html.haml b/app/views/shared/milestones/_sidebar.html.haml
index f03e0ab154c..4f51455c26e 100644
--- a/app/views/shared/milestones/_sidebar.html.haml
+++ b/app/views/shared/milestones/_sidebar.html.haml
@@ -85,6 +85,22 @@
               Closed:
               = milestone.issues_visible_to_user(current_user).closed.count
 
+    .block.time_spent
+      .sidebar-collapsed-icon
+        = custom_icon('icon_hourglass')
+        %span.collapsed-milestone-total-time-spent
+        - if milestone.human_total_issue_time_spent
+          = milestone.human_total_issue_time_spent
+        - else
+          = _("None")
+      .title.hide-collapsed
+        = _("Total issue time spent")
+      .value.hide-collapsed
+        - if milestone.human_total_issue_time_spent
+          %span.bold= milestone.human_total_issue_time_spent
+        - else
+          %span.no-value= _("No time spent")
+
     .block.merge-requests
       .sidebar-collapsed-icon
         %strong
diff --git a/app/views/shared/tokens/_scopes_form.html.haml b/app/views/shared/tokens/_scopes_form.html.haml
index 8bbaf431536..ae437dd16d6 100644
--- a/app/views/shared/tokens/_scopes_form.html.haml
+++ b/app/views/shared/tokens/_scopes_form.html.haml
@@ -7,3 +7,4 @@
     = check_box_tag "#{prefix}[scopes][]", scope, token.scopes.include?(scope), id: "#{prefix}_scopes_#{scope}"
     = label_tag ("#{prefix}_scopes_#{scope}"), scope
     %span= t(scope, scope: [:doorkeeper, :scopes])
+    .scope-description= t scope, scope: [:doorkeeper, :scope_desc]
diff --git a/app/workers/cluster_install_app_worker.rb b/app/workers/cluster_install_app_worker.rb
new file mode 100644
index 00000000000..899aed904e4
--- /dev/null
+++ b/app/workers/cluster_install_app_worker.rb
@@ -0,0 +1,11 @@
+class ClusterInstallAppWorker
+  include Sidekiq::Worker
+  include ClusterQueue
+  include ClusterApplications
+
+  def perform(app_name, app_id)
+    find_application(app_name, app_id) do |app|
+      Clusters::Applications::InstallService.new(app).execute
+    end
+  end
+end
diff --git a/app/workers/cluster_provision_worker.rb b/app/workers/cluster_provision_worker.rb
index 63300b58a25..b01f9708424 100644
--- a/app/workers/cluster_provision_worker.rb
+++ b/app/workers/cluster_provision_worker.rb
@@ -3,8 +3,10 @@ class ClusterProvisionWorker
   include ClusterQueue
 
   def perform(cluster_id)
-    Gcp::Cluster.find_by_id(cluster_id).try do |cluster|
-      Ci::ProvisionClusterService.new.execute(cluster)
+    Clusters::Cluster.find_by_id(cluster_id).try do |cluster|
+      cluster.provider.try do |provider|
+        Clusters::Gcp::ProvisionService.new.execute(provider) if cluster.gcp?
+      end
     end
   end
 end
diff --git a/app/workers/cluster_wait_for_app_installation_worker.rb b/app/workers/cluster_wait_for_app_installation_worker.rb
new file mode 100644
index 00000000000..4bb8c293e5d
--- /dev/null
+++ b/app/workers/cluster_wait_for_app_installation_worker.rb
@@ -0,0 +1,14 @@
+class ClusterWaitForAppInstallationWorker
+  include Sidekiq::Worker
+  include ClusterQueue
+  include ClusterApplications
+
+  INTERVAL = 10.seconds
+  TIMEOUT = 20.minutes
+
+  def perform(app_name, app_id)
+    find_application(app_name, app_id) do |app|
+      Clusters::Applications::CheckInstallationProgressService.new(app).execute
+    end
+  end
+end
diff --git a/app/workers/concerns/cluster_applications.rb b/app/workers/concerns/cluster_applications.rb
new file mode 100644
index 00000000000..24ecaa0b52f
--- /dev/null
+++ b/app/workers/concerns/cluster_applications.rb
@@ -0,0 +1,9 @@
+module ClusterApplications
+  extend ActiveSupport::Concern
+
+  included do
+    def find_application(app_name, id, &blk)
+      Clusters::Cluster::APPLICATIONS[app_name].find(id).try(&blk)
+    end
+  end
+end
diff --git a/app/workers/concerns/gitlab/github_import/notify_upon_death.rb b/app/workers/concerns/gitlab/github_import/notify_upon_death.rb
new file mode 100644
index 00000000000..3d7120665b6
--- /dev/null
+++ b/app/workers/concerns/gitlab/github_import/notify_upon_death.rb
@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    # NotifyUponDeath can be included into a GitHub worker class if it should
+    # notify any JobWaiter instances upon being moved to the Sidekiq dead queue.
+    #
+    # Note that this will only notify the waiter upon graceful termination, a
+    # SIGKILL will still result in the waiter _not_ being notified.
+    #
+    # Workers including this module must have jobs passed where the last
+    # argument is the key to notify, as a String.
+    module NotifyUponDeath
+      extend ActiveSupport::Concern
+
+      included do
+        # If a job is being exhausted we still want to notify the
+        # AdvanceStageWorker. This prevents the entire import from getting stuck
+        # just because 1 job threw too many errors.
+        sidekiq_retries_exhausted do |job|
+          args = job['args']
+          jid = job['jid']
+
+          if args.length == 3 && (key = args.last) && key.is_a?(String)
+            JobWaiter.notify(key, jid)
+          end
+        end
+      end
+    end
+  end
+end
diff --git a/app/workers/concerns/gitlab/github_import/object_importer.rb b/app/workers/concerns/gitlab/github_import/object_importer.rb
new file mode 100644
index 00000000000..67e36c811de
--- /dev/null
+++ b/app/workers/concerns/gitlab/github_import/object_importer.rb
@@ -0,0 +1,54 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    # ObjectImporter defines the base behaviour for every Sidekiq worker that
+    # imports a single resource such as a note or pull request.
+    module ObjectImporter
+      extend ActiveSupport::Concern
+
+      included do
+        include Sidekiq::Worker
+        include GithubImport::Queue
+        include ReschedulingMethods
+        include NotifyUponDeath
+      end
+
+      # project - An instance of `Project` to import the data into.
+      # client - An instance of `Gitlab::GithubImport::Client`
+      # hash - A Hash containing the details of the object to import.
+      def import(project, client, hash)
+        object = representation_class.from_json_hash(hash)
+
+        importer_class.new(object, project, client).execute
+
+        counter.increment(project: project.path_with_namespace)
+      end
+
+      def counter
+        @counter ||= Gitlab::Metrics.counter(counter_name, counter_description)
+      end
+
+      # Returns the representation class to use for the object. This class must
+      # define the class method `from_json_hash`.
+      def representation_class
+        raise NotImplementedError
+      end
+
+      # Returns the class to use for importing the object.
+      def importer_class
+        raise NotImplementedError
+      end
+
+      # Returns the name (as a Symbol) of the Prometheus counter.
+      def counter_name
+        raise NotImplementedError
+      end
+
+      # Returns the description (as a String) of the Prometheus counter.
+      def counter_description
+        raise NotImplementedError
+      end
+    end
+  end
+end
diff --git a/app/workers/concerns/gitlab/github_import/queue.rb b/app/workers/concerns/gitlab/github_import/queue.rb
new file mode 100644
index 00000000000..a2bee361b86
--- /dev/null
+++ b/app/workers/concerns/gitlab/github_import/queue.rb
@@ -0,0 +1,16 @@
+module Gitlab
+  module GithubImport
+    module Queue
+      extend ActiveSupport::Concern
+
+      included do
+        # If a job produces an error it may block a stage from advancing
+        # forever. To prevent this from happening we prevent jobs from going to
+        # the dead queue. This does mean some resources may not be imported, but
+        # this is better than a project being stuck in the "import" state
+        # forever.
+        sidekiq_options queue: 'github_importer', dead: false, retry: 5
+      end
+    end
+  end
+end
diff --git a/app/workers/concerns/gitlab/github_import/rescheduling_methods.rb b/app/workers/concerns/gitlab/github_import/rescheduling_methods.rb
new file mode 100644
index 00000000000..692ca6b7f42
--- /dev/null
+++ b/app/workers/concerns/gitlab/github_import/rescheduling_methods.rb
@@ -0,0 +1,40 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    # Module that provides methods shared by the various workers used for
+    # importing GitHub projects.
+    module ReschedulingMethods
+      # project_id - The ID of the GitLab project to import the note into.
+      # hash - A Hash containing the details of the GitHub object to imoprt.
+      # notify_key - The Redis key to notify upon completion, if any.
+      def perform(project_id, hash, notify_key = nil)
+        project = Project.find_by(id: project_id)
+
+        return notify_waiter(notify_key) unless project
+
+        client = GithubImport.new_client_for(project, parallel: true)
+
+        if try_import(project, client, hash)
+          notify_waiter(notify_key)
+        else
+          # In the event of hitting the rate limit we want to reschedule the job
+          # so its retried after our rate limit has been reset.
+          self.class
+            .perform_in(client.rate_limit_resets_in, project.id, hash, notify_key)
+        end
+      end
+
+      def try_import(*args)
+        import(*args)
+        true
+      rescue RateLimitError
+        false
+      end
+
+      def notify_waiter(key = nil)
+        JobWaiter.notify(key, jid) if key
+      end
+    end
+  end
+end
diff --git a/app/workers/concerns/gitlab/github_import/stage_methods.rb b/app/workers/concerns/gitlab/github_import/stage_methods.rb
new file mode 100644
index 00000000000..147c8c8d683
--- /dev/null
+++ b/app/workers/concerns/gitlab/github_import/stage_methods.rb
@@ -0,0 +1,30 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    module StageMethods
+      # project_id - The ID of the GitLab project to import the data into.
+      def perform(project_id)
+        return unless (project = find_project(project_id))
+
+        client = GithubImport.new_client_for(project)
+
+        try_import(client, project)
+      end
+
+      # client - An instance of Gitlab::GithubImport::Client.
+      # project - An instance of Project.
+      def try_import(client, project)
+        import(client, project)
+      rescue RateLimitError
+        self.class.perform_in(client.rate_limit_resets_in, project.id)
+      end
+
+      def find_project(id)
+        # If the project has been marked as failed we want to bail out
+        # automatically.
+        Project.import_started.find_by(id: id)
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/advance_stage_worker.rb b/app/workers/gitlab/github_import/advance_stage_worker.rb
new file mode 100644
index 00000000000..877f88c043f
--- /dev/null
+++ b/app/workers/gitlab/github_import/advance_stage_worker.rb
@@ -0,0 +1,74 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    # AdvanceStageWorker is a worker used by the GitHub importer to wait for a
+    # number of jobs to complete, without blocking a thread. Once all jobs have
+    # been completed this worker will advance the import process to the next
+    # stage.
+    class AdvanceStageWorker
+      include Sidekiq::Worker
+
+      sidekiq_options queue: 'github_importer_advance_stage', dead: false
+
+      INTERVAL = 30.seconds.to_i
+
+      # The number of seconds to wait (while blocking the thread) before
+      # continueing to the next waiter.
+      BLOCKING_WAIT_TIME = 5
+
+      # The known importer stages and their corresponding Sidekiq workers.
+      STAGES = {
+        issues_and_diff_notes: Stage::ImportIssuesAndDiffNotesWorker,
+        notes: Stage::ImportNotesWorker,
+        finish: Stage::FinishImportWorker
+      }.freeze
+
+      # project_id - The ID of the project being imported.
+      # waiters - A Hash mapping Gitlab::JobWaiter keys to the number of
+      #           remaining jobs.
+      # next_stage - The name of the next stage to start when all jobs have been
+      #              completed.
+      def perform(project_id, waiters, next_stage)
+        return unless (project = find_project(project_id))
+
+        new_waiters = wait_for_jobs(waiters)
+
+        if new_waiters.empty?
+          # We refresh the import JID here so workers importing individual
+          # resources (e.g. notes) don't have to do this all the time, reducing
+          # the pressure on Redis. We _only_ do this once all jobs are done so
+          # we don't get stuck forever if one or more jobs failed to notify the
+          # JobWaiter.
+          project.refresh_import_jid_expiration
+
+          STAGES.fetch(next_stage.to_sym).perform_async(project_id)
+        else
+          self.class.perform_in(INTERVAL, project_id, new_waiters, next_stage)
+        end
+      end
+
+      def wait_for_jobs(waiters)
+        waiters.each_with_object({}) do |(key, remaining), new_waiters|
+          waiter = JobWaiter.new(remaining, key)
+
+          # We wait for a brief moment of time so we don't reschedule if we can
+          # complete the work fast enough.
+          waiter.wait(BLOCKING_WAIT_TIME)
+
+          next unless waiter.jobs_remaining.positive?
+
+          new_waiters[waiter.key] = waiter.jobs_remaining
+        end
+      end
+
+      def find_project(id)
+        # We only care about the import JID so we can refresh it. We also only
+        # want the project if it hasn't been marked as failed yet. It's possible
+        # the import gets marked as stuck when jobs of the current stage failed
+        # somehow.
+        Project.select(:import_jid).import_started.find_by(id: id)
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/import_diff_note_worker.rb b/app/workers/gitlab/github_import/import_diff_note_worker.rb
new file mode 100644
index 00000000000..ef2a74c51c5
--- /dev/null
+++ b/app/workers/gitlab/github_import/import_diff_note_worker.rb
@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    class ImportDiffNoteWorker
+      include ObjectImporter
+
+      def representation_class
+        Representation::DiffNote
+      end
+
+      def importer_class
+        Importer::DiffNoteImporter
+      end
+
+      def counter_name
+        :github_importer_imported_diff_notes
+      end
+
+      def counter_description
+        'The number of imported GitHub pull request review comments'
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/import_issue_worker.rb b/app/workers/gitlab/github_import/import_issue_worker.rb
new file mode 100644
index 00000000000..1b081ae5966
--- /dev/null
+++ b/app/workers/gitlab/github_import/import_issue_worker.rb
@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    class ImportIssueWorker
+      include ObjectImporter
+
+      def representation_class
+        Representation::Issue
+      end
+
+      def importer_class
+        Importer::IssueAndLabelLinksImporter
+      end
+
+      def counter_name
+        :github_importer_imported_issues
+      end
+
+      def counter_description
+        'The number of imported GitHub issues'
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/import_note_worker.rb b/app/workers/gitlab/github_import/import_note_worker.rb
new file mode 100644
index 00000000000..d2b4c36a5b9
--- /dev/null
+++ b/app/workers/gitlab/github_import/import_note_worker.rb
@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    class ImportNoteWorker
+      include ObjectImporter
+
+      def representation_class
+        Representation::Note
+      end
+
+      def importer_class
+        Importer::NoteImporter
+      end
+
+      def counter_name
+        :github_importer_imported_notes
+      end
+
+      def counter_description
+        'The number of imported GitHub comments'
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/import_pull_request_worker.rb b/app/workers/gitlab/github_import/import_pull_request_worker.rb
new file mode 100644
index 00000000000..62a6da152a3
--- /dev/null
+++ b/app/workers/gitlab/github_import/import_pull_request_worker.rb
@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    class ImportPullRequestWorker
+      include ObjectImporter
+
+      def representation_class
+        Representation::PullRequest
+      end
+
+      def importer_class
+        Importer::PullRequestImporter
+      end
+
+      def counter_name
+        :github_importer_imported_pull_requests
+      end
+
+      def counter_description
+        'The number of imported GitHub pull requests'
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/refresh_import_jid_worker.rb b/app/workers/gitlab/github_import/refresh_import_jid_worker.rb
new file mode 100644
index 00000000000..45a38927225
--- /dev/null
+++ b/app/workers/gitlab/github_import/refresh_import_jid_worker.rb
@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    class RefreshImportJidWorker
+      include Sidekiq::Worker
+      include GithubImport::Queue
+
+      # The interval to schedule new instances of this job at.
+      INTERVAL = 1.minute.to_i
+
+      def self.perform_in_the_future(*args)
+        perform_in(INTERVAL, *args)
+      end
+
+      # project_id - The ID of the project that is being imported.
+      # check_job_id - The ID of the job for which to check the status.
+      def perform(project_id, check_job_id)
+        return unless (project = find_project(project_id))
+
+        if SidekiqStatus.running?(check_job_id)
+          # As long as the repository is being cloned we want to keep refreshing
+          # the import JID status.
+          project.refresh_import_jid_expiration
+          self.class.perform_in_the_future(project_id, check_job_id)
+        end
+
+        # If the job is no longer running there's nothing else we need to do. If
+        # the clone job completed successfully it will have scheduled the next
+        # stage, if it died there's nothing we can do anyway.
+      end
+
+      def find_project(id)
+        Project.select(:import_jid).import_started.find_by(id: id)
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/stage/finish_import_worker.rb b/app/workers/gitlab/github_import/stage/finish_import_worker.rb
new file mode 100644
index 00000000000..1a09497780a
--- /dev/null
+++ b/app/workers/gitlab/github_import/stage/finish_import_worker.rb
@@ -0,0 +1,43 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    module Stage
+      class FinishImportWorker
+        include Sidekiq::Worker
+        include GithubImport::Queue
+        include StageMethods
+
+        # project - An instance of Project.
+        def import(_, project)
+          project.after_import
+          report_import_time(project)
+        end
+
+        def report_import_time(project)
+          duration = Time.zone.now - project.created_at
+          path = project.path_with_namespace
+
+          histogram.observe({ project: path }, duration)
+          counter.increment
+
+          logger.info("GitHub importer finished for #{path} in #{duration.round(2)} seconds")
+        end
+
+        def histogram
+          @histogram ||= Gitlab::Metrics.histogram(
+            :github_importer_total_duration_seconds,
+            'Total time spent importing GitHub projects, in seconds'
+          )
+        end
+
+        def counter
+          @counter ||= Gitlab::Metrics.counter(
+            :github_importer_imported_projects,
+            'The number of imported GitHub projects'
+          )
+        end
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/stage/import_base_data_worker.rb b/app/workers/gitlab/github_import/stage/import_base_data_worker.rb
new file mode 100644
index 00000000000..f8a3684c6ba
--- /dev/null
+++ b/app/workers/gitlab/github_import/stage/import_base_data_worker.rb
@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    module Stage
+      class ImportBaseDataWorker
+        include Sidekiq::Worker
+        include GithubImport::Queue
+        include StageMethods
+
+        # These importers are fast enough that we can just run them in the same
+        # thread.
+        IMPORTERS = [
+          Importer::LabelsImporter,
+          Importer::MilestonesImporter,
+          Importer::ReleasesImporter
+        ].freeze
+
+        # client - An instance of Gitlab::GithubImport::Client.
+        # project - An instance of Project.
+        def import(client, project)
+          IMPORTERS.each do |klass|
+            klass.new(project, client).execute
+          end
+
+          project.refresh_import_jid_expiration
+
+          ImportPullRequestsWorker.perform_async(project.id)
+        end
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/stage/import_issues_and_diff_notes_worker.rb b/app/workers/gitlab/github_import/stage/import_issues_and_diff_notes_worker.rb
new file mode 100644
index 00000000000..e110b7c1c36
--- /dev/null
+++ b/app/workers/gitlab/github_import/stage/import_issues_and_diff_notes_worker.rb
@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    module Stage
+      class ImportIssuesAndDiffNotesWorker
+        include Sidekiq::Worker
+        include GithubImport::Queue
+        include StageMethods
+
+        # The importers to run in this stage. Issues can't be imported earlier
+        # on as we also use these to enrich pull requests with assigned labels.
+        IMPORTERS = [
+          Importer::IssuesImporter,
+          Importer::DiffNotesImporter
+        ].freeze
+
+        # client - An instance of Gitlab::GithubImport::Client.
+        # project - An instance of Project.
+        def import(client, project)
+          waiters = IMPORTERS.each_with_object({}) do |klass, hash|
+            waiter = klass.new(project, client).execute
+            hash[waiter.key] = waiter.jobs_remaining
+          end
+
+          AdvanceStageWorker.perform_async(project.id, waiters, :notes)
+        end
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/stage/import_notes_worker.rb b/app/workers/gitlab/github_import/stage/import_notes_worker.rb
new file mode 100644
index 00000000000..9810ed25cf9
--- /dev/null
+++ b/app/workers/gitlab/github_import/stage/import_notes_worker.rb
@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    module Stage
+      class ImportNotesWorker
+        include Sidekiq::Worker
+        include GithubImport::Queue
+        include StageMethods
+
+        # client - An instance of Gitlab::GithubImport::Client.
+        # project - An instance of Project.
+        def import(client, project)
+          waiter = Importer::NotesImporter
+            .new(project, client)
+            .execute
+
+          AdvanceStageWorker.perform_async(
+            project.id,
+            { waiter.key => waiter.jobs_remaining },
+            :finish
+          )
+        end
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/stage/import_pull_requests_worker.rb b/app/workers/gitlab/github_import/stage/import_pull_requests_worker.rb
new file mode 100644
index 00000000000..c531f26e897
--- /dev/null
+++ b/app/workers/gitlab/github_import/stage/import_pull_requests_worker.rb
@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    module Stage
+      class ImportPullRequestsWorker
+        include Sidekiq::Worker
+        include GithubImport::Queue
+        include StageMethods
+
+        # client - An instance of Gitlab::GithubImport::Client.
+        # project - An instance of Project.
+        def import(client, project)
+          waiter = Importer::PullRequestsImporter
+            .new(project, client)
+            .execute
+
+          project.refresh_import_jid_expiration
+
+          AdvanceStageWorker.perform_async(
+            project.id,
+            { waiter.key => waiter.jobs_remaining },
+            :issues_and_diff_notes
+          )
+        end
+      end
+    end
+  end
+end
diff --git a/app/workers/gitlab/github_import/stage/import_repository_worker.rb b/app/workers/gitlab/github_import/stage/import_repository_worker.rb
new file mode 100644
index 00000000000..aa5762e773d
--- /dev/null
+++ b/app/workers/gitlab/github_import/stage/import_repository_worker.rb
@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+
+module Gitlab
+  module GithubImport
+    module Stage
+      class ImportRepositoryWorker
+        include Sidekiq::Worker
+        include GithubImport::Queue
+        include StageMethods
+
+        # client - An instance of Gitlab::GithubImport::Client.
+        # project - An instance of Project.
+        def import(client, project)
+          # In extreme cases it's possible for a clone to take more than the
+          # import job expiration time. To work around this we schedule a
+          # separate job that will periodically run and refresh the import
+          # expiration time.
+          RefreshImportJidWorker.perform_in_the_future(project.id, jid)
+
+          importer = Importer::RepositoryImporter.new(project, client)
+
+          return unless importer.execute
+
+          counter.increment
+
+          ImportBaseDataWorker.perform_async(project.id)
+        end
+
+        def counter
+          Gitlab::Metrics.counter(
+            :github_importer_imported_repositories,
+            'The number of imported GitHub repositories'
+          )
+        end
+      end
+    end
+  end
+end
diff --git a/app/workers/repository_import_worker.rb b/app/workers/repository_import_worker.rb
index d7c0043d3b6..4e90b137b26 100644
--- a/app/workers/repository_import_worker.rb
+++ b/app/workers/repository_import_worker.rb
@@ -17,11 +17,16 @@ class RepositoryImportWorker
                               import_url: project.import_url,
                               path: project.full_path)
 
-    result = Projects::ImportService.new(project, project.creator).execute
+    service = Projects::ImportService.new(project, project.creator)
+    result = service.execute
+
+    # Some importers may perform their work asynchronously. In this case it's up
+    # to those importers to mark the import process as complete.
+    return if service.async?
+
     raise ImportError, result[:message] if result[:status] == :error
 
-    project.repository.after_import
-    project.import_finish
+    project.after_import
   rescue ImportError => ex
     fail_import(project, ex.message)
     raise
diff --git a/app/workers/update_merge_requests_worker.rb b/app/workers/update_merge_requests_worker.rb
index 150788ca611..afc47fc63d6 100644
--- a/app/workers/update_merge_requests_worker.rb
+++ b/app/workers/update_merge_requests_worker.rb
@@ -2,9 +2,7 @@ class UpdateMergeRequestsWorker
   include Sidekiq::Worker
   include DedicatedSidekiqQueue
 
-  def metrics_tags
-    @metrics_tags || {}
-  end
+  LOG_TIME_THRESHOLD = 90 # seconds
 
   def perform(project_id, user_id, oldrev, newrev, ref)
     project = Project.find_by(id: project_id)
@@ -13,11 +11,20 @@ class UpdateMergeRequestsWorker
     user = User.find_by(id: user_id)
     return unless user
 
-    @metrics_tags = {
-      project_id: project_id,
-      user_id: user_id
-    }
+    # TODO: remove this benchmarking when we have rich logging
+    time = Benchmark.measure do
+      MergeRequests::RefreshService.new(project, user).execute(oldrev, newrev, ref)
+    end
+
+    args_log = [
+      "elapsed=#{time.real}",
+      "project_id=#{project_id}",
+      "user_id=#{user_id}",
+      "oldrev=#{oldrev}",
+      "newrev=#{newrev}",
+      "ref=#{ref}"
+    ].join(',')
 
-    MergeRequests::RefreshService.new(project, user).execute(oldrev, newrev, ref)
+    Rails.logger.info("UpdateMergeRequestsWorker#perform #{args_log}") if time.real > LOG_TIME_THRESHOLD
   end
 end
diff --git a/app/workers/wait_for_cluster_creation_worker.rb b/app/workers/wait_for_cluster_creation_worker.rb
index 5aa3bbdaa9d..241ed3901dc 100644
--- a/app/workers/wait_for_cluster_creation_worker.rb
+++ b/app/workers/wait_for_cluster_creation_worker.rb
@@ -2,25 +2,10 @@ class WaitForClusterCreationWorker
   include Sidekiq::Worker
   include ClusterQueue
 
-  INITIAL_INTERVAL = 2.minutes
-  EAGER_INTERVAL = 10.seconds
-  TIMEOUT = 20.minutes
-
   def perform(cluster_id)
-    Gcp::Cluster.find_by_id(cluster_id).try do |cluster|
-      Ci::FetchGcpOperationService.new.execute(cluster) do |operation|
-        case operation.status
-        when 'RUNNING'
-          if TIMEOUT < Time.now.utc - operation.start_time.to_time.utc
-            return cluster.make_errored!("Cluster creation time exceeds timeout; #{TIMEOUT}")
-          end
-
-          WaitForClusterCreationWorker.perform_in(EAGER_INTERVAL, cluster.id)
-        when 'DONE'
-          Ci::FinalizeClusterCreationService.new.execute(cluster)
-        else
-          return cluster.make_errored!("Unexpected operation status; #{operation.status} #{operation.status_message}")
-        end
+    Clusters::Cluster.find_by_id(cluster_id).try do |cluster|
+      cluster.provider.try do |provider|
+        Clusters::Gcp::VerifyProvisionStatusService.new.execute(provider) if cluster.gcp?
       end
     end
   end