Add latest changes from gitlab-org/gitlab@14-0-stable-eev14.0.0-rc42

6 files changed, 230 insertions, 26 deletions

diff --git a/app/assets/stylesheets/page_bundles/cycle_analytics.scss b/app/assets/stylesheets/page_bundles/cycle_analytics.scss
index 2742c95c6e1..2248d95ae24 100644
--- a/app/assets/stylesheets/page_bundles/cycle_analytics.scss
+++ b/app/assets/stylesheets/page_bundles/cycle_analytics.scss
@@ -30,32 +30,12 @@
 
   .col-headers {
     ul {
-      @include clearfix;
       margin: 0;
       padding: 0;
     }
 
     li {
-      display: inline-block;
-      float: left;
       line-height: 50px;
-      width: 20%;
-    }
-
-    .stage-header {
-      width: 20.5%;
-    }
-
-    .median-header {
-      width: 19.5%;
-    }
-
-    .event-header {
-      width: 45%;
-    }
-
-    .total-time-header {
-      width: 15%;
     }
   }
 
@@ -120,7 +100,6 @@
     }
 
     li {
-      @include clearfix;
       list-style-type: none;
     }
 
@@ -169,7 +148,6 @@
 
     .events-description {
       line-height: 65px;
-      padding: 0 $gl-padding;
     }
 
     .events-info {
@@ -178,7 +156,6 @@
   }
 
   .stage-events {
-    width: 60%;
     min-height: 467px;
   }
 
@@ -190,8 +167,8 @@
   .stage-event-item {
     @include clearfix;
     list-style-type: none;
-    padding: 0 0 $gl-padding;
-    margin: 0 $gl-padding $gl-padding;
+    padding-bottom: $gl-padding;
+    margin-bottom: $gl-padding;
     border-bottom: 1px solid var(--gray-50, $gray-50);
 
     &:last-child {
diff --git a/app/assets/stylesheets/page_bundles/escalation_policies.scss b/app/assets/stylesheets/page_bundles/escalation_policies.scss
new file mode 100644
index 00000000000..f188dde1183
--- /dev/null
+++ b/app/assets/stylesheets/page_bundles/escalation_policies.scss
@@ -0,0 +1,37 @@
+@import 'mixins_and_variables_and_functions';
+
+.escalation-policy-modal {
+  width: 640px;
+}
+
+.rule-control {
+  width: 240px;
+}
+
+.rule-close-icon {
+  right: 1rem;
+}
+
+$stroke-size: 1px;
+
+.right-arrow {
+  @include gl-relative;
+  @include gl-mx-5;
+  @include gl-display-inline-block;
+  @include gl-vertical-align-middle;
+  height: $stroke-size;
+  background-color: var(--gray-900, $gray-900);
+  min-width: $gl-spacing-scale-7;
+
+  &-head {
+    @include gl-absolute;
+    top: -2*$stroke-size;
+    left: calc(100% - #{5*$stroke-size});
+    @include gl-display-inline-block;
+    @include gl-p-1;
+    @include gl-border-solid;
+    border-width: 0 $stroke-size $stroke-size 0;
+    border-color: var(--gray-900, $gray-900);
+    transform: rotate(-45deg);
+  }
+}
diff --git a/app/assets/stylesheets/page_bundles/group.scss b/app/assets/stylesheets/page_bundles/group.scss
new file mode 100644
index 00000000000..38dd07f617c
--- /dev/null
+++ b/app/assets/stylesheets/page_bundles/group.scss
@@ -0,0 +1,107 @@
+@import 'page_bundles/mixins_and_variables_and_functions';
+
+.group-home-panel {
+  margin-top: $gl-padding;
+  margin-bottom: $gl-padding;
+
+  .home-panel-avatar {
+    width: $home-panel-title-row-height;
+    height: $home-panel-title-row-height;
+    flex-shrink: 0;
+    flex-basis: $home-panel-title-row-height;
+  }
+
+  .home-panel-title {
+    font-size: 20px;
+    line-height: $gl-line-height-24;
+    font-weight: bold;
+
+    .icon {
+      vertical-align: -1px;
+    }
+
+    .home-panel-topic-list {
+      font-size: $gl-font-size;
+      font-weight: $gl-font-weight-normal;
+
+      .icon {
+        position: relative;
+        top: 3px;
+        margin-right: $gl-padding-4;
+      }
+    }
+  }
+
+  .home-panel-title-row {
+    @include media-breakpoint-down(sm) {
+      .home-panel-avatar {
+        width: $home-panel-avatar-mobile-size;
+        height: $home-panel-avatar-mobile-size;
+        flex-basis: $home-panel-avatar-mobile-size;
+
+        .avatar {
+          font-size: 20px;
+          line-height: 46px;
+        }
+      }
+
+      .home-panel-title {
+        margin-top: 4px;
+        margin-bottom: 2px;
+        font-size: $gl-font-size;
+        line-height: $gl-font-size-large;
+      }
+
+      .home-panel-topic-list,
+      .home-panel-metadata {
+        font-size: $gl-font-size-small;
+      }
+    }
+  }
+
+  .home-panel-metadata {
+    font-weight: normal;
+    font-size: 14px;
+    line-height: $gl-btn-line-height;
+  }
+
+  .home-panel-description {
+    @include media-breakpoint-up(md) {
+      font-size: $gl-font-size-large;
+    }
+  }
+}
+
+.group-nav-container .nav-controls {
+  .group-filter-form {
+    flex: 1 1 auto;
+    margin-right: $gl-padding-8;
+  }
+
+  .dropdown-menu-right {
+    margin-top: 0;
+  }
+
+  @include media-breakpoint-down(sm) {
+    .dropdown,
+    .dropdown .dropdown-toggle,
+    .btn-success {
+      display: block;
+    }
+
+    .group-filter-form,
+    .dropdown {
+      margin-bottom: 10px;
+      margin-right: 0;
+    }
+
+    &,
+    .group-filter-form,
+    .group-filter-form-field,
+    .dropdown,
+    .dropdown .dropdown-toggle,
+    .btn-success {
+      width: 100%;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/page_bundles/pipelines.scss b/app/assets/stylesheets/page_bundles/pipelines.scss
index ace91d197b6..1081dd8f6d8 100644
--- a/app/assets/stylesheets/page_bundles/pipelines.scss
+++ b/app/assets/stylesheets/page_bundles/pipelines.scss
@@ -116,7 +116,7 @@
         position: absolute;
         right: -7px;
         top: 11px;
-        border-bottom: 2px solid $border-color;
+        border-bottom: 2px solid var(--border-color, $border-color);
       }
     }
 
diff --git a/app/assets/stylesheets/page_bundles/project.scss b/app/assets/stylesheets/page_bundles/project.scss
new file mode 100644
index 00000000000..7f044f081d4
--- /dev/null
+++ b/app/assets/stylesheets/page_bundles/project.scss
@@ -0,0 +1,82 @@
+@import 'page_bundles/mixins_and_variables_and_functions';
+
+.project-home-panel {
+  .home-panel-avatar {
+    flex-basis: $home-panel-title-row-height;
+  }
+
+  .home-panel-title {
+    .icon {
+      vertical-align: -1px;
+    }
+
+    .home-panel-topic-list {
+      .icon {
+        top: 3px;
+      }
+    }
+  }
+
+  .home-panel-title-row {
+    @include media-breakpoint-down(sm) {
+      .home-panel-avatar {
+        width: $home-panel-avatar-mobile-size;
+        height: $home-panel-avatar-mobile-size;
+        flex-basis: $home-panel-avatar-mobile-size;
+
+        .avatar {
+          font-size: 20px;
+          line-height: 46px;
+        }
+      }
+
+      .home-panel-title {
+        margin-top: 4px;
+        margin-bottom: 2px;
+        font-size: $gl-font-size;
+        line-height: $gl-font-size-large;
+      }
+    }
+  }
+
+  .home-panel-description {
+    @include media-breakpoint-up(md) {
+      font-size: $gl-font-size-large;
+    }
+  }
+}
+
+.project-repo-buttons {
+  .btn {
+    svg {
+      fill: $gray-500;
+    }
+  }
+
+  .download-button {
+    @include media-breakpoint-down(md) {
+      margin-left: 0;
+    }
+  }
+
+  .project-clone-holder {
+    display: inline-block;
+    margin: $gl-padding 0 0;
+
+    input {
+      height: $input-height;
+    }
+  }
+
+  .clone-options-dropdown {
+    min-width: 240px;
+
+    .dropdown-menu-inner-content {
+      min-width: 320px;
+    }
+  }
+
+  .mobile-git-clone {
+    margin-top: $gl-padding-8;
+  }
+}
diff --git a/app/assets/stylesheets/page_bundles/wiki.scss b/app/assets/stylesheets/page_bundles/wiki.scss
index 9f0fa137910..5525ad66e42 100644
--- a/app/assets/stylesheets/page_bundles/wiki.scss
+++ b/app/assets/stylesheets/page_bundles/wiki.scss
@@ -1,4 +1,5 @@
 @import 'mixins_and_variables_and_functions';
+@import 'highlight.js/scss/a11y-light';
 
 .title .edit-wiki-header {
   width: 780px;