Add latest changes from gitlab-org/gitlab@13-2-stable-ee

24 files changed, 78 insertions, 243 deletions

diff --git a/app/assets/stylesheets/pages/alert_management/details.scss b/app/assets/stylesheets/pages/alert_management/details.scss
index 591a26e5941..73a4af00c5a 100644
--- a/app/assets/stylesheets/pages/alert_management/details.scss
+++ b/app/assets/stylesheets/pages/alert_management/details.scss
@@ -61,13 +61,13 @@
 
       &.is-active {
         &:last-child {
-          border-bottom: 1px solid $gray-200;
+          border-bottom: 1px solid $gray-100;
         }
       }
     }
   }
 
   .note-header-info {
-    margin-top: 1px;
+    @include gl-mt-1;
   }
 }
diff --git a/app/assets/stylesheets/pages/alert_management/list.scss b/app/assets/stylesheets/pages/alert_management/list.scss
index c1ea9b7604a..e420209b1fc 100644
--- a/app/assets/stylesheets/pages/alert_management/list.scss
+++ b/app/assets/stylesheets/pages/alert_management/list.scss
@@ -1,4 +1,8 @@
 .alert-management-list {
+  .new-alert {
+    background-color: $issues-today-bg;
+  }
+
   // these styles need to be deleted once GlTable component looks in GitLab same as in @gitlab/ui
   table {
     color: $gray-700;
@@ -8,14 +12,9 @@
         outline: none;
       }
 
-      > :not([aria-sort='none']).b-table-sort-icon-left:hover::before {
-        content: '' !important;
-      }
-
       td,
       th {
-        // TODO:  There is no gl-pl-9 utlity for this padding, to be done and then removed.
-        padding-left: 1.25rem;
+        @include gl-pl-9;
         @include gl-py-5;
         @include gl-outline-none;
         @include gl-relative;
@@ -26,24 +25,8 @@
         font-weight: $gl-font-weight-bold;
         color: $gl-gray-600;
 
-        &:hover::before {
-          left: 3%;
-          top: 34%;
-          @include gl-absolute;
-          content: url("data:image/svg+xml,%3Csvg \
-            xmlns='http://www.w3.org/2000/svg' \
-            width='14' height='14' viewBox='0 0 16 \
-            16'%3E%3Cpath fill='%23BABABA' fill-rule='evenodd' \
-            d='M11.707085,11.7071 L7.999975,15.4142 L4.292875,11.7071 \
-            C3.902375,11.3166 3.902375,10.6834 \
-            4.292875,10.2929 C4.683375,9.90237 \
-            5.316575,9.90237 5.707075,10.2929 \
-            L6.999975,11.5858 L6.999975,2 C6.999975,1.44771 \
-            7.447695,1 7.999975,1 C8.552255,1 8.999975,1.44771 \
-            8.999975,2 L8.999975,11.5858 L10.292865,10.2929 \
-            C10.683395,9.90237 11.316555,9.90237 11.707085,10.2929 \
-            C12.097605,10.6834 12.097605,11.3166 11.707085,11.7071 \
-            Z'/%3E%3C/svg%3E%0A");
+        &[aria-sort='none']:hover {
+          background-image: url('data:image/svg+xml, %3csvg   xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="4 0 8 16"%3e   %3cpath style="fill: %23BABABA;" fill-rule="evenodd" d="M11.707085,11.7071   L7.999975,15.4142 L4.292875,11.7071 C3.902375,11.3166 3.902375,   10.6834 4.292875,10.2929 C4.683375,9.90237   5.316575,9.90237 5.707075,10.2929 L6.999975,   11.5858 L6.999975,2 C6.999975,1.44771   7.447695,1 7.999975,1 C8.552255,1 8.999975,1.44771   8.999975,2 L8.999975,11.5858 L10.292865,10.2929 C10.683395   ,9.90237 11.316555,9.90237 11.707085,10.2929   C12.097605,10.6834 12.097605,11.3166 11.707085,11.7071 Z"/%3e   %3c/svg%3e');
         }
       }
     }
@@ -74,7 +57,7 @@
               content: none !important;
             }
 
-            div {
+            div:not(.dropdown-title) {
               width: 100% !important;
               padding: 0 !important;
             }
diff --git a/app/assets/stylesheets/pages/boards.scss b/app/assets/stylesheets/pages/boards.scss
index 3e680c59910..049660220df 100644
--- a/app/assets/stylesheets/pages/boards.scss
+++ b/app/assets/stylesheets/pages/boards.scss
@@ -45,7 +45,8 @@
   }
 }
 
-.boards-list {
+.boards-list,
+.board-swimlanes {
   height: calc(100vh - #{$issue-board-list-difference-xs});
   overflow-x: scroll;
   min-height: 200px;
@@ -82,7 +83,6 @@
   }
 
   .board-title-caret {
-    cursor: pointer;
     border-radius: $border-radius-default;
     line-height: $gl-spacing-scale-5;
     height: $gl-spacing-scale-5;
@@ -109,7 +109,6 @@
     .board-title {
       flex-direction: column;
       height: 100%;
-      padding: $gl-padding-8 0;
     }
 
     .board-title-caret {
@@ -203,8 +202,7 @@
   flex-grow: 1;
 }
 
-.board-delete {
-  color: $gray-darkest;
+.board-delete.gl-button {
   background-color: transparent;
   outline: 0;
 
@@ -579,7 +577,10 @@
   }
 }
 
-.board-epics-swimlanes {
+.board-swimlanes {
   overflow-x: auto;
-  min-height: 600px;
+}
+
+.board-header-collapsed-info-icon:hover {
+  color: $gray-900;
 }
diff --git a/app/assets/stylesheets/pages/branches.scss b/app/assets/stylesheets/pages/branches.scss
index e1715b8e1bf..3c49cc54ac4 100644
--- a/app/assets/stylesheets/pages/branches.scss
+++ b/app/assets/stylesheets/pages/branches.scss
@@ -23,7 +23,7 @@
 
     .bar {
       height: 4px;
-      background-color: $gl-gray-200;
+      background-color: $gl-gray-100;
     }
 
     .count {
@@ -34,7 +34,7 @@
   .graph-separator {
     width: $graph-separator-width;
     height: 18px;
-    background-color: $gl-gray-200;
+    background-color: $gl-gray-100;
   }
 }
 
diff --git a/app/assets/stylesheets/pages/builds.scss b/app/assets/stylesheets/pages/builds.scss
index f50d4bc736e..02c42d5b779 100644
--- a/app/assets/stylesheets/pages/builds.scss
+++ b/app/assets/stylesheets/pages/builds.scss
@@ -236,7 +236,7 @@
   .trigger-variables-table-cell {
     font-size: $gl-font-size-small;
     line-height: $gl-line-height;
-    border: 1px solid $gray-200;
+    border: 1px solid $gray-100;
     padding: $gl-padding-4 6px;
     width: 50%;
     vertical-align: top;
diff --git a/app/assets/stylesheets/pages/container_registry.scss b/app/assets/stylesheets/pages/container_registry.scss
deleted file mode 100644
index b88bd78cf3d..00000000000
--- a/app/assets/stylesheets/pages/container_registry.scss
+++ /dev/null
@@ -1,47 +0,0 @@
-/**
- * Container Registry
- */
-
-.container-message {
-  span .btn {
-    margin: 0;
-  }
-}
-
-.container-image {
-  border-bottom: 1px solid $white-normal;
-}
-
-.container-image-head {
-  padding: 0 16px;
-  line-height: 4em;
-
-  .btn-link {
-    padding: 0;
-
-    &:focus {
-      outline: none;
-    }
-  }
-}
-
-.table.tags {
-  margin-bottom: 0;
-
-  .registry-image-row {
-    .check {
-      padding-right: $gl-padding;
-      width: 5%;
-    }
-
-    .action-buttons {
-      opacity: 0;
-    }
-
-    &:hover {
-      .action-buttons {
-        opacity: 1;
-      }
-    }
-  }
-}
diff --git a/app/assets/stylesheets/pages/diff.scss b/app/assets/stylesheets/pages/diff.scss
index 98d74a9aaa2..fd5b3ff1dd8 100644
--- a/app/assets/stylesheets/pages/diff.scss
+++ b/app/assets/stylesheets/pages/diff.scss
@@ -935,11 +935,10 @@ table.code {
   }
 }
 
-.files:not([data-can-create-note='true']) .frame {
+.files:not([data-can-create-note]) .frame {
   cursor: auto;
 }
 
-.frame,
 .frame.click-to-comment,
 .btn-transparent.image-diff-overlay-add-comment {
   position: relative;
diff --git a/app/assets/stylesheets/pages/editor.scss b/app/assets/stylesheets/pages/editor.scss
index eb9684c7b3c..fd11d0e3a69 100644
--- a/app/assets/stylesheets/pages/editor.scss
+++ b/app/assets/stylesheets/pages/editor.scss
@@ -45,6 +45,7 @@
     display: block;
     float: left;
     margin-right: 10px;
+    max-width: 250px;
   }
 
   .new-file-name,
@@ -139,10 +140,6 @@
         clear: both;
       }
     }
-
-    .editor-ref {
-      max-width: 250px;
-    }
   }
 }
 
diff --git a/app/assets/stylesheets/pages/environment_logs.scss b/app/assets/stylesheets/pages/environment_logs.scss
index 81cec14062f..03993e5321d 100644
--- a/app/assets/stylesheets/pages/environment_logs.scss
+++ b/app/assets/stylesheets/pages/environment_logs.scss
@@ -31,10 +31,6 @@
         width: 160px;
       }
     }
-
-    .controllers {
-      @include build-controllers(16px, flex-end, false, 2, inline);
-    }
   }
 
   .log-lines,
diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss
index b1e849143b0..a7d0d4259ea 100644
--- a/app/assets/stylesheets/pages/issuable.scss
+++ b/app/assets/stylesheets/pages/issuable.scss
@@ -115,20 +115,6 @@
     font-size: 0;
     margin-bottom: -5px;
   }
-
-  .scoped-label-wrapper {
-    > a {
-      max-width: 100%;
-    }
-
-    .color-label {
-      padding-right: $gl-padding-24;
-    }
-
-    .scoped-label {
-      right: 12px;
-    }
-  }
 }
 
 .assignee {
@@ -396,7 +382,7 @@
       overflow: hidden;
 
       &:hover {
-        background-color: $gray-200;
+        background-color: $gray-100;
       }
 
       &.issuable-sidebar-header {
@@ -983,10 +969,6 @@
   vertical-align: sub;
 }
 
-.suggestion-item a {
-  color: initial;
-}
-
 .suggestion-confidential {
   color: $orange-600;
 }
diff --git a/app/assets/stylesheets/pages/issues/issue_count_badge.scss b/app/assets/stylesheets/pages/issues/issue_count_badge.scss
index 569f323abd8..f2283e02ad2 100644
--- a/app/assets/stylesheets/pages/issues/issue_count_badge.scss
+++ b/app/assets/stylesheets/pages/issues/issue_count_badge.scss
@@ -1,7 +1,5 @@
 .issue-count-badge,
 .mr-count-badge {
-  display: inline-flex;
-  border-radius: $border-radius-base;
   padding: 5px $gl-padding-8;
 }
 
diff --git a/app/assets/stylesheets/pages/issues/issues_list.scss b/app/assets/stylesheets/pages/issues/issues_list.scss
new file mode 100644
index 00000000000..c0af7a6af6d
--- /dev/null
+++ b/app/assets/stylesheets/pages/issues/issues_list.scss
@@ -0,0 +1,5 @@
+.svg-container.jira-logo-container {
+  svg {
+    vertical-align: text-bottom;
+  }
+}
diff --git a/app/assets/stylesheets/pages/labels.scss b/app/assets/stylesheets/pages/labels.scss
index c3bac053a0a..73d2c3ca2f8 100644
--- a/app/assets/stylesheets/pages/labels.scss
+++ b/app/assets/stylesheets/pages/labels.scss
@@ -134,6 +134,11 @@
   }
 }
 
+.label-description-wrapper {
+  margin-right: 8px;
+  margin-left: 8px;
+}
+
 .prioritized-labels {
   margin-bottom: 30px;
 
@@ -310,7 +315,6 @@
     width: 200px;
     flex-shrink: 0;
 
-    .scoped-label-wrapper,
     .gl-label {
       line-height: $gl-line-height;
     }
@@ -386,7 +390,7 @@
       order: 3;
       width: 100%;
 
-      > .append-right-default.prepend-left-default {
+      > .label-description-wrapper {
         margin-left: 0;
         margin-right: 0;
       }
@@ -415,40 +419,6 @@
   color: $indigo-300;
 }
 
-.scoped-label-wrapper {
-  max-width: 100%;
-  vertical-align: top;
-
-  .badge {
-    text-overflow: ellipsis;
-    overflow-x: hidden;
-  }
-
-  &.label-link .color-label a {
-    color: inherit;
-  }
-
-  .color-label {
-    padding-right: $gl-padding-24;
-    max-width: 100%;
-  }
-
-  .scoped-label {
-    position: absolute;
-    top: 4px;
-    right: 8px;
-    padding: 0;
-    margin: 0;
-    line-height: $gl-line-height;
-  }
-
-  &.board-label {
-    .scoped-label {
-      top: 1px;
-    }
-  }
-}
-
 .gl-label-scoped {
   box-shadow: 0 0 0 2px currentColor inset;
 
@@ -456,29 +426,3 @@
     box-shadow: 0 0 0 1px inset;
   }
 }
-
-// Label inside title of Delete Label Modal
-.modal-header .page-title {
-  .scoped-label-wrapper {
-    .scoped-label {
-      line-height: 20px;
-    }
-
-    span.color-label {
-      padding-right: $gl-padding-24;
-    }
-  }
-}
-
-// Don't hide the overflow in system messages
-.system-note-message,
-.issuable-details,
-.md-preview-holder,
-.referenced-commands,
-.note-body {
-  .scoped-label-wrapper {
-    .badge {
-      overflow: initial;
-    }
-  }
-}
diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss
index 1e5e6da4e6c..5cf2d847405 100644
--- a/app/assets/stylesheets/pages/merge_requests.scss
+++ b/app/assets/stylesheets/pages/merge_requests.scss
@@ -64,7 +64,7 @@ $mr-widget-min-height: 69px;
   background-color: $gray-light;
 
   &.clickable:hover {
-    background-color: $gl-gray-200;
+    background-color: $gl-gray-100;
     cursor: pointer;
   }
 }
@@ -75,7 +75,7 @@ $mr-widget-min-height: 69px;
 
   &::before {
     content: '';
-    border-left: 1px solid $gray-200;
+    border-left: 1px solid $gray-100;
     position: absolute;
     left: 28px;
     top: -17px;
@@ -162,10 +162,6 @@ $mr-widget-min-height: 69px;
   .btn {
     font-size: $gl-font-size;
 
-    &[disabled] {
-      opacity: 0.3;
-    }
-
     &.dropdown-toggle {
       .fa {
         color: inherit;
@@ -401,6 +397,16 @@ $mr-widget-min-height: 69px;
         }
       }
     }
+
+    &.mr-pipeline-suggest {
+      border-radius: $border-radius-default;
+      line-height: 20px;
+      border: 1px solid $border-color;
+
+      .circle-icon-container {
+        color: $gl-text-color-quaternary;
+      }
+    }
   }
 
   .mr-widget-help {
@@ -600,26 +606,6 @@ $mr-widget-min-height: 69px;
   }
 }
 
-.mr-pipeline-suggest {
-  flex-wrap: wrap;
-  border-radius: $border-radius-default;
-  padding: $gl-padding;
-  border: 1px solid $border-color;
-  min-height: $mr-widget-min-height;
-
-  @include media-breakpoint-up(md) {
-    align-items: center;
-  }
-
-  .circle-icon-container {
-    color: $gl-text-color-quaternary;
-  }
-
-  .popover {
-    z-index: 240;
-  }
-}
-
 .card-new-merge-request {
   .card-header {
     padding: 5px 10px;
@@ -1050,3 +1036,7 @@ $mr-widget-min-height: 69px;
     }
   }
 }
+
+.diff-file-row.is-active {
+  background-color: $gray-50;
+}
diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss
index c3f3dbc223b..3a210d66420 100644
--- a/app/assets/stylesheets/pages/note_form.scss
+++ b/app/assets/stylesheets/pages/note_form.scss
@@ -62,7 +62,8 @@
     background-color: $white;
 
     &.is-focused {
-      @extend .form-control:focus;
+      border-color: $input-focus-border-color;
+      box-shadow: $input-focus-box-shadow;
 
       .comment-toolbar,
       .nav-links {
@@ -359,14 +360,6 @@ table {
   }
 }
 
-.toolbar-button-icon {
-  position: relative;
-  top: 1px;
-  margin-right: $gl-padding-4;
-  color: inherit;
-  font-size: 16px;
-}
-
 .toolbar-text {
   font-size: 14px;
   line-height: 16px;
@@ -489,6 +482,7 @@ table {
   border: 0;
   font-size: 14px;
   line-height: 16px;
+  vertical-align: initial;
 
   &:hover,
   &:focus {
@@ -498,6 +492,10 @@ table {
       text-decoration: underline;
     }
   }
+
+  .gl-icon:not(:last-child) {
+    margin-right: 0;
+  }
 }
 
 .markdown-selector {
diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss
index e8cdfd717c0..40f0104a2bf 100644
--- a/app/assets/stylesheets/pages/notes.scss
+++ b/app/assets/stylesheets/pages/notes.scss
@@ -10,6 +10,7 @@ $note-form-margin-left: 72px;
     top: 0;
     bottom: 0;
     left: $left;
+    height: calc(100% - 20px);
   }
 }
 
@@ -185,8 +186,8 @@ $note-form-margin-left: 72px;
       padding: $gl-padding;
 
       .dummy-avatar {
-        background-color: $gl-gray-200;
-        border: 1px solid darken($gl-gray-200, 25%);
+        background-color: $gl-gray-100;
+        border: 1px solid darken($gl-gray-100, 25%);
       }
 
       .note-headline-light,
@@ -254,10 +255,6 @@ $note-form-margin-left: 72px;
       }
 
       &.is-loading {
-        .fa-smile-o {
-          display: none;
-        }
-
         .fa-spinner {
           display: inline-block;
         }
diff --git a/app/assets/stylesheets/pages/pipelines.scss b/app/assets/stylesheets/pages/pipelines.scss
index 43d766db9e0..57ad9abef4b 100644
--- a/app/assets/stylesheets/pages/pipelines.scss
+++ b/app/assets/stylesheets/pages/pipelines.scss
@@ -253,13 +253,6 @@
 }
 
 .stage-cell {
-  &.table-section {
-    @include media-breakpoint-up(md) {
-      min-width: 160px; /* Hack alert: Without this the mini graph pipeline won't work properly*/
-      margin-right: -4px;
-    }
-  }
-
   .mini-pipeline-graph-dropdown-toggle {
     svg {
       height: $ci-action-icon-size;
@@ -816,7 +809,7 @@
 
   &.ci-status-icon-created,
   &.ci-status-icon-skipped {
-    @include mini-pipeline-graph-color($white, $gray-200, $gray-300, $gray-500, $gray-600, $gray-700);
+    @include mini-pipeline-graph-color($white, $gray-100, $gray-300, $gray-500, $gray-600, $gray-700);
   }
 }
 
@@ -1108,7 +1101,3 @@ button.mini-pipeline-graph-dropdown-toggle {
 .progress-bar.bg-primary {
   background-color: $blue-500 !important;
 }
-
-.parent-child-label-container {
-  padding-top: $gl-padding-4;
-}
diff --git a/app/assets/stylesheets/pages/profiles/preferences.scss b/app/assets/stylesheets/pages/profiles/preferences.scss
index 3bab84af492..12386fa66ec 100644
--- a/app/assets/stylesheets/pages/profiles/preferences.scss
+++ b/app/assets/stylesheets/pages/profiles/preferences.scss
@@ -19,11 +19,6 @@
   $ui-light-bg: #dfdfdf;
   $ui-dark-mode-bg: #1f1f1f;
 
-  label {
-    margin: 0 $gl-padding-32 $gl-padding 0;
-    text-align: center;
-  }
-
   .preview {
     font-size: 0;
     height: 48px;
diff --git a/app/assets/stylesheets/pages/prometheus.scss b/app/assets/stylesheets/pages/prometheus.scss
index 26db1fb9f58..6461d09bb47 100644
--- a/app/assets/stylesheets/pages/prometheus.scss
+++ b/app/assets/stylesheets/pages/prometheus.scss
@@ -34,7 +34,7 @@
 .draggable {
   &.draggable-enabled {
     .draggable-panel {
-      border: $gray-200 1px solid;
+      border: $gray-100 1px solid;
       border-radius: $border-radius-default;
       margin: -1px;
       cursor: grab;
diff --git a/app/assets/stylesheets/pages/runners.scss b/app/assets/stylesheets/pages/runners.scss
index dc3811bab65..66d2f76c558 100644
--- a/app/assets/stylesheets/pages/runners.scss
+++ b/app/assets/stylesheets/pages/runners.scss
@@ -45,8 +45,7 @@
     color: $gl-text-color-secondary;
   }
 
-  .fa-pause,
-  .fa-play {
+  .fa-pause {
     font-size: 11px;
   }
 }
diff --git a/app/assets/stylesheets/pages/service_desk.scss b/app/assets/stylesheets/pages/service_desk.scss
new file mode 100644
index 00000000000..34ab5eb1b74
--- /dev/null
+++ b/app/assets/stylesheets/pages/service_desk.scss
@@ -0,0 +1,7 @@
+.service-desk-issues {
+  .non-empty-state {
+    text-align: left;
+    padding-bottom: $gl-padding-top;
+    border-bottom: 1px solid $border-color;
+  }
+}
diff --git a/app/assets/stylesheets/pages/settings.scss b/app/assets/stylesheets/pages/settings.scss
index d26c07ce51b..f1df9099d82 100644
--- a/app/assets/stylesheets/pages/settings.scss
+++ b/app/assets/stylesheets/pages/settings.scss
@@ -347,7 +347,7 @@
 
   .btn-clipboard {
     background-color: $white;
-    border: 1px solid $gray-200;
+    border: 1px solid $gray-100;
   }
 
   .deploy-token-help-block {
diff --git a/app/assets/stylesheets/pages/sherlock.scss b/app/assets/stylesheets/pages/sherlock.scss
index 2bf0bedb1f5..55b0b5295af 100644
--- a/app/assets/stylesheets/pages/sherlock.scss
+++ b/app/assets/stylesheets/pages/sherlock.scss
@@ -13,10 +13,8 @@ table .sherlock-code {
 }
 
 .sherlock-line-samples-table {
-  margin-bottom: 0 !important;
-
-  thead tr th,
-  tbody tr td {
+  thead th,
+  tbody td {
     font-size: 13px !important;
     text-align: right;
     padding: 0 10px !important;
diff --git a/app/assets/stylesheets/pages/wiki.scss b/app/assets/stylesheets/pages/wiki.scss
index 640968ff678..8c4bfdf68cc 100644
--- a/app/assets/stylesheets/pages/wiki.scss
+++ b/app/assets/stylesheets/pages/wiki.scss
@@ -147,3 +147,7 @@ ul.wiki-pages-list.content-list {
     }
   }
 }
+
+.empty-state-wiki .text-content {
+  max-width: 490px; // Widen to allow for the Confluence button
+}