Add latest changes from gitlab-org/gitlab@master

Author: GitLab Bot

Gemfile

@@ -358,7 +358,7 @@ gem 'gitlab_chronic_duration', '~> 0.12' # rubocop:todo Gemfile/MissingFeatureCa
 
 gem 'rack-proxy', '~> 0.7.7' # rubocop:todo Gemfile/MissingFeatureCategory
 
-gem 'cssbundling-rails', '1.4.0', feature_category: :shared
+gem 'cssbundling-rails', '1.4.1', feature_category: :shared
 gem 'terser', '1.0.2' # rubocop:todo Gemfile/MissingFeatureCategory
 
 gem 'click_house-client', path: 'gems/click_house-client', require: 'click_house/client' # rubocop:todo Gemfile/MissingFeatureCategory

Gemfile.checksum

@@ -97,7 +97,7 @@
 {"name":"creole","version":"0.5.0","platform":"ruby","checksum":"951701e2d80760f156b1cb2a93471ca97c076289becc067a33b745133ed32c03"},
 {"name":"crystalball","version":"0.7.0","platform":"ruby","checksum":"6e729f372a5071daec877adb40c5df4cb25fe21f350635e2a9624373fc151ef2"},
 {"name":"css_parser","version":"1.14.0","platform":"ruby","checksum":"f2ce6148cd505297b07bdbe7a5db4cce5cf530071f9b732b9a23538d6cdc0113"},
-{"name":"cssbundling-rails","version":"1.4.0","platform":"ruby","checksum":"082034653af0ec53d7662e4cd2f518f36167fe7c014dbcf37a941a4a8324f7db"},
+{"name":"cssbundling-rails","version":"1.4.1","platform":"ruby","checksum":"4b21273d627b21890da9155c88c67efc9274373d8b0add09149c262cf56c7ce1"},
 {"name":"cvss-suite","version":"3.0.1","platform":"ruby","checksum":"b5ca9e9e94032a42fd0dc28c1e305378b62c949e35ed7111fc4a1d76f68ad3f9"},
 {"name":"danger","version":"9.4.2","platform":"ruby","checksum":"43e552c6731030235a30fdeafe703d2e2ab9c30917154489cb0ecd9ad3259d80"},
 {"name":"danger-gitlab","version":"8.0.0","platform":"ruby","checksum":"497dd7d0f6513913de651019223d8058cf494df10acbd17de92b175dfa04a3a8"},

Gemfile.lock

@@ -442,7 +442,7 @@ GEM
       git
     css_parser (1.14.0)
       addressable
-    cssbundling-rails (1.4.0)
+    cssbundling-rails (1.4.1)
       railties (>= 6.0.0)
     cvss-suite (3.0.1)
     danger (9.4.2)
@@ -1980,7 +1980,7 @@ DEPENDENCIES
   coverband (= 6.1.2)
   creole (~> 0.5.0)
   crystalball (~> 0.7.0)
-  cssbundling-rails (= 1.4.0)
+  cssbundling-rails (= 1.4.1)
   csv_builder!
   cvss-suite (~> 3.0.1)
   database_cleaner-active_record (~> 2.2.0)

app/assets/javascripts/blob/components/blob_header.vue

@@ -95,6 +95,11 @@ export default {
       required: false,
       default: false,
     },
+    showBlobSize: {
+      type: Boolean,
+      required: false,
+      default: true,
+    },
   },
   data() {
     return {
@@ -137,7 +142,7 @@ export default {
   <div class="js-file-title file-title-flex-parent">
     <div class="gl-display-flex">
       <table-of-contents class="gl-pr-2" />
-      <blob-filepath :blob="blob" :show-path="showPath">
+      <blob-filepath :blob="blob" :show-path="showPath" :show-blob-size="showBlobSize">
         <template #filepath-prepend>
           <slot name="prepend"></slot>
         </template>

app/assets/javascripts/blob/components/blob_header_filepath.vue

@@ -20,6 +20,11 @@ export default {
       required: false,
       default: true,
     },
+    showBlobSize: {
+      type: Boolean,
+      required: false,
+      default: true,
+    },
   },
   computed: {
     blobSize() {
@@ -62,7 +67,7 @@ export default {
       css-class="gl-mr-2"
     />
 
-    <small class="gl-mr-3">{{ blobSize }}</small>
+    <small v-if="showBlobSize" class="gl-mr-3">{{ blobSize }}</small>
 
     <gl-badge v-if="showLfsBadge">{{ __('LFS') }}</gl-badge>
   </div>

app/assets/javascripts/ci/ci_variable_list/components/ci_variable_table.vue

@@ -27,7 +27,6 @@ export default {
     {
       key: 'key',
       label: s__('CiVariables|Key'),
-      tdClass: 'text-plain',
       sortable: true,
       thClass: 'gl-w-2/5',
     },
@@ -49,7 +48,6 @@ export default {
     {
       key: 'key',
       label: s__('CiVariables|Key'),
-      tdClass: 'text-plain',
     },
     {
       key: 'environmentScope',

app/assets/javascripts/design_management/components/list/item.vue

@@ -129,7 +129,7 @@ export default {
       params: { id: filename },
       query: $route.query,
     }"
-    class="card gl-cursor-pointer text-plain js-design-list-item design-list-item gl-mb-0"
+    class="card gl-cursor-pointer gl-text-default hover:gl-text-default js-design-list-item design-list-item gl-mb-0"
   >
     <div
       class="card-body gl-p-0 gl-display-flex gl-align-items-center gl-justify-content-center gl-overflow-hidden gl-relative gl-rounded-top-base"

app/assets/javascripts/diffs/components/diff_expansion_cell.vue

@@ -4,7 +4,7 @@ import { GlTooltipDirective, GlIcon, GlLoadingIcon } from '@gitlab/ui';
 import { mapActions } from 'vuex';
 import SafeHtml from '~/vue_shared/directives/safe_html';
 import { createAlert } from '~/alert';
-import { s__, sprintf } from '~/locale';
+import { __, s__, sprintf } from '~/locale';
 import { UNFOLD_COUNT, INLINE_DIFF_LINES_KEY } from '../constants';
 import * as utils from '../store/utils';
 
@@ -16,6 +16,7 @@ export default {
   i18n: {
     showMore: sprintf(s__('Diffs|Show %{unfoldCount} lines'), { unfoldCount: UNFOLD_COUNT }),
     showAll: s__('Diffs|Show all unchanged lines'),
+    expandAllLines: __('Expand all lines'),
   },
   components: {
     GlIcon,
@@ -237,8 +238,8 @@ export default {
       </button>
       <button
         v-if="lineCountBetween !== -1 && lineCountBetween < 20"
-        :title="s__('Diffs|Expand all lines')"
-        :aria-label="s__('Diffs|Expand all lines')"
+        :title="$options.i18n.expandAllLines"
+        :aria-label="$options.i18n.expandAllLines"
         :disabled="loading.all"
         type="button"
         class="js-unfold-all gl-rounded-0 gl-border-0 diff-line-expand-button"

app/assets/javascripts/environments/components/deploy_board.vue

@@ -145,7 +145,7 @@ export default {
         <div class="deploy-board-information gl-w-full">
           <section class="deploy-board-status">
             <span v-gl-tooltip :title="instanceIsCompletedText">
-              <span ref="percentage" class="gl-text-center text-plain gl-font-lg"
+              <span ref="percentage" class="gl-text-center gl-text-default gl-text-lg"
                 >{{ deployBoardData.completion }}%</span
               >
               <span class="text text-center text-secondary">{{ __('Complete') }}</span>

app/assets/javascripts/vue_shared/components/markdown/header.vue

@@ -499,7 +499,7 @@ export default {
             dropzone_input.js.
           -->
           <toolbar-button
-            v-if="!previewMarkdown && !restrictedToolBarItems.includes('attach-file')"
+            v-show="!previewMarkdown && !restrictedToolBarItems.includes('attach-file')"
             data-testid="button-attach-file"
             data-button-type="attach-file"
             :button-title="__('Attach a file or image')"

app/assets/javascripts/vue_shared/components/source_viewer/workers/highlight_utils.js

@@ -2,7 +2,7 @@ import { highlightPlugins } from '~/highlight_js/plugins';
 import { highlightContent } from '~/highlight_js';
 import { LINES_PER_CHUNK, NEWLINE, ROUGE_TO_HLJS_LANGUAGE_MAP } from '../constants';
 
-const splitByLineBreaks = (content = '') => content.split(/\r?\n/);
+export const splitByLineBreaks = (content = '') => content.split(/\r?\n/);
 
 const createChunk = (language, rawChunkLines, highlightedChunkLines = [], startingFrom = 0) => ({
   highlightedContent: highlightedChunkLines.join(NEWLINE),

app/assets/javascripts/work_items/components/design_management/design_item.vue

@@ -133,7 +133,7 @@ export default {
       params: { iid: workItemIid, id: filename },
       query: $route.query,
     }"
-    class="card gl-cursor-pointer text-plain js-design-list-item design-list-item gl-mb-0"
+    class="card gl-cursor-pointer gl-text-default hover:gl-text-default js-design-list-item design-list-item gl-mb-0"
   >
     <div
       class="card-body gl-p-0 gl-flex gl-items-center gl-justify-content-center gl-overflow-hidden gl-relative gl-rounded-top-base"

app/assets/stylesheets/framework/common.scss

@@ -73,11 +73,6 @@
 .cgreen { color: $green-600; }
 .cdark { color: $gray-800; }
 
-.text-plain,
-.text-plain:hover {
-  color: $gl-text-color;
-}
-
 .text-secondary {
   color: $gl-text-color-secondary;
 }

app/assets/stylesheets/framework/highlight.scss

@@ -1,3 +1,5 @@
+@import '../highlight/common';
+
 .file-content.code {
   border: 0;
   box-shadow: none;
@@ -36,6 +38,23 @@
         &:empty::before, span:empty::before {
           content: '\200b';
         }
+
+        .selected-inline-item-mark {
+          background: #2575c6 !important;
+        }
+
+        .inline-item-mark {
+          padding: 0 5px;
+          margin-right: 5px;
+          border-radius: 4px;
+          background: $gray-500;
+          color: $white;
+        }
+
+        .inline-section-marker {
+          padding-right: 2px;
+          border-radius: 4px;
+        }
       }
     }
   }
@@ -78,11 +97,16 @@
   }
 
   pre .line,
+  pre .plain-lines,
   .line-numbers a {
     font-size: 0.8125rem;
     line-height: 1.1875rem;
     min-height: 1.1875rem;
   }
+
+  .mark-multiple-line-expand-button {
+    @include diff-expansion($gray-100, $gray-400, $gray-100, $gray-400);
+  }
 }
 
 // Vertically aligns <table> line numbers (eg. blame view)

app/assets/stylesheets/highlight/_white_base.scss

@@ -12,6 +12,7 @@ $white-hll-bg: #f8f8f8;
 $white-expanded-border: #e0e0e0;
 $white-expanded-bg: #f7f7f7;
 $white-c: #998;
+$white-code-mark: #d3e3f4;
 $white-err: #a61717;
 $white-err-bg: #e3d2d2;
 $white-cm: #998;
@@ -277,6 +278,27 @@ $white-gc-bg: #eaf2f5;
     background-color: $white-pre-hll-bg !important;
   }
 
+  // mark lines via mark_multiple_lines
+  pre.white code {
+    .selected-inline-section-marker {
+      background: $white-code-mark !important;
+    }
+
+    .inline-section-marker {
+      background: $gray-100;
+    }
+  }
+
+  .file-holder div.code.white {
+    .selected-inline-number-mark {
+      color: $gray-600;
+    }
+
+    .unselected-inline-number-mark {
+      color: $gray-200;
+    }
+  }
+
   // Search result highlight
   span.highlight_word {
     background-color: $white-highlight !important;

app/assets/stylesheets/highlight/themes/dark.scss

@@ -12,6 +12,7 @@ $dark-old-bg: rgba(255, 51, 51, 0.2);
 $dark-old-idiff: rgba(255, 51, 51, 0.25);
 $dark-border: #808080;
 $dark-code-border: #666;
+$dark-code-mark: #1d3043;
 $dark-main-bg: #1d1f21;
 $dark-main-color: #1d1f21;
 $dark-line-color: #c5c8c6;
@@ -281,6 +282,28 @@ $dark-il: #de935f;
     background-color: $dark-pre-hll-bg !important;
   }
 
+  // mark lines via mark_multiple_lines
+  pre.dark code {
+    .selected-inline-section-marker {
+      background: $dark-code-mark !important;
+    }
+
+    .inline-section-marker {
+      background: $dark-pre-hll-bg;
+    }
+  }
+
+  .file-holder div.code.dark {
+    .selected-inline-number-mark {
+      color: $gray-200;
+    }
+
+    .unselected-inline-number-mark {
+      color: $gray-600;
+    }
+  }
+
+
   // Search result highlight
   span.highlight_word {
     background-color: $dark-highlight-bg !important;

app/assets/stylesheets/highlight/themes/monokai.scss

@@ -8,6 +8,7 @@
 */
 $monokai-bg: #272822;
 $monokai-border: #555;
+$monokai-code-mark: #113953;
 $monokai-text-color: #f8f8f2;
 $monokai-line-num-color: rgba(255, 255, 255, 0.3);
 $monokai-line-num-color-new: #707565;
@@ -272,6 +273,29 @@ $monokai-gh: #75715e;
     background-color: $monokai-hll !important;
   }
 
+  // mark lines via mark_multiple_lines
+  pre.monokai code {
+    .selected-inline-section-marker {
+      background: $monokai-code-mark !important;
+    }
+
+    .inline-section-marker {
+      background: $monokai-hll;
+    }
+  }
+
+  .file-holder div.code.monokai {
+    .selected-inline-number-mark {
+      color: $gray-200;
+    }
+
+    .unselected-inline-number-mark {
+      color: $gray-600;
+    }
+  }
+
+
+
   // Search result highlight
   span.highlight_word {
     background-color: $monokai-highlight-bg !important;

app/assets/stylesheets/highlight/themes/none.scss

@@ -4,6 +4,8 @@
 
 @import '../common';
 
+$none-code-mark: #d3e3f4;
+
 @mixin match-line {
   color: $t-gray-a-24;
   background-color: $gray-50;
@@ -189,6 +191,27 @@
     background-color: $orange-50;
   }
 
+  // mark lines via mark_multiple_lines
+  pre.none code {
+    .selected-inline-section-marker {
+      background: $none-code-mark !important;
+    }
+
+    .inline-section-marker {
+      background: $gray-100;
+    }
+  }
+
+  .file-holder div.code.none {
+    .selected-inline-number-mark {
+      color: $gray-600;
+    }
+
+    .unselected-inline-number-mark {
+      color: $gray-200;
+    }
+  }
+
   .gd {
     color: $gl-text-color;
     background-color: $white;