Add latest changes from gitlab-org/gitlab@14-8-stable-eev14.8.0-rc42

7 files changed, 54 insertions, 16 deletions

diff --git a/app/assets/stylesheets/highlight/common.scss b/app/assets/stylesheets/highlight/common.scss
index 97dd7edef13..bd327082e20 100644
--- a/app/assets/stylesheets/highlight/common.scss
+++ b/app/assets/stylesheets/highlight/common.scss
@@ -28,8 +28,24 @@
     border-bottom: 1px solid $border;
   }
 
-  a {
+  button {
     color: $link;
+    border: 0;
+    background: transparent;
+
+    &[disabled] {
+      color: desaturate($link, 100%);
+      opacity: 0.5;
+      cursor: default;
+    }
+
+    &:hover:not([disabled]) {
+      text-decoration: underline;
+    }
+
+    &:not(:focus-visible) {
+      outline: 0;
+    }
   }
 }
 
@@ -37,11 +53,11 @@
   transition: border-left 0.1s ease-out;
 
   &.coverage {
-    border-left: 4px solid $coverage;
+    border-left: 2px solid $coverage;
   }
 
   &.no-coverage {
-    border-left: 2px solid $no-coverage;
+    border-left: 4px solid $no-coverage;
   }
 }
 
diff --git a/app/assets/stylesheets/highlight/themes/dark.scss b/app/assets/stylesheets/highlight/themes/dark.scss
index 0b696f1be60..28878280d24 100644
--- a/app/assets/stylesheets/highlight/themes/dark.scss
+++ b/app/assets/stylesheets/highlight/themes/dark.scss
@@ -36,6 +36,7 @@ $dark-cm: #969896;
 $dark-cp: #969896;
 $dark-c1: #969896;
 $dark-cs: #969896;
+$dark-cd: #969896;
 $dark-gd: #c66;
 $dark-gh: #8abeb7;
 $dark-gi: #b5bd68;
@@ -168,8 +169,8 @@ $dark-il: #de935f;
       }
     }
 
-    .diff-grid-left:hover,
-    .diff-grid-right:hover,
+    &:not(.match) .diff-grid-left:hover,
+    &:not(.match) .diff-grid-right:hover,
     &.code-search-line:hover {
       .diff-line-num:not(.empty-cell) {
         @include line-number-hover;
@@ -236,6 +237,7 @@ $dark-il: #de935f;
   .cp { color: $dark-cp; } /* Comment.Preproc */
   .c1 { color: $dark-c1; } /* Comment.Single */
   .cs { color: $dark-cs; } /* Comment.Special */
+  .cd { color: $dark-cd; } /* Comment.Doc */
   .gd { color: $dark-gd; } /* Generic.Deleted */
   .ge { font-style: italic; } /* Generic.Emph */
   .gh { /* Generic.Heading */
diff --git a/app/assets/stylesheets/highlight/themes/monokai.scss b/app/assets/stylesheets/highlight/themes/monokai.scss
index ae72c0b6bf4..6faf1cffdef 100644
--- a/app/assets/stylesheets/highlight/themes/monokai.scss
+++ b/app/assets/stylesheets/highlight/themes/monokai.scss
@@ -38,6 +38,7 @@ $monokai-cm: #75715e;
 $monokai-cp: #75715e;
 $monokai-c1: #75715e;
 $monokai-cs: #75715e;
+$monokai-cd: #75715e;
 $monokai-kc: #66d9ef;
 $monokai-kd: #66d9ef;
 $monokai-kn: #f92672;
@@ -169,8 +170,8 @@ $monokai-gh: #75715e;
       }
     }
 
-    .diff-grid-left:hover,
-    .diff-grid-right:hover,
+    &:not(.match) .diff-grid-left:hover,
+    &:not(.match) .diff-grid-right:hover,
     &.code-search-line:hover {
       .diff-line-num:not(.empty-cell) {
         @include line-number-hover;
@@ -240,6 +241,7 @@ $monokai-gh: #75715e;
   .cp { color: $monokai-cp; } /* Comment.Preproc */
   .c1 { color: $monokai-c1; } /* Comment.Single */
   .cs { color: $monokai-cs; } /* Comment.Special */
+  .cd { color: $monokai-cd; } /* Comment.Doc */
   .ge { font-style: italic; } /* Generic.Emph */
   .gs { font-weight: $gl-font-weight-bold; } /* Generic.Strong */
   .kc { color: $monokai-kc; } /* Keyword.Constant */
diff --git a/app/assets/stylesheets/highlight/themes/none.scss b/app/assets/stylesheets/highlight/themes/none.scss
index 913b289d808..9c28d9463dc 100644
--- a/app/assets/stylesheets/highlight/themes/none.scss
+++ b/app/assets/stylesheets/highlight/themes/none.scss
@@ -66,9 +66,9 @@
       }
     }
 
-    .diff-grid-left:hover,
-    .diff-grid-right:hover,
-    &.code-search-line:hover {
+    &:not(.match) .diff-grid-left:hover,
+    &:not(.match) .diff-grid-right:hover,
+    &:not(.match) &.code-search-line:hover {
       .diff-line-num:not(.empty-cell) {
         @include line-number-hover;
       }
@@ -204,6 +204,7 @@
   .cp { color: $gl-text-color; } /* Comment.Preproc */
   .c1 { color: $gl-text-color; } /* Comment.Single */
   .cs { color: $gl-text-color; } /* Comment.Special */
+  .cd { color: $gl-text-color; } /* Comment.Doc */
   .ge { color: $gl-text-color; } /* Generic.Emph */
   .gr { color: $gl-text-color; } /* Generic.Error */
   .gh { color: $gl-text-color; } /* Generic.Heading */
diff --git a/app/assets/stylesheets/highlight/themes/solarized-dark.scss b/app/assets/stylesheets/highlight/themes/solarized-dark.scss
index eee699ca4c2..c9f889c79fc 100644
--- a/app/assets/stylesheets/highlight/themes/solarized-dark.scss
+++ b/app/assets/stylesheets/highlight/themes/solarized-dark.scss
@@ -35,6 +35,7 @@ $solarized-dark-cm: #586e75;
 $solarized-dark-cp: #859900;
 $solarized-dark-c1: #586e75;
 $solarized-dark-cs: #859900;
+$solarized-dark-cd: #586e75;
 $solarized-dark-gd: #2aa198;
 $solarized-dark-ge: #93a1a1;
 $solarized-dark-gr: #dc322f;
@@ -148,8 +149,8 @@ $solarized-dark-il: #2aa198;
       @include line-coverage-border-color($solarized-dark-coverage, $solarized-dark-no-coverage);
     }
 
-    .diff-grid-left:hover,
-    .diff-grid-right:hover,
+    &:not(.match) .diff-grid-left:hover,
+    &:not(.match) .diff-grid-right:hover,
     &.code-search-line:hover {
       .diff-line-num:not(.empty-cell) {
         @include line-number-hover;
@@ -258,6 +259,7 @@ $solarized-dark-il: #2aa198;
   .cp { color: $solarized-dark-cp; } /* Comment.Preproc */
   .c1 { color: $solarized-dark-c1; } /* Comment.Single */
   .cs { color: $solarized-dark-cs; } /* Comment.Special */
+  .cd { color: $solarized-dark-cd; } /* Comment.Doc */
   .gd { color: $solarized-dark-gd; } /* Generic.Deleted */
   .ge { /* Generic.Emph */
     color: $solarized-dark-ge;
diff --git a/app/assets/stylesheets/highlight/themes/solarized-light.scss b/app/assets/stylesheets/highlight/themes/solarized-light.scss
index 8c5e1f7318b..0108d7e496f 100644
--- a/app/assets/stylesheets/highlight/themes/solarized-light.scss
+++ b/app/assets/stylesheets/highlight/themes/solarized-light.scss
@@ -37,6 +37,7 @@ $solarized-light-cm: #93a1a1;
 $solarized-light-cp: #859900;
 $solarized-light-c1: #93a1a1;
 $solarized-light-cs: #859900;
+$solarized-light-cd: #93a1a1;
 $solarized-light-gd: #2aa198;
 $solarized-light-ge: #586e75;
 $solarized-light-gr: #dc322f;
@@ -168,8 +169,8 @@ $solarized-light-il: #2aa198;
       }
     }
 
-    .diff-grid-left:hover,
-    .diff-grid-right:hover,
+    &:not(.match) .diff-grid-left:hover,
+    &:not(.match) .diff-grid-right:hover,
     &.code-search-line:hover {
       .diff-line-num:not(.empty-cell) {
         @include line-number-hover;
@@ -266,6 +267,7 @@ $solarized-light-il: #2aa198;
   .cp { color: $solarized-light-cp; } /* Comment.Preproc */
   .c1 { color: $solarized-light-c1; } /* Comment.Single */
   .cs { color: $solarized-light-cs; } /* Comment.Special */
+  .cd { color: $solarized-light-cd; } /* Comment.Doc */
   .gd { color: $solarized-light-gd; } /* Generic.Deleted */
   .ge { /* Generic.Emph */
     color: $solarized-light-ge;
diff --git a/app/assets/stylesheets/highlight/white_base.scss b/app/assets/stylesheets/highlight/white_base.scss
index 80052f4a4d5..91d8f4a1ba5 100644
--- a/app/assets/stylesheets/highlight/white_base.scss
+++ b/app/assets/stylesheets/highlight/white_base.scss
@@ -18,6 +18,7 @@ $white-cm: #998;
 $white-cp: #999;
 $white-c1: #998;
 $white-cs: #999;
+$white-cd: #998;
 $white-gd: $black;
 $white-gd-bg: #fdd;
 $white-gd-x: $black;
@@ -118,6 +119,15 @@ pre.code,
 
 .line_expansion {
   @include diff-expansion($gray-light, $border-color, $blue-600);
+
+  &.diff-tr:last-child {
+    border-bottom-right-radius: 4px;
+    border-bottom-left-radius: 4px;
+
+    .diff-td {
+      border-bottom: 0;
+    }
+  }
 }
 
 // Diff line
@@ -128,8 +138,8 @@ pre.code,
     @include match-line;
   }
 
-  .diff-grid-left:hover,
-  .diff-grid-right:hover,
+  &:not(.match) .diff-grid-left:hover,
+  &:not(.match) .diff-grid-right:hover,
   &.code-search-line:hover {
     .diff-line-num:not(.empty-cell):not(.conflict_marker_their):not(.conflict_marker_our) {
       @include line-number-hover;
@@ -281,6 +291,9 @@ span.highlight_word {
   font-weight: $gl-font-weight-bold;
   font-style: italic; }
 
+.cd { color: $white-cd;
+  font-style: italic; }
+
 .gd {
   color: $white-gd;
   background-color: $white-gd-bg;