Add latest changes from gitlab-org/gitlab@13-10-stable-eev13.10.0-rc40

13 files changed, 305 insertions, 135 deletions

diff --git a/app/assets/stylesheets/page_bundles/boards.scss b/app/assets/stylesheets/page_bundles/boards.scss
index 620b37914d8..fdf9e157e1e 100644
--- a/app/assets/stylesheets/page_bundles/boards.scss
+++ b/app/assets/stylesheets/page_bundles/boards.scss
@@ -30,12 +30,21 @@
   color: var(--gray-500, $gray-500);
 }
 
+[data-page$='epic_boards:index'],
+[data-page$='epic_boards:show'],
 .issue-boards-page {
   .content-wrapper {
     padding-bottom: 0;
   }
 }
 
+[data-page$='epic_boards:index'],
+[data-page$='epic_boards:show'] {
+  .filter-form {
+    display: none;
+  }
+}
+
 .boards-app {
   @include media-breakpoint-up(sm) {
     transition: width $sidebar-transition-duration;
@@ -515,7 +524,7 @@
   }
 }
 
-.board-issue-path.js-show-tooltip {
+.board-item-path.js-show-tooltip {
   cursor: help;
 }
 
diff --git a/app/assets/stylesheets/page_bundles/build.scss b/app/assets/stylesheets/page_bundles/build.scss
index 3962c546b51..34f88f9405a 100644
--- a/app/assets/stylesheets/page_bundles/build.scss
+++ b/app/assets/stylesheets/page_bundles/build.scss
@@ -140,23 +140,6 @@
     width: 289px;
   }
 
-  .block {
-    width: 100%;
-    word-break: break-word;
-
-    &:last-child {
-      border-bottom: 1px solid $border-gray-normal;
-    }
-
-    &.coverage {
-      padding: 0 16px 11px;
-    }
-  }
-
-  .block-last {
-    padding: 16px 0;
-  }
-
   .trigger-variables-btn-container {
     justify-content: space-between;
     align-items: center;
@@ -198,18 +181,6 @@
     margin-left: 2px;
   }
 
-  .retry-link {
-    display: block;
-
-    .btn-inverted-secondary {
-      color: $blue-500;
-
-      &:hover {
-        color: $white;
-      }
-    }
-  }
-
   .stage-item {
     cursor: pointer;
 
diff --git a/app/assets/stylesheets/page_bundles/cycle_analytics.scss b/app/assets/stylesheets/page_bundles/cycle_analytics.scss
index 4a48333cd27..2742c95c6e1 100644
--- a/app/assets/stylesheets/page_bundles/cycle_analytics.scss
+++ b/app/assets/stylesheets/page_bundles/cycle_analytics.scss
@@ -1,6 +1,5 @@
 @import 'mixins_and_variables_and_functions';
 
-#cycle-analytics,
 .cycle-analytics {
   margin: 24px auto 0;
   position: relative;
@@ -316,35 +315,4 @@
       }
     }
   }
-
-  .empty-stage,
-  .no-access-stage {
-    text-align: center;
-    width: 75%;
-    margin: 0 auto;
-    padding-top: 130px;
-    color: var(--gray-500, $gray-500);
-
-    h4 {
-      color: var(--gl-text-color, $gl-text-color);
-    }
-  }
-
-  .empty-stage {
-    .icon-no-data {
-      height: 36px;
-      width: 78px;
-      display: inline-block;
-      margin-bottom: 20px;
-    }
-  }
-
-  .no-access-stage {
-    .icon-lock {
-      height: 36px;
-      width: 78px;
-      display: inline-block;
-      margin-bottom: 20px;
-    }
-  }
 }
diff --git a/app/assets/stylesheets/page_bundles/ide.scss b/app/assets/stylesheets/page_bundles/ide.scss
index 7c4d51ab677..009019a45d9 100644
--- a/app/assets/stylesheets/page_bundles/ide.scss
+++ b/app/assets/stylesheets/page_bundles/ide.scss
@@ -1043,8 +1043,7 @@ $ide-commit-header-height: 48px;
     .input-icon {
       right: auto;
       left: 10px;
-      top: 50%;
-      transform: translateY(-50%);
+      top: 1rem;
     }
   }
 
diff --git a/app/assets/stylesheets/page_bundles/ide_themes/_solarized-light.scss b/app/assets/stylesheets/page_bundles/ide_themes/_solarized-light.scss
index 315a0ae6202..26d55dfe2d0 100644
--- a/app/assets/stylesheets/page_bundles/ide_themes/_solarized-light.scss
+++ b/app/assets/stylesheets/page_bundles/ide_themes/_solarized-light.scss
@@ -2,14 +2,14 @@
 // Please see `app/assets/stylesheets/page_bundles/ide_themes/README.md` for a guide on contributing new themes
 // -------
 .ide.theme-solarized-light {
-  --ide-border-color: #dfd7bf;
+  --ide-border-color: #ded7c1;
   --ide-border-color-alt: #dfd7bf;
   --ide-highlight-accent: #5c4e21;
   --ide-text-color: #616161;
   --ide-text-color-secondary: #526f76;
-  --ide-background: #efe8d3;
-  --ide-background-hover: #ded6be;
-  --ide-highlight-background: #fef6e1;
+  --ide-background: #ddd6c1;
+  --ide-background-hover: #d3cbb7;
+  --ide-highlight-background: #eee8d5;
   --ide-link-color: #955800;
   --ide-footer-background: #efe8d3;
   --ide-empty-state-background: #fef6e1;
diff --git a/app/assets/stylesheets/page_bundles/import.scss b/app/assets/stylesheets/page_bundles/import.scss
index 453b810196b..525481638f3 100644
--- a/app/assets/stylesheets/page_bundles/import.scss
+++ b/app/assets/stylesheets/page_bundles/import.scss
@@ -1,5 +1,12 @@
 @import 'mixins_and_variables_and_functions';
 
+// Fixing double scrollbar issue
+// See https://gitlab.com/gitlab-org/gitlab-ui/-/issues/1156 and
+// https://gitlab.com/gitlab-org/gitlab/-/merge_requests/54837
+.import-entities-namespace-dropdown.show.dropdown .dropdown-menu {
+  max-height: initial;
+}
+
 .import-jobs-to-col {
   width: 39%;
 }
diff --git a/app/assets/stylesheets/page_bundles/jira_connect.scss b/app/assets/stylesheets/page_bundles/jira_connect.scss
index 25401a161da..eb2dd6e578e 100644
--- a/app/assets/stylesheets/page_bundles/jira_connect.scss
+++ b/app/assets/stylesheets/page_bundles/jira_connect.scss
@@ -20,36 +20,23 @@
 @import '@gitlab/ui/src/components/base/tooltip/tooltip';
 
 $atlaskit-border-color: #dfe1e6;
+$header-height: 40px;
 
-.ac-content {
-  margin: 20px;
-
-  .subscription-form {
-    margin-bottom: 20px;
-
-    .field-group-input {
-      display: flex;
-      padding-top: $gl-padding-4;
+.subscription-form {
+  .field-group-input {
+    display: flex;
+    padding-top: $gl-padding-4;
 
-      .ak-button {
-        align-items: center;
-        height: auto;
-        margin-left: $btn-margin-5;
-      }
+    .ak-button {
+      align-items: center;
+      height: auto;
+      margin-left: $btn-margin-5;
     }
   }
 }
 
-$header-height: 40px;
-
 .jira-connect-header {
-  border-bottom: 1px solid $gray-100;
-  display: flex;
-  align-items: center;
-  justify-content: center;
   min-height: $header-height;
-  padding-left: 16px;
-  padding-right: 16px;
   position: fixed;
   top: 0;
   left: 0;
@@ -57,7 +44,6 @@ $header-height: 40px;
 }
 
 .jira-connect-user {
-  font-size: $gl-font-size;
   position: fixed;
   top: 10px;
   right: 20px;
@@ -65,20 +51,17 @@ $header-height: 40px;
 
 .jira-connect-app {
   margin-top: $header-height;
+  height: calc(100% - #{$header-height});
+  max-width: 1000px;
+}
+
+.jira-connect-app-body {
   max-width: 600px;
-  min-height: 95vh;
-  padding-top: 48px;
-  padding-left: 16px;
-  padding-right: 16px;
   margin-left: auto;
   margin-right: auto;
-  text-align: center;
-}
-
-.gl-mt-5 {
-  margin-top: 16px;
 }
 
+// for external_link buttons
 svg {
   fill: currentColor;
 
@@ -115,12 +98,3 @@ svg {
     }
   }
 }
-
-.empty-subscriptions {
-  color: $gray-900;
-}
-
-.browser-limitations-notice {
-  font-size: $gl-font-size;
-  margin-top: 32px;
-}
diff --git a/app/assets/stylesheets/page_bundles/learn_gitlab.scss b/app/assets/stylesheets/page_bundles/learn_gitlab.scss
new file mode 100644
index 00000000000..189aefb330b
--- /dev/null
+++ b/app/assets/stylesheets/page_bundles/learn_gitlab.scss
@@ -0,0 +1,3 @@
+.learn-gitlab-info-card-content {
+  height: 200px;
+}
diff --git a/app/assets/stylesheets/page_bundles/members.scss b/app/assets/stylesheets/page_bundles/members.scss
new file mode 100644
index 00000000000..7b4c74b8253
--- /dev/null
+++ b/app/assets/stylesheets/page_bundles/members.scss
@@ -0,0 +1,255 @@
+@import 'mixins_and_variables_and_functions';
+
+.project-members-title {
+  padding-bottom: 10px;
+  border-bottom: 1px solid $border-color;
+}
+
+.invite-users-form {
+  .btn-success {
+    margin-right: 10px;
+  }
+}
+
+.member {
+  &.is-overridden {
+    .btn-ldap-override {
+      display: none !important;
+    }
+  }
+
+  .controls {
+    @include media-breakpoint-up(sm) {
+      display: flex;
+    }
+
+    .dropdown-menu.dropdown-menu-right {
+      margin-top: -2px;
+    }
+  }
+
+  .form-group {
+    margin-bottom: 0;
+  }
+
+  &.existing-title {
+    @include media-breakpoint-up(sm) {
+      float: left;
+    }
+  }
+}
+
+.member-form-control {
+  @include media-breakpoint-down(xs) {
+    margin-right: 0;
+    width: auto;
+  }
+}
+
+.member-search-btn {
+  position: absolute;
+  right: 4px;
+  top: 0;
+  height: $input-height;
+  padding-left: 10px;
+  padding-right: 10px;
+  color: $gray-darkest;
+  background: transparent;
+  border: 0;
+  outline: 0;
+}
+
+.members-ldap {
+  align-self: center;
+}
+
+.alert-member-ldap {
+  background-color: $orange-50;
+
+  @include media-breakpoint-up(sm) {
+    line-height: 40px;
+  }
+
+  > p {
+    float: left;
+    margin-bottom: 10px;
+    color: $orange-600;
+
+    @include media-breakpoint-up(sm) {
+      padding-left: 55px;
+      margin-bottom: 0;
+    }
+  }
+
+  .controls {
+    width: 100%;
+
+    @include media-breakpoint-up(sm) {
+      width: auto;
+    }
+  }
+}
+
+.btn-ldap-override {
+  width: 100%;
+
+  @include media-breakpoint-up(sm) {
+    margin-left: 10px;
+    width: auto;
+  }
+}
+
+.flex-project-members-panel {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+
+  @include media-breakpoint-down(sm) {
+    display: block;
+
+    .flex-project-title {
+      vertical-align: top;
+      display: inline-block;
+      max-width: 90%;
+    }
+  }
+
+  .flex-project-title {
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+
+  .badge.badge-pill {
+    height: 17px;
+    line-height: 16px;
+    margin-right: 5px;
+    padding-top: 1px;
+    padding-bottom: 1px;
+  }
+
+  .flex-users-form {
+    flex-wrap: nowrap;
+    white-space: nowrap;
+    margin-left: auto;
+  }
+}
+
+.card {
+  .card-header {
+    .badge.badge-pill {
+      margin-top: 0;
+    }
+
+    @include media-breakpoint-down(sm) {
+      .badge.badge-pill {
+        margin-right: 0;
+        margin-left: 0;
+      }
+    }
+  }
+}
+
+.content-list.members-list li {
+  .list-item-name {
+    float: none;
+    display: flex;
+    flex: 1;
+  }
+
+  .user-info {
+    padding-right: 10px;
+  }
+
+  .member {
+    font-weight: $gl-font-weight-bold;
+    overflow-wrap: break-word;
+    word-break: break-all;
+  }
+
+  .form-control {
+    width: inherit;
+  }
+
+  .btn {
+    align-self: flex-start;
+  }
+
+  @include media-breakpoint-down(sm) {
+    .member-access-text {
+      margin: 0 0 $gl-padding-4 ($grid-size * 6);
+    }
+  }
+
+  @include media-breakpoint-down(xs) {
+    display: block;
+
+    .controls > .btn,
+    .controls .member-form-control {
+      margin: 0 0 $gl-padding-8;
+      display: block;
+    }
+
+    .form-control {
+      width: 100%;
+    }
+  }
+}
+
+
+.members-table {
+  @include media-breakpoint-up(lg) {
+    .col-meta {
+      width: px-to-rem(150px);
+    }
+
+    .col-max-role {
+      width: px-to-rem(175px);
+    }
+
+    .col-expiration {
+      width: px-to-rem(200px);
+    }
+
+    .col-actions {
+      width: px-to-rem(65px);
+    }
+  }
+
+  .gl-datepicker-input {
+    width: px-to-rem(165px);
+    max-width: 100%;
+  }
+}
+
+.card-mobile {
+  .content-list.members-list li {
+    display: block;
+
+    .member-controls {
+      float: none;
+      display: block;
+    }
+
+    .dropdown-menu-toggle,
+    .dropdown-menu,
+    .form-control,
+    .list-item-name {
+      width: 100%;
+    }
+
+    .dropdown-menu {
+      margin-top: 0;
+    }
+
+    .member-form-control {
+      margin: 5px 0;
+    }
+
+    .btn {
+      width: 100%;
+      margin-left: 0;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/page_bundles/oncall_schedules.scss b/app/assets/stylesheets/page_bundles/oncall_schedules.scss
index a6668f00147..5eaf91c3017 100644
--- a/app/assets/stylesheets/page_bundles/oncall_schedules.scss
+++ b/app/assets/stylesheets/page_bundles/oncall_schedules.scss
@@ -182,10 +182,3 @@ $column-right-gradient: linear-gradient(to right, $gradient-dark-gray 0%, $gradi
     transform: translateX(-50%);
   }
 }
-
-.gl-token {
-  .gl-avatar-labeled-label {
-    @include gl-text-white;
-    @include gl-font-weight-normal;
-  }
-}
diff --git a/app/assets/stylesheets/page_bundles/pipelines.scss b/app/assets/stylesheets/page_bundles/pipelines.scss
index ae36f7e3ac1..6ef7f912ea9 100644
--- a/app/assets/stylesheets/page_bundles/pipelines.scss
+++ b/app/assets/stylesheets/page_bundles/pipelines.scss
@@ -67,8 +67,7 @@
 // Mini Pipelines
 
 .stage-cell {
-  .mini-pipeline-graph-dropdown-toggle,
-  .mini-pipeline-graph-gl-dropdown-toggle {
+  .mini-pipeline-graph-dropdown-toggle {
     svg {
       height: $ci-action-icon-size;
       width: $ci-action-icon-size;
@@ -138,14 +137,16 @@
   }
 }
 
-// Dropdown button in mini pipeline graph
+// Commit mini pipeline (HAML)
 button.mini-pipeline-graph-dropdown-toggle,
-// As the `mini-pipeline-item` mixin specificity is lower
-// than the toggle of dropdown with 'variant="link"' we add
-// classes ".gl-button.btn-link" to make it more specific.
-// Once FF ci_mini_pipeline_gl_dropdown is removed, the `mini-pipeline-item`
-// itself could increase its specificity to simplify this selector
-button.gl-button.btn-link.mini-pipeline-graph-gl-dropdown-toggle {
+// GlDropdown mini pipeline (Vue)
+//   As the `mini-pipeline-item` mixin specificity is lower
+//   than the toggle of dropdown with 'variant="link"' we add
+//   classes ".gl-button.btn-link" to make it more specific
+//   and avoid having the size overriden
+//
+//   See https://gitlab.com/gitlab-org/gitlab/-/issues/320737
+button.gl-button.btn-link.mini-pipeline-graph-dropdown-toggle {
   @include mini-pipeline-item();
 }
 
diff --git a/app/assets/stylesheets/page_bundles/reports.scss b/app/assets/stylesheets/page_bundles/reports.scss
index 18ca5f9a3a9..ce91988cb8a 100644
--- a/app/assets/stylesheets/page_bundles/reports.scss
+++ b/app/assets/stylesheets/page_bundles/reports.scss
@@ -5,11 +5,6 @@
     max-height: 170px;
     overflow: auto;
   }
-
-  .report-block-list-issue-parent {
-    padding: $gl-padding-top $gl-padding;
-    border-top: 1px solid var(--border-color, $border-color);
-  }
 }
 
 .report-block-container {
diff --git a/app/assets/stylesheets/page_bundles/signup.scss b/app/assets/stylesheets/page_bundles/signup.scss
index a207c10b04f..d6c3a3ff5da 100644
--- a/app/assets/stylesheets/page_bundles/signup.scss
+++ b/app/assets/stylesheets/page_bundles/signup.scss
@@ -32,11 +32,6 @@
     @include media-breakpoint-down(md) {
       width: 100%;
     }
-
-    img {
-      width: $default-icon-size;
-      height: $default-icon-size;
-    }
   }
 
   .decline-page {