Merge remote-tracking branch 'origin/master' into 18608-lock-issues

16 files changed, 44 insertions, 83 deletions

diff --git a/app/assets/javascripts/branches/branches_delete_modal.js b/app/assets/javascripts/branches/branches_delete_modal.js
index af8bcdc1794..cbc28374b80 100644
--- a/app/assets/javascripts/branches/branches_delete_modal.js
+++ b/app/assets/javascripts/branches/branches_delete_modal.js
@@ -7,6 +7,7 @@ class DeleteModal {
     this.$branchName = $('.js-branch-name', this.$modal);
     this.$confirmInput = $('.js-delete-branch-input', this.$modal);
     this.$deleteBtn = $('.js-delete-branch', this.$modal);
+    this.$notMerged = $('.js-not-merged', this.$modal);
     this.bindEvents();
   }
 
@@ -16,8 +17,10 @@ class DeleteModal {
   }
 
   setModalData(e) {
-    this.branchName = e.currentTarget.dataset.branchName || '';
-    this.deletePath = e.currentTarget.dataset.deletePath || '';
+    const branchData = e.currentTarget.dataset;
+    this.branchName = branchData.branchName || '';
+    this.deletePath = branchData.deletePath || '';
+    this.isMerged = !!branchData.isMerged;
     this.updateModal();
   }
 
@@ -30,6 +33,7 @@ class DeleteModal {
     this.$confirmInput.val('');
     this.$deleteBtn.attr('href', this.deletePath);
     this.$deleteBtn.attr('disabled', true);
+    this.$notMerged.toggleClass('hidden', this.isMerged);
   }
 }
 
diff --git a/app/assets/javascripts/filtered_search/dropdown_user.js b/app/assets/javascripts/filtered_search/dropdown_user.js
index 7246ccbb281..720fbc87ea0 100644
--- a/app/assets/javascripts/filtered_search/dropdown_user.js
+++ b/app/assets/javascripts/filtered_search/dropdown_user.js
@@ -15,6 +15,7 @@ class DropdownUser extends gl.FilteredSearchDropdown {
         params: {
           per_page: 20,
           active: true,
+          group_id: this.getGroupId(),
           project_id: this.getProjectId(),
           current_user: true,
         },
@@ -47,6 +48,10 @@ class DropdownUser extends gl.FilteredSearchDropdown {
     super.renderContent(forceShowList);
   }
 
+  getGroupId() {
+    return this.input.getAttribute('data-group-id');
+  }
+
   getProjectId() {
     return this.input.getAttribute('data-project-id');
   }
diff --git a/app/assets/javascripts/fly_out_nav.js b/app/assets/javascripts/fly_out_nav.js
index ad8254167a2..157280d66e3 100644
--- a/app/assets/javascripts/fly_out_nav.js
+++ b/app/assets/javascripts/fly_out_nav.js
@@ -77,10 +77,11 @@ export const hideMenu = (el) => {
 export const moveSubItemsToPosition = (el, subItems) => {
   const boundingRect = el.getBoundingClientRect();
   const top = calculateTop(boundingRect, subItems.offsetHeight);
+  const left = sidebar ? sidebar.offsetWidth : 50;
   const isAbove = top < boundingRect.top;
 
   subItems.classList.add('fly-out-list');
-  subItems.style.transform = `translate3d(0, ${Math.floor(top) - headerHeight}px, 0)`; // eslint-disable-line no-param-reassign
+  subItems.style.transform = `translate3d(${left}px, ${Math.floor(top) - headerHeight}px, 0)`; // eslint-disable-line no-param-reassign
 
   const subItemsRect = subItems.getBoundingClientRect();
 
diff --git a/app/assets/javascripts/labels_select.js b/app/assets/javascripts/labels_select.js
index 7d7f91227f9..2538d9c2093 100644
--- a/app/assets/javascripts/labels_select.js
+++ b/app/assets/javascripts/labels_select.js
@@ -127,13 +127,6 @@ import DropdownUtils from './filtered_search/dropdown_utils';
             $('.has-tooltip', $value).tooltip({
               container: 'body'
             });
-            return $value.find('a').each(function(i) {
-              return setTimeout((function(_this) {
-                return function() {
-                  return gl.animate.animate($(_this), 'pulse');
-                };
-              })(this), 200 * i);
-            });
           });
         };
         $dropdown.glDropdown({
diff --git a/app/assets/javascripts/lib/utils/animate.js b/app/assets/javascripts/lib/utils/animate.js
deleted file mode 100644
index d93c1d0da59..00000000000
--- a/app/assets/javascripts/lib/utils/animate.js
+++ /dev/null
@@ -1,49 +0,0 @@
-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-param-reassign, no-void, prefer-template, no-var, new-cap, prefer-arrow-callback, consistent-return, max-len */
-(function() {
-  (function(w) {
-    if (w.gl == null) {
-      w.gl = {};
-    }
-    if (gl.animate == null) {
-      gl.animate = {};
-    }
-    gl.animate.animate = function($el, animation, options, done) {
-      if ((options != null ? options.cssStart : void 0) != null) {
-        $el.css(options.cssStart);
-      }
-      $el.removeClass(animation + ' animated').addClass(animation + ' animated').one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {
-        $(this).removeClass(animation + ' animated');
-        if (done != null) {
-          done();
-        }
-        if ((options != null ? options.cssEnd : void 0) != null) {
-          $el.css(options.cssEnd);
-        }
-      });
-    };
-    gl.animate.animateEach = function($els, animation, time, options, done) {
-      var dfd;
-      dfd = $.Deferred();
-      if (!$els.length) {
-        dfd.resolve();
-      }
-      $els.each(function(i) {
-        setTimeout((function(_this) {
-          return function() {
-            var $this;
-            $this = $(_this);
-            return gl.animate.animate($this, animation, options, function() {
-              if (i === $els.length - 1) {
-                dfd.resolve();
-                if (done != null) {
-                  return done();
-                }
-              }
-            });
-          };
-        })(this), time * i);
-      });
-      return dfd.promise();
-    };
-  })(window);
-}).call(window);
diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js
index 0bc31a56684..0f84470828a 100644
--- a/app/assets/javascripts/main.js
+++ b/app/assets/javascripts/main.js
@@ -39,7 +39,6 @@ import './commit/file';
 import './commit/image_file';
 
 // lib/utils
-import './lib/utils/animate';
 import './lib/utils/bootstrap_linked_tabs';
 import './lib/utils/common_utils';
 import './lib/utils/datetime_utility';
diff --git a/app/assets/javascripts/new_sidebar.js b/app/assets/javascripts/new_sidebar.js
index cea4f35096a..f2eb2338a1e 100644
--- a/app/assets/javascripts/new_sidebar.js
+++ b/app/assets/javascripts/new_sidebar.js
@@ -15,7 +15,6 @@ export default class NewNavSidebar {
     this.$openSidebar = $('.toggle-mobile-nav');
     this.$closeSidebar = $('.close-nav-button');
     this.$sidebarToggle = $('.js-toggle-sidebar');
-    this.$topLevelLinks = $('.sidebar-top-level-items > li > a');
   }
 
   bindEvents() {
@@ -56,10 +55,6 @@ export default class NewNavSidebar {
       this.$page.toggleClass('page-with-icon-sidebar', breakpoint === 'sm' ? true : collapsed);
     }
     NewNavSidebar.setCollapsedCookie(collapsed);
-
-    this.$topLevelLinks.attr('title', function updateTopLevelTitle() {
-      return collapsed ? this.getAttribute('aria-label') : '';
-    });
   }
 
   render() {
diff --git a/app/assets/javascripts/notes/components/issue_note_actions.vue b/app/assets/javascripts/notes/components/issue_note_actions.vue
index 60c172321d1..feb3e73194b 100644
--- a/app/assets/javascripts/notes/components/issue_note_actions.vue
+++ b/app/assets/javascripts/notes/components/issue_note_actions.vue
@@ -86,7 +86,7 @@
   <div class="note-actions">
     <span
       v-if="accessLevel"
-      class="note-role">{{accessLevel}}</span>
+      class="note-role note-role-access">{{accessLevel}}</span>
     <div
       v-if="canAddAwardEmoji"
       class="note-actions-item">
diff --git a/app/assets/stylesheets/framework/nav.scss b/app/assets/stylesheets/framework/nav.scss
index 5ffa67a1220..2f7717760ec 100644
--- a/app/assets/stylesheets/framework/nav.scss
+++ b/app/assets/stylesheets/framework/nav.scss
@@ -328,7 +328,7 @@
   border-bottom: 1px solid $border-color;
   transition: padding $sidebar-transition-duration;
   text-align: center;
-  margin-top: $header-height;
+  margin-top: $new-navbar-height;
 
   .container-fluid {
     position: relative;
diff --git a/app/assets/stylesheets/framework/sidebar.scss b/app/assets/stylesheets/framework/sidebar.scss
index ef58382ba41..48dc25d343b 100644
--- a/app/assets/stylesheets/framework/sidebar.scss
+++ b/app/assets/stylesheets/framework/sidebar.scss
@@ -78,16 +78,16 @@
 
 .right-sidebar {
   border-left: 1px solid $border-color;
-  height: calc(100% - #{$header-height});
+  height: calc(100% - #{$new-navbar-height});
 
   &.affix {
     position: fixed;
-    top: $header-height;
+    top: $new-navbar-height;
   }
 }
 
 .with-performance-bar .right-sidebar.affix {
-  top: $header-height + $performance-bar-height;
+  top: $new-navbar-height + $performance-bar-height;
 }
 
 @mixin maintain-sidebar-dimensions {
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 594b0bb0556..75cb9e009bb 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -13,6 +13,7 @@ $sidebar-breakpoint: 1024px;
 $darken-normal-factor: 7%;
 $darken-dark-factor: 10%;
 $darken-border-factor: 5%;
+$darken-border-dashed-factor: 25%;
 
 $white-light: #fff;
 $white-normal: #f0f0f0;
@@ -134,6 +135,7 @@ $border-white-normal: darken($white-normal, $darken-border-factor);
 
 $border-gray-light: darken($gray-light, $darken-border-factor);
 $border-gray-normal: darken($gray-normal, $darken-border-factor);
+$border-gray-normal-dashed: darken($gray-normal, $darken-border-dashed-factor);
 $border-gray-dark: darken($white-normal, $darken-border-factor);
 
 /*
diff --git a/app/assets/stylesheets/new_sidebar.scss b/app/assets/stylesheets/new_sidebar.scss
index 952002c83d1..8030854e527 100644
--- a/app/assets/stylesheets/new_sidebar.scss
+++ b/app/assets/stylesheets/new_sidebar.scss
@@ -105,7 +105,8 @@ $new-sidebar-collapsed-width: 50px;
   }
 
   &.sidebar-icons-only {
-    width: $new-sidebar-collapsed-width;
+    width: auto;
+    min-width: $new-sidebar-collapsed-width;
 
     .nav-sidebar-inner-scroll {
       overflow-x: hidden;
@@ -124,6 +125,10 @@ $new-sidebar-collapsed-width: 50px;
     .fly-out-top-item {
       display: block;
     }
+
+    .avatar-container {
+      margin-right: 0;
+    }
   }
 
   &.nav-sidebar-expanded {
@@ -187,7 +192,7 @@ $new-sidebar-collapsed-width: 50px;
 .nav-sidebar-inner-scroll {
   height: 100%;
   width: 100%;
-  overflow: auto;
+  overflow: scroll;
 }
 
 .with-performance-bar .nav-sidebar {
@@ -248,7 +253,7 @@ $new-sidebar-collapsed-width: 50px;
         @media (min-width: $screen-sm-min) {
           position: fixed;
           top: 0;
-          left: $new-sidebar-width;
+          left: 0;
           min-width: 150px;
           margin-top: -1px;
           padding: 4px 1px;
@@ -386,10 +391,6 @@ $new-sidebar-collapsed-width: 50px;
     }
 
     .sidebar-sub-level-items {
-      @media (min-width: $screen-sm-min) {
-        left: $new-sidebar-collapsed-width;
-      }
-
       &:not(.flyout-list) {
         display: none;
       }
diff --git a/app/assets/stylesheets/pages/builds.scss b/app/assets/stylesheets/pages/builds.scss
index 50ec5110bf1..359dd388d05 100644
--- a/app/assets/stylesheets/pages/builds.scss
+++ b/app/assets/stylesheets/pages/builds.scss
@@ -64,10 +64,10 @@
     color: $gl-text-color;
     position: sticky;
     position: -webkit-sticky;
-    top: $header-height;
+    top: $new-navbar-height;
 
     &.affix {
-      top: $header-height;
+      top: $new-navbar-height;
     }
 
     // with sidebar
@@ -174,10 +174,10 @@
 
 .with-performance-bar .build-page {
   .top-bar {
-    top: $header-height + $performance-bar-height;
+    top: $new-navbar-height + $performance-bar-height;
 
     &.affix {
-      top: $header-height + $performance-bar-height;
+      top: $new-navbar-height + $performance-bar-height;
     }
   }
 }
diff --git a/app/assets/stylesheets/pages/diff.scss b/app/assets/stylesheets/pages/diff.scss
index 54c3c0173ae..951580ea1fe 100644
--- a/app/assets/stylesheets/pages/diff.scss
+++ b/app/assets/stylesheets/pages/diff.scss
@@ -634,8 +634,16 @@
     padding-top: 8px;
     padding-bottom: 8px;
   }
+
+  .diff-changed-file {
+    display: flex;
+    align-items: center;
+  }
 }
 
 .diff-file-changes-path {
-  @include str-truncated(78%);
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
diff --git a/app/assets/stylesheets/pages/login.scss b/app/assets/stylesheets/pages/login.scss
index d4dc43035eb..cf5f933a762 100644
--- a/app/assets/stylesheets/pages/login.scss
+++ b/app/assets/stylesheets/pages/login.scss
@@ -95,6 +95,8 @@
   }
 
   .omniauth-container {
+    font-size: 13px;
+
     p {
       margin: 0;
     }
diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss
index 94e4f4334d4..6400b72742c 100644
--- a/app/assets/stylesheets/pages/projects.scss
+++ b/app/assets/stylesheets/pages/projects.scss
@@ -752,7 +752,7 @@ a.deploy-project-label {
   }
 
   li.missing {
-    border: 1px dashed $border-gray-normal;
+    border: 1px dashed $border-gray-normal-dashed;
     border-radius: $border-radius-default;
 
     a {