Add latest changes from gitlab-org/gitlab@14-3-stable-eev14.3.0-rc42

6 files changed, 21 insertions, 63 deletions

diff --git a/app/assets/stylesheets/framework/blocks.scss b/app/assets/stylesheets/framework/blocks.scss
index 264373451d5..a0682eabf01 100644
--- a/app/assets/stylesheets/framework/blocks.scss
+++ b/app/assets/stylesheets/framework/blocks.scss
@@ -154,12 +154,6 @@
     }
   }
 
-  .cover-desc {
-    &.username:last-child {
-      padding-bottom: $gl-padding;
-    }
-  }
-
   .cover-controls {
     @include media-breakpoint-up(sm) {
       position: absolute;
@@ -343,8 +337,6 @@
 }
 
 .code-block {
-  background: $black;
-  color: $gray-darkest;
   white-space: pre;
   overflow-x: auto;
   font-size: 12px;
diff --git a/app/assets/stylesheets/framework/diffs.scss b/app/assets/stylesheets/framework/diffs.scss
index 61a20c7a8fd..568182ad796 100644
--- a/app/assets/stylesheets/framework/diffs.scss
+++ b/app/assets/stylesheets/framework/diffs.scss
@@ -613,7 +613,7 @@ table.code {
     grid-template-columns: 1fr 1fr;
   }
 
-  &.inline {
+  &.inline-diff-view {
     .diff-grid-comments {
       display: grid;
       grid-template-columns: 1fr;
@@ -682,26 +682,6 @@ table.code {
   max-height: 50vh;
 }
 
-.diff-stats-summary-toggler {
-  padding: 0;
-  background-color: transparent;
-  border: 0;
-  color: $blue-600;
-  font-weight: $gl-font-weight-bold;
-
-  &:hover,
-  &:focus {
-    outline: none;
-    color: $blue-800;
-  }
-
-  .caret-icon {
-    position: relative;
-    top: 2px;
-    left: -1px;
-  }
-}
-
 // Mobile
 @media (max-width: 480px) {
   .diff-title {
@@ -853,21 +833,14 @@ table.code {
 
 .diff-files-changed {
   .inline-parallel-buttons {
-    position: relative;
+    @include gl-relative;
     z-index: 1;
   }
 
-  .commit-stat-summary {
-    @include media-breakpoint-up(sm) {
-      background-color: $white;
-    }
-  }
-
   @include media-breakpoint-up(sm) {
-    position: -webkit-sticky;
-    position: sticky;
+    @include gl-sticky;
     top: $header-height + $mr-tabs-height;
-    background-color: $white;
+    @include gl-bg-white;
     z-index: 200;
 
     .with-performance-bar & {
@@ -875,14 +848,13 @@ table.code {
     }
 
     &.is-stuck {
-      padding-top: 0;
-      padding-bottom: 0;
+      @include gl-py-0;
       border-top: 1px solid $white-dark;
       border-bottom: 1px solid $white-dark;
 
       .diff-stats-additions-deletions-expanded,
       .inline-parallel-buttons {
-        display: none !important;
+        @include gl-display-none;
       }
     }
   }
@@ -890,12 +862,13 @@ table.code {
   @include media-breakpoint-up(lg) {
     &.is-stuck {
       .diff-stats-additions-deletions-collapsed {
-        display: block !important;
+        @include gl-display-block;
       }
     }
   }
 }
 
+
 .diff-file-changes {
   max-width: 560px;
   width: 100%;
diff --git a/app/assets/stylesheets/framework/filters.scss b/app/assets/stylesheets/framework/filters.scss
index f76101d92b1..5dd71cec8d1 100644
--- a/app/assets/stylesheets/framework/filters.scss
+++ b/app/assets/stylesheets/framework/filters.scss
@@ -386,15 +386,6 @@
       }
     }
   }
-
-  .boards-add-list > .btn {
-    text-align: left;
-
-    > svg {
-      position: absolute;
-      right: 6px;
-    }
-  }
 }
 
 .droplab-dropdown .dropdown-menu .filter-dropdown-item {
diff --git a/app/assets/stylesheets/framework/icons.scss b/app/assets/stylesheets/framework/icons.scss
index 222e10f51ad..0aeb7208c59 100644
--- a/app/assets/stylesheets/framework/icons.scss
+++ b/app/assets/stylesheets/framework/icons.scss
@@ -36,6 +36,7 @@
   }
 }
 
+.ci-status-icon-notification,
 .ci-status-icon-preparing,
 .ci-status-icon-created,
 .ci-status-icon-skipped,
diff --git a/app/assets/stylesheets/framework/typography.scss b/app/assets/stylesheets/framework/typography.scss
index 603b05efe10..aeb3bb2286f 100644
--- a/app/assets/stylesheets/framework/typography.scss
+++ b/app/assets/stylesheets/framework/typography.scss
@@ -41,6 +41,12 @@
     }
   }
 
+  .media-container {
+    display: inline-flex;
+    flex-direction: column;
+    margin-bottom: $gl-spacing-scale-2;
+  }
+
   img:not(.emoji) {
     margin: 0 0 8px;
   }
@@ -549,17 +555,12 @@
       margin: 0;
       font-size: $gl-font-size-small;
     }
+  }
 
-    ul.dropdown-menu {
-      margin-top: 4px;
-      margin-bottom: 24px;
-      padding: 8px 0;
-
-      li {
-        margin: 0;
-        padding: 0 1px;
-      }
-    }
+  .gl-new-dropdown-item {
+    margin: 0;
+    padding: 0;
+    line-height: 1rem;
   }
 
   /* AsciiDoc(tor) built-in alignment roles */
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 726f8e28efe..099dfa28b9f 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -505,7 +505,7 @@ $line-removed-dark: #fac5cd !default;
  * would hide other layers (selected text, matching brackets).
  *
  * When the transparent colors get layered on white background, they create their
- * full opacity counterparts (computed with https://stackoverflow.com/a/12228643/606571):
+ * full opacity counterparts:
  *
  *  - white + $line-added-transparent = $line-added
  *  - white + $line-added-transparent + $line-added-dark-transparent = $line-added-dark