Add latest changes from gitlab-org/gitlab@master

.rubocop_todo.yml

@@ -1325,14 +1325,6 @@ Rails/SaveBang:
     - 'spec/features/issues/user_filters_issues_spec.rb'
     - 'spec/features/issues/user_sees_live_update_spec.rb'
     - 'spec/features/issues/user_sorts_issues_spec.rb'
-    - 'spec/features/merge_request/user_merges_when_pipeline_succeeds_spec.rb'
-    - 'spec/features/merge_request/user_posts_diff_notes_spec.rb'
-    - 'spec/features/merge_request/user_resolves_diff_notes_and_discussions_resolve_spec.rb'
-    - 'spec/features/merge_request/user_sees_cherry_pick_modal_spec.rb'
-    - 'spec/features/merge_request/user_sees_discussions_spec.rb'
-    - 'spec/features/merge_request/user_sees_merge_widget_spec.rb'
-    - 'spec/features/merge_request/user_sees_versions_spec.rb'
-    - 'spec/features/merge_requests/user_mass_updates_spec.rb'
     - 'spec/features/profiles/emails_spec.rb'
     - 'spec/features/profiles/password_spec.rb'
     - 'spec/features/profiles/personal_access_tokens_spec.rb'

app/assets/javascripts/batch_comments/components/draft_note.vue

 <script>
 import { mapActions, mapGetters, mapState } from 'vuex';
 import NoteableNote from '~/notes/components/noteable_note.vue';
-import LoadingButton from '~/vue_shared/components/loading_button.vue';
+import { GlButton } from '@gitlab/ui';
 import PublishButton from './publish_button.vue';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 
@@ -9,7 +9,7 @@ export default {
   components: {
     NoteableNote,
     PublishButton,
-    LoadingButton,
+    GlButton,
   },
   mixins: [glFeatureFlagsMixin()],
   props: {
@@ -115,18 +115,15 @@ export default {
       ></div>
 
       <p class="draft-note-actions d-flex">
-        <publish-button
-          :show-count="true"
-          :should-publish="false"
-          class="btn btn-success btn-inverted gl-mr-3"
-        />
-        <loading-button
+        <publish-button :show-count="true" :should-publish="false" category="secondary" />
+        <gl-button
           ref="publishNowButton"
           :loading="isPublishingDraft(draft.id) || isPublishing"
-          :label="__('Add comment now')"
-          container-class="btn btn-inverted"
+          class="gl-ml-3"
           @click="publishNow"
-        />
+        >
+          {{ __('Add comment now') }}
+        </gl-button>
       </p>
     </template>
   </article>

app/assets/javascripts/batch_comments/components/drafts_count.vue

 <script>
 import { mapGetters } from 'vuex';
+import { GlBadge } from '@gitlab/ui';
 
 export default {
+  components: {
+    GlBadge,
+  },
   computed: {
     ...mapGetters('batchComments', ['draftsCount']),
   },
 };
 </script>
 <template>
-  <span class="drafts-count-component">
-    <span class="drafts-count-number">{{ draftsCount }}</span>
+  <gl-badge size="sm" variant="success">
+    {{ draftsCount }}
     <span class="sr-only"> {{ n__('draft', 'drafts', draftsCount) }} </span>
-  </span>
+  </gl-badge>
 </template>

app/assets/javascripts/batch_comments/components/publish_button.vue

 <script>
 import { mapActions, mapState } from 'vuex';
 import { __ } from '~/locale';
-import LoadingButton from '~/vue_shared/components/loading_button.vue';
+import { GlButton } from '@gitlab/ui';
 import DraftsCount from './drafts_count.vue';
 
 export default {
   components: {
-    LoadingButton,
+    GlButton,
     DraftsCount,
   },
   props: {
@@ -20,6 +20,16 @@ export default {
       required: false,
       default: __('Finish review'),
     },
+    category: {
+      type: String,
+      required: false,
+      default: 'primary',
+    },
+    variant: {
+      type: String,
+      required: false,
+      default: 'success',
+    },
     shouldPublish: {
       type: Boolean,
       required: true,
@@ -42,14 +52,14 @@ export default {
 </script>
 
 <template>
-  <loading-button
+  <gl-button
     :loading="isPublishing"
-    container-class="btn btn-success js-publish-draft-button qa-submit-review"
+    class="js-publish-draft-button qa-submit-review"
+    :category="category"
+    :variant="variant"
     @click="onClick"
   >
-    <span>
-      {{ label }}
-      <drafts-count v-if="showCount" />
-    </span>
-  </loading-button>
+    {{ label }}
+    <drafts-count v-if="showCount" />
+  </gl-button>
 </template>

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

 <script>
-import { GlTooltipDirective } from '@gitlab/ui';
-import Icon from '~/vue_shared/components/icon.vue';
+import { GlTooltipDirective, GlButton } from '@gitlab/ui';
 import { s__ } from '~/locale';
 
 /**
@@ -8,7 +7,7 @@ import { s__ } from '~/locale';
  */
 export default {
   components: {
-    Icon,
+    GlButton,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
@@ -27,15 +26,14 @@ export default {
 };
 </script>
 <template>
-  <a
+  <gl-button
     v-gl-tooltip
     :title="title"
     :aria-label="title"
     :href="externalUrl"
-    class="btn external-url"
+    class="external-url"
     target="_blank"
+    icon="external-link"
     rel="noopener noreferrer nofollow"
-  >
-    <icon name="external-link" />
-  </a>
+  />
 </template>

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

@@ -5,16 +5,13 @@
  */
 
 import $ from 'jquery';
-import { GlTooltipDirective } from '@gitlab/ui';
-import Icon from '~/vue_shared/components/icon.vue';
+import { GlTooltipDirective, GlButton } from '@gitlab/ui';
 import { s__ } from '~/locale';
 import eventHub from '../event_hub';
-import LoadingButton from '../../vue_shared/components/loading_button.vue';
 
 export default {
   components: {
-    Icon,
-    LoadingButton,
+    GlButton,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
@@ -55,16 +52,16 @@ export default {
 };
 </script>
 <template>
-  <loading-button
+  <gl-button
     v-gl-tooltip
     :loading="isLoading"
     :title="title"
     :aria-label="title"
-    container-class="btn btn-danger d-none d-sm-none d-md-block"
+    icon="stop"
+    category="primary"
+    variant="danger"
     data-toggle="modal"
     data-target="#stop-environment-modal"
     @click="onClick"
-  >
-    <icon name="stop" />
-  </loading-button>
+  />
 </template>

app/assets/javascripts/filtered_search/components/recent_searches_dropdown_content.vue

@@ -20,8 +20,18 @@ export default {
     },
   },
   computed: {
+    /**
+     * Both Epic and Roadmap pages share same recents store
+     * and with https://gitlab.com/gitlab-org/gitlab/-/merge_requests/36421
+     * Roadmap started using `GlFilteredSearch` which is not compatible
+     * with string tokens stored in recents, so this is a temporary
+     * fix by ignoring non-string recents while in Epic page.
+     */
+    compatibleItems() {
+      return this.items.filter(item => typeof item === 'string');
+    },
     processedItems() {
-      return this.items.map(item => {
+      return this.compatibleItems.map(item => {
         const { tokens, searchToken } = FilteredSearchTokenizer.processTokens(
           item,
           this.allowedKeys,
@@ -41,7 +51,7 @@ export default {
       });
     },
     hasItems() {
-      return this.items.length > 0;
+      return this.compatibleItems.length > 0;
     },
   },
   methods: {
@@ -84,9 +94,7 @@ export default {
               <span class="value">{{ token.suffix }}</span>
             </span>
           </span>
-          <span class="filtered-search-history-dropdown-search-token">
-            {{ item.searchToken }}
-          </span>
+          <span class="filtered-search-history-dropdown-search-token">{{ item.searchToken }}</span>
         </button>
       </li>
       <li class="divider"></li>

app/assets/javascripts/incidents/components/incidents_list.vue

@@ -287,7 +287,7 @@ export default {
           <gl-icon
             v-if="item.state === 'closed'"
             name="issue-close"
-            class="gl-mx-1 gl-fill-blue-500"
+            class="gl-mx-1 gl-fill-blue-500 gl-flex-shrink-0"
             :size="16"
             data-testid="incident-closed"
           />

app/assets/javascripts/maintenance_mode_settings/components/app.vue

 <script>
-import { GlToggle, GlFormGroup, GlFormTextarea, GlDeprecatedButton } from '@gitlab/ui';
+import { GlToggle, GlFormGroup, GlFormTextarea, GlButton } from '@gitlab/ui';
 
 export default {
   name: 'MaintenanceModeSettingsApp',
@@ -7,7 +7,7 @@ export default {
     GlToggle,
     GlFormGroup,
     GlFormTextarea,
-    GlDeprecatedButton,
+    GlButton,
   },
   data() {
     return {
@@ -38,7 +38,7 @@ export default {
       />
     </gl-form-group>
     <div class="mt-4">
-      <gl-deprecated-button variant="success">{{ __('Save changes') }}</gl-deprecated-button>
+      <gl-button variant="success" category="primary">{{ __('Save changes') }}</gl-button>
     </div>
   </article>
 </template>

app/assets/javascripts/pipelines/components/header_component.vue

 <script>
-import { GlLoadingIcon, GlModal, GlModalDirective } from '@gitlab/ui';
+import { GlLoadingIcon, GlModal, GlModalDirective, GlButton } from '@gitlab/ui';
 import ciHeader from '~/vue_shared/components/header_ci_component.vue';
-import LoadingButton from '~/vue_shared/components/loading_button.vue';
 import eventHub from '../event_hub';
 import { __ } from '~/locale';
 
@@ -13,7 +12,7 @@ export default {
     ciHeader,
     GlLoadingIcon,
     GlModal,
-    LoadingButton,
+    GlButton,
   },
   directives: {
     GlModal: GlModalDirective,
@@ -77,35 +76,43 @@ export default {
       :user="pipeline.user"
       item-name="Pipeline"
     >
-      <loading-button
+      <gl-button
         v-if="pipeline.retry_path"
         :loading="isRetrying"
         :disabled="isRetrying"
-        class="js-retry-button btn btn-inverted-secondary"
-        container-class="d-inline"
-        :label="__('Retry')"
+        data-testid="retryButton"
+        category="secondary"
+        variant="info"
         @click="retryPipeline()"
-      />
+      >
+        {{ __('Retry') }}
+      </gl-button>
 
-      <loading-button
+      <gl-button
         v-if="pipeline.cancel_path"
         :loading="isCanceling"
         :disabled="isCanceling"
-        class="js-btn-cancel-pipeline btn btn-danger"
-        container-class="d-inline"
-        :label="__('Cancel running')"
+        data-testid="cancelPipeline"
+        class="gl-ml-3"
+        category="primary"
+        variant="danger"
         @click="cancelPipeline()"
-      />
+      >
+        {{ __('Cancel running') }}
+      </gl-button>
 
-      <loading-button
+      <gl-button
         v-if="pipeline.delete_path"
         v-gl-modal="$options.DELETE_MODAL_ID"
         :loading="isDeleting"
         :disabled="isDeleting"
-        class="js-btn-delete-pipeline btn btn-danger btn-inverted"
-        container-class="d-inline"
-        :label="__('Delete')"
-      />
+        data-testid="deletePipeline"
+        class="gl-ml-3"
+        category="secondary"
+        variant="danger"
+      >
+        {{ __('Delete') }}
+      </gl-button>
     </ci-header>
 
     <gl-loading-icon v-if="isLoading" size="lg" class="gl-mt-3 gl-mb-3" />

app/assets/javascripts/pipelines/components/pipelines_list/pipeline_url.vue

 <script>
-import { GlLink, GlTooltipDirective } from '@gitlab/ui';
-import { escape } from 'lodash';
+import { GlLink, GlPopover, GlSprintf, GlTooltipDirective } from '@gitlab/ui';
 import { SCHEDULE_ORIGIN } from '../../constants';
-import { __, sprintf } from '~/locale';
-import popover from '~/vue_shared/directives/popover';
-
-const popoverTitle = sprintf(
-  escape(
-    __(
-      `This pipeline makes use of a predefined CI/CD configuration enabled by %{strongStart}Auto DevOps.%{strongEnd}`,
-    ),
-  ),
-  { strongStart: '<b>', strongEnd: '</b>' },
-  false,
-);
 
 export default {
   components: {
     GlLink,
+    GlPopover,
+    GlSprintf,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
-    popover,
   },
   props: {
     pipeline: {
@@ -44,23 +32,6 @@ export default {
     isScheduled() {
       return this.pipeline.source === SCHEDULE_ORIGIN;
     },
-    popoverOptions() {
-      return {
-        html: true,
-        trigger: 'focus',
-        placement: 'top',
-        title: `<div class="autodevops-title">
-            ${popoverTitle}
-          </div>`,
-        content: `<a
-            class="autodevops-link"
-            href="${this.autoDevopsHelpPath}"
-            target="_blank"
-            rel="noopener noreferrer nofollow">
-            ${escape(__('Learn more about Auto DevOps'))}
-          </a>`,
-      };
-    },
   },
 };
 </script>
@@ -114,13 +85,42 @@ export default {
       </span>
       <gl-link
         v-if="pipeline.flags.auto_devops"
-        v-popover="popoverOptions"
+        :id="`pipeline-url-autodevops-${pipeline.id}`"
         tabindex="0"
         class="js-pipeline-url-autodevops badge badge-info autodevops-badge"
         data-testid="pipeline-url-autodevops"
         role="button"
         >{{ __('Auto DevOps') }}</gl-link
       >
+      <gl-popover
+        :target="`pipeline-url-autodevops-${pipeline.id}`"
+        triggers="focus"
+        placement="top"
+      >
+        <template #title>
+          <div class="autodevops-title">
+            <gl-sprintf
+              :message="
+                __(
+                  'This pipeline makes use of a predefined CI/CD configuration enabled by %{strongStart}Auto DevOps.%{strongEnd}',
+                )
+              "
+            >
+              <template #strong="{content}">
+                <b>{{ content }}</b>
+              </template>
+            </gl-sprintf>
+          </div>
+        </template>
+        <gl-link
+          class="autodevops-link"
+          :href="autoDevopsHelpPath"
+          target="_blank"
+          rel="noopener noreferrer nofollow"
+        >
+          {{ __('Learn more about Auto DevOps') }}
+        </gl-link>
+      </gl-popover>
       <span
         v-if="pipeline.flags.stuck"
         class="js-pipeline-url-stuck badge badge-warning"

app/assets/javascripts/releases/util.js

@@ -10,13 +10,15 @@ import {
  * @param {string} createFrom The ref to create a new tag from, if necessary
  */
 export const releaseToApiJson = (release, createFrom = null) => {
+  const name = release.name?.trim().length > 0 ? release.name.trim() : null;
+
   const milestones = release.milestones ? release.milestones.map(milestone => milestone.title) : [];
 
   return convertObjectPropsToSnakeCase(
     {
+      name,
       tagName: release.tagName,
       ref: createFrom,
-      name: release.name,
       description: release.description,
       milestones,
       assets: release.assets,

app/assets/javascripts/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue

@@ -44,7 +44,8 @@ export default {
     },
     sortOptions: {
       type: Array,
-      required: true,
+      default: () => [],
+      required: false,
     },
     initialFilterValue: {
       type: Array,
@@ -63,7 +64,7 @@ export default {
     },
   },
   data() {
-    let selectedSortOption = this.sortOptions[0].sortDirection.descending;
+    let selectedSortOption = this.sortOptions[0]?.sortDirection?.descending;
     let selectedSortDirection = SortDirection.descending;
 
     // Extract correct sortBy value based on initialSortBy
@@ -83,7 +84,7 @@ export default {
     return {
       initialRender: true,
       recentSearchesPromise: null,
-      recentSearches: null,
+      recentSearches: [],
       filterValue: this.initialFilterValue,
       selectedSortOption,
       selectedSortDirection,
@@ -118,6 +119,9 @@ export default {
         ? __('Sort direction: Ascending')
         : __('Sort direction: Descending');
     },
+    filteredRecentSearches() {
+      return this.recentSearches.filter(item => typeof item !== 'string');
+    },
   },
   watch: {
     /**
@@ -246,7 +250,7 @@ export default {
       v-model="filterValue"
       :placeholder="searchInputPlaceholder"
       :available-tokens="tokens"
-      :history-items="recentSearches"
+      :history-items="filteredRecentSearches"
       class="flex-grow-1"
       @history-item-selected="handleHistoryItemSelected"
       @clear-history="handleClearHistory"
@@ -264,7 +268,7 @@ export default {
         </template>
       </template>
     </gl-filtered-search>
-    <gl-button-group class="sort-dropdown-container d-flex">
+    <gl-button-group v-if="selectedSortOption" class="sort-dropdown-container d-flex">
       <gl-dropdown :text="selectedSortOption.title" :right="true" class="w-100">
         <gl-dropdown-item
           v-for="sortBy in sortOptions"

app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/label_token.vue

@@ -3,7 +3,7 @@ import {
   GlToken,
   GlFilteredSearchToken,
   GlFilteredSearchSuggestion,
-  GlDropdownDivider,
+  GlNewDropdownDivider as GlDropdownDivider,
   GlLoadingIcon,
 } from '@gitlab/ui';
 import { debounce } from 'lodash';
@@ -102,14 +102,14 @@ export default {
     @input="searchLabels"
   >
     <template #view-token="{ inputValue, cssClasses, listeners }">
-      <gl-token variant="search-value" :class="cssClasses" :style="containerStyle" v-on="listeners">
-        ~{{ activeLabel ? activeLabel.title : inputValue }}
-      </gl-token>
+      <gl-token variant="search-value" :class="cssClasses" :style="containerStyle" v-on="listeners"
+        >~{{ activeLabel ? activeLabel.title : inputValue }}</gl-token
+      >
     </template>
     <template #suggestions>
-      <gl-filtered-search-suggestion :value="$options.noLabel">
-        {{ __('No label') }}
-      </gl-filtered-search-suggestion>
+      <gl-filtered-search-suggestion :value="$options.noLabel">{{
+        __('No label')
+      }}</gl-filtered-search-suggestion>
       <gl-dropdown-divider />
       <gl-loading-icon v-if="loading" />
       <template v-else>

app/assets/javascripts/vue_shared/components/header_ci_component.vue

@@ -105,7 +105,7 @@ export default {
       </template>
     </section>
 
-    <section v-if="$slots.default" class="header-action-buttons">
+    <section v-if="$slots.default" data-testid="headerButtons" class="gl-display-flex">
       <slot></slot>
     </section>
     <gl-deprecated-button

app/assets/stylesheets/pages/pipelines.scss

@@ -1052,13 +1052,6 @@ button.mini-pipeline-graph-dropdown-toggle {
   .text-center {
     padding-top: 12px;
   }
-
-  .header-action-buttons {
-    .btn,
-    a {
-      margin-left: 10px;
-    }
-  }
 }
 
 .pipelines-container .top-area .nav-controls > .btn:last-child {

app/assets/stylesheets/pages/projects.scss

@@ -143,8 +143,8 @@
 
 .group-home-panel,
 .project-home-panel {
-  padding-top: $gl-padding;
-  padding-bottom: $gl-padding;
+  margin-top: $gl-padding;
+  margin-bottom: $gl-padding;
 
   .home-panel-avatar {
     width: $home-panel-title-row-height;

app/controllers/concerns/send_file_upload.rb

@@ -18,7 +18,11 @@ module SendFileUpload
       send_params.merge!(filename: attachment, disposition: disposition)
     end
 
-    if file_upload.file_storage?
+    if image_scaling_request?(file_upload)
+      location = file_upload.file_storage? ? file_upload.path : file_upload.url
+      headers.store(*Gitlab::Workhorse.send_scaled_image(location, params[:width].to_i))
+      head :ok
+    elsif file_upload.file_storage?
       send_file file_upload.path, send_params
     elsif file_upload.class.proxy_download_enabled? || proxy
       headers.store(*Gitlab::Workhorse.send_url(file_upload.url(**redirect_params)))
@@ -37,4 +41,19 @@ module SendFileUpload
       "application/octet-stream"
     end
   end
+
+  private
+
+  def image_scaling_request?(file_upload)
+    avatar_image_upload?(file_upload) && valid_image_scaling_width? && current_user &&
+      Feature.enabled?(:dynamic_image_resizing, current_user)
+  end
+
+  def avatar_image_upload?(file_upload)
+    file_upload.try(:image?) && file_upload.try(:mounted_as)&.to_sym == :avatar
+  end
+
+  def valid_image_scaling_width?
+    Avatarable::ALLOWED_IMAGE_SCALER_WIDTHS.include?(params[:width]&.to_i)
+  end
 end

app/controllers/invites_controller.rb

@@ -75,7 +75,7 @@ class InvitesController < ApplicationController
     notice = notice.join(' ') + "."
 
     store_location_for :user, request.fullpath
-    redirect_to new_user_session_path, notice: notice
+    redirect_to new_user_session_path(invite_email: member.invite_email), notice: notice
   end
 
   def invite_details

app/controllers/sessions_controller.rb

@@ -25,6 +25,7 @@ class SessionsController < Devise::SessionsController
   before_action :store_unauthenticated_sessions, only: [:new]
   before_action :save_failed_login, if: :action_new_and_failed_login?
   before_action :load_recaptcha
+  before_action :set_invite_params, only: [:new]
 
   after_action :log_failed_login, if: :action_new_and_failed_login?
   after_action :verify_known_sign_in, only: [:create]
@@ -291,6 +292,10 @@ class SessionsController < Devise::SessionsController
       "standard"
     end
   end
+
+  def set_invite_params
+    @invite_email = ActionController::Base.helpers.sanitize(params[:invite_email])
+  end
 end
 
 SessionsController.prepend_if_ee('EE::SessionsController')

app/graphql/resolvers/group_milestone_resolver.rb → app/graphql/resolvers/group_milestones_resolver.rb

 # frozen_string_literal: true
 
 module Resolvers
-  class GroupMilestoneResolver < MilestoneResolver
+  class GroupMilestonesResolver < MilestonesResolver
     argument :include_descendants, GraphQL::BOOLEAN_TYPE,
-              required: false,
-              description: 'Also return milestones in all subgroups and subprojects'
+             required: false,
+             description: 'Also return milestones in all subgroups and subprojects'
 
     private
 

app/graphql/resolvers/milestone_resolver.rb → app/graphql/resolvers/milestones_resolver.rb

 # frozen_string_literal: true
 
 module Resolvers
-  class MilestoneResolver < BaseResolver
+  class MilestonesResolver < BaseResolver
     include Gitlab::Graphql::Authorize::AuthorizeResource
     include TimeFrameArguments
 
     argument :ids, [GraphQL::ID_TYPE],
-              required: false,
-              description: 'Array of global milestone IDs, e.g., "gid://gitlab/Milestone/1"'
+             required: false,
+             description: 'Array of global milestone IDs, e.g., "gid://gitlab/Milestone/1"'
 
     argument :state, Types::MilestoneStateEnum,
-              required: false,
-              description: 'Filter milestones by state'
+             required: false,
+             description: 'Filter milestones by state'
 
     type Types::MilestoneType, null: true
 
@@ -35,7 +35,7 @@ module Resolvers
     end
 
     def parent
-      @parent ||= object.respond_to?(:sync) ? object.sync : object
+      synchronized_object
     end
 
     def parent_id_parameters(args)

app/graphql/resolvers/project_milestone_resolver.rb → app/graphql/resolvers/project_milestones_resolver.rb

 # frozen_string_literal: true
 
 module Resolvers
-  class ProjectMilestoneResolver < MilestoneResolver
+  class ProjectMilestonesResolver < MilestonesResolver
     argument :include_ancestors, GraphQL::BOOLEAN_TYPE,
-              required: false,
-              description: "Also return milestones in the project's parent group and its ancestors"
+             required: false,
+             description: "Also return milestones in the project's parent group and its ancestors"
 
     private
 

app/graphql/types/group_type.rb

@@ -51,7 +51,7 @@ module Types
 
     field :milestones, Types::MilestoneType.connection_type, null: true,
           description: 'Milestones of the group',
-          resolver: Resolvers::GroupMilestoneResolver
+          resolver: Resolvers::GroupMilestonesResolver
 
     field :boards,
           Types::BoardType.connection_type,

app/graphql/types/project_type.rb

@@ -150,7 +150,7 @@ module Types
 
     field :milestones, Types::MilestoneType.connection_type, null: true,
           description: 'Milestones of the project',
-          resolver: Resolvers::ProjectMilestoneResolver
+          resolver: Resolvers::ProjectMilestonesResolver
 
     field :project_members,
           Types::ProjectMemberType.connection_type,

app/graphql/types/query_type.rb

@@ -47,6 +47,15 @@ module Types
           null: false,
           description: 'Fields related to design management'
 
+    field :milestone, ::Types::MilestoneType,
+          null: true,
+          description: 'Find a milestone',
+          resolve: -> (_obj, args, _ctx) { GitlabSchema.find_by_gid(args[:id]) } do
+      argument :id, ::Types::GlobalIDType[Milestone],
+               required: true,
+               description: 'Find a milestone by its ID'
+    end
+
     field :user, Types::UserType,
           null: true,
           description: 'Find a user',

app/graphql/types/snippet_type.rb

@@ -66,7 +66,8 @@ module Types
     field :blob, type: Types::Snippets::BlobType,
           description: 'Snippet blob',
           calls_gitaly: true,
-          null: false
+          null: false,
+          deprecated: { reason: 'Use `blobs`', milestone: '13.3' }
 
     field :blobs, type: [Types::Snippets::BlobType],
           description: 'Snippet blobs',

app/helpers/active_sessions_helper.rb

@@ -20,6 +20,6 @@ module ActiveSessionsHelper
         'monitor-o'
       end
 
-    sprite_icon(icon_name, size: 16, css_class: 'gl-mt-2')
+    sprite_icon(icon_name, css_class: 'gl-mt-2')
   end
 end

app/helpers/dashboard_helper.rb

@@ -40,7 +40,7 @@ module DashboardHelper
       end)
 
       if doc_href.present?
-        link_to_doc = link_to(sprite_icon('question', size: 16), doc_href,
+        link_to_doc = link_to(sprite_icon('question'), doc_href,
                               class: 'gl-ml-2', title: _('Documentation'),
                               target: '_blank', rel: 'noopener noreferrer')
 

app/helpers/issuables_helper.rb

@@ -205,7 +205,7 @@ module IssuablesHelper
       author_output
     end
 
-    output << content_tag(:span, (sprite_icon('first-contribution', size: 16, css_class: 'gl-icon gl-vertical-align-middle') if issuable.first_contribution?), class: 'has-tooltip gl-ml-2', title: _('1st contribution!'))
+    output << content_tag(:span, (sprite_icon('first-contribution', css_class: 'gl-icon gl-vertical-align-middle') if issuable.first_contribution?), class: 'has-tooltip gl-ml-2', title: _('1st contribution!'))
 
     output << content_tag(:span, (issuable.task_status if issuable.tasks?), id: "task_status", class: "d-none d-sm-none d-md-inline-block gl-ml-3")
     output << content_tag(:span, (issuable.task_status_short if issuable.tasks?), id: "task_status_short", class: "d-md-none")

app/helpers/issues_helper.rb

@@ -41,7 +41,7 @@ module IssuesHelper
   end
 
   def confidential_icon(issue)
-    sprite_icon('eye-slash', size: 16, css_class: 'gl-vertical-align-text-bottom') if issue.confidential?
+    sprite_icon('eye-slash', css_class: 'gl-vertical-align-text-bottom') if issue.confidential?
   end
 
   def award_user_list(awards, current_user, limit: 10)

app/helpers/sorting_helper.rb

@@ -238,7 +238,7 @@ module SortingHelper
     end
 
     link_to(url, type: 'button', class: link_class, title: s_('SortOptions|Sort direction')) do
-      sprite_icon(icon, size: 16)
+      sprite_icon(icon)
     end
   end
 

app/helpers/wiki_helper.rb

@@ -80,7 +80,7 @@ module WikiHelper
 
     link_to(wiki_path(wiki, action: :pages, sort: sort, direction: reversed_direction),
       type: 'button', class: link_class, title: _('Sort direction')) do
-      sprite_icon("sort-#{icon_class}", size: 16)
+      sprite_icon("sort-#{icon_class}")
     end
   end
 

app/models/concerns/avatarable.rb

@@ -3,6 +3,17 @@
 module Avatarable
   extend ActiveSupport::Concern
 
+  ALLOWED_IMAGE_SCALER_WIDTHS = [
+    400,
+    200,
+    64,
+    48,
+    40,
+    26,
+    20,
+    16
+  ].freeze
+
   included do
     prepend ShadowMethods
     include ObjectStorage::BackgroundMove

app/presenters/gitlab/blame_presenter.rb

@@ -76,7 +76,7 @@ module Gitlab
     end
 
     def versions_sprite_icon
-      @versions_sprite_icon ||= sprite_icon('doc-versions', size: 16, css_class: 'doc-versions align-text-bottom')
+      @versions_sprite_icon ||= sprite_icon('doc-versions', css_class: 'doc-versions align-text-bottom')
     end
   end
 end

app/presenters/project_presenter.rb

@@ -16,7 +16,7 @@ class ProjectPresenter < Gitlab::View::Presenter::Delegated
   MAX_TOPICS_TO_SHOW = 3
 
   def statistic_icon(icon_name = 'plus-square-o')
-    sprite_icon(icon_name, size: 16, css_class: 'icon gl-mr-2')
+    sprite_icon(icon_name, css_class: 'icon gl-mr-2')
   end
 
   def statistics_anchors(show_auto_devops_callout:)

app/views/admin/application_settings/integrations.html.haml

@@ -5,9 +5,9 @@
 - if Feature.enabled?(:instance_level_integrations)
   - if show_admin_integrations_moved?
     .gl-alert.gl-alert-info.js-admin-integrations-moved.mt-3{ role: 'alert', data: { feature_id: UserCalloutsHelper::ADMIN_INTEGRATIONS_MOVED, dismiss_endpoint: user_callouts_path } }
-      = sprite_icon('information-o', size: 16, css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
+      = sprite_icon('information-o', css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
       %button.js-close.gl-alert-dismiss{ type: 'button', 'aria-label' => _('Dismiss') }
-        = sprite_icon('close', size: 16, css_class: 'gl-icon')
+        = sprite_icon('close', css_class: 'gl-icon')
       .gl-alert-body
         %h4.gl-alert-title= s_('AdminSettings|Some settings have moved')
         = html_escape_once(s_('AdminSettings|Elasticsearch, PlantUML, Slack application, Third party offers, Snowplow, Amazon EKS have moved to Settings > General.')).html_safe

app/views/admin/broadcast_messages/_form.html.haml

 .broadcast-message.broadcast-banner-message.alert-warning.js-broadcast-banner-message-preview.mt-2{ style: broadcast_message_style(@broadcast_message), class: ('hidden' unless @broadcast_message.banner? ) }
-  = sprite_icon('bullhorn', size: 16, css_class:'vertical-align-text-top')
+  = sprite_icon('bullhorn', css_class:'vertical-align-text-top')
   .js-broadcast-message-preview
     - if @broadcast_message.message.present?
       = render_broadcast_message(@broadcast_message)
@@ -7,7 +7,7 @@
       Your message here
 .d-flex.justify-content-center
   .broadcast-message.broadcast-notification-message.preview.js-broadcast-notification-message-preview.mt-2{ class: ('hidden' unless @broadcast_message.notification? ) }
-    = sprite_icon('bullhorn', size: 16, css_class:'vertical-align-text-top')
+    = sprite_icon('bullhorn', css_class:'vertical-align-text-top')
     .js-broadcast-message-preview
       - if @broadcast_message.message.present?
         = render_broadcast_message(@broadcast_message)

app/views/admin/groups/_group.html.haml

@@ -22,11 +22,11 @@
     = render_if_exists 'admin/groups/marked_for_deletion_badge', group: group, css_class: 'gl-ml-5'
 
     %span.gl-ml-5
-      = sprite_icon('bookmark', size: 16, css_class: 'gl-vertical-align-text-bottom')
+      = sprite_icon('bookmark', css_class: 'gl-vertical-align-text-bottom')
       = number_with_delimiter(group.projects.count)
 
     %span.gl-ml-5
-      = sprite_icon('users', size: 16, css_class: 'gl-vertical-align-text-bottom')
+      = sprite_icon('users', css_class: 'gl-vertical-align-text-bottom')
       = number_with_delimiter(group.users.count)
 
     %span.gl-ml-5.visibility-icon.has-tooltip{ data: { container: 'body', placement: 'left' }, title: visibility_icon_description(group) }

app/views/admin/runners/_runner.html.haml

@@ -66,7 +66,7 @@
     .btn-group.table-action-buttons
       .btn-group
         = link_to admin_runner_path(runner), class: 'btn btn-default has-tooltip', title: _('Edit'), ref: 'tooltip', aria: { label: _('Edit') }, data: { placement: 'top', container: 'body'} do
-          = sprite_icon('pencil', size: 16)
+          = sprite_icon('pencil')
       .btn-group
         - if runner.active?
           = link_to [:pause, :admin, runner], method: :get, class: 'btn btn-default btn-svg has-tooltip', title: _('Pause'), ref: 'tooltip', aria: { label: _('Pause') }, data: { placement: 'top', container: 'body', confirm: _('Are you sure?') } do

app/views/admin/users/_user_listing_note.html.haml

 - if user.note.present?
   %span.has-tooltip.user-note{ title: user.note }
-    = sprite_icon('document', size: 16, css_class: 'gl-vertical-align-middle')
+    = sprite_icon('document', css_class: 'gl-vertical-align-middle')

app/views/clusters/clusters/_banner.html.haml

@@ -7,16 +7,16 @@
   %span.gl-ml-2= s_('ClusterIntegration|Kubernetes cluster is being created...')
 
 .hidden.row.js-cluster-api-unreachable.gl-alert.gl-alert-warning{ role: 'alert' }
-  = sprite_icon('warning', size: 16, css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
+  = sprite_icon('warning', css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
   %button.js-close-banner.gl-alert-dismiss{ type: 'button', 'aria-label' => _('Dismiss') }
-    = sprite_icon('close', size: 16, css_class: 'gl-icon')
+    = sprite_icon('close', css_class: 'gl-icon')
   .gl-alert-body
     = s_('ClusterIntegration|Your cluster API is unreachable. Please ensure your API URL is correct.')
 
 .hidden.js-cluster-authentication-failure.js-cluster-api-unreachable.gl-alert.gl-alert-warning{ role: 'alert' }
-  = sprite_icon('warning', size: 16, css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
+  = sprite_icon('warning', css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
   %button.js-close-banner.gl-alert-dismiss{ type: 'button', 'aria-label' => _('Dismiss') }
-    = sprite_icon('close', size: 16, css_class: 'gl-icon')
+    = sprite_icon('close', css_class: 'gl-icon')
   .gl-alert-body
     = s_('ClusterIntegration|There was a problem authenticating with your cluster. Please ensure your CA Certificate and Token are valid.')
 

app/views/clusters/clusters/_gcp_signup_offer_banner.html.haml

@@ -3,10 +3,9 @@
   %button.close.js-close{ type: "button" }  ×
   .gcp-signup-offer--content
     .gcp-signup-offer--icon.gl-mr-3
-      = sprite_icon("information", size: 16)
+      = sprite_icon("information")
     .gcp-signup-offer--copy
       %h4= s_('ClusterIntegration|Did you know?')
       %p= s_('ClusterIntegration|Every new Google Cloud Platform (GCP) account receives $300 in credit upon %{sign_up_link}. In partnership with Google, GitLab is able to offer an additional $200 for both new and existing GCP accounts to get started with GitLab\'s Google Kubernetes Engine Integration.').html_safe % { sign_up_link: link }
       %a.btn.btn-default{ href: 'https://cloud.google.com/partners/partnercredit/?pcn_code=0014M00001h35gDQAQ#contact-form', target: '_blank', rel: 'noopener noreferrer' }
         = s_("ClusterIntegration|Apply for credit")
-

app/views/dashboard/_activities.html.haml

@@ -2,7 +2,7 @@
   = render 'shared/event_filter'
   .controls
     = link_to dashboard_projects_path(rss_url_options), class: 'btn gl-button btn-default btn-icon d-none d-sm-inline-flex has-tooltip', title: 'Subscribe' do
-      = sprite_icon('rss', css_class: 'qa-rss-icon gl-icon', size: 16)
+      = sprite_icon('rss', css_class: 'qa-rss-icon gl-icon')
 
 .content_list
 .loading

app/views/devise/sessions/_new_base.html.haml

 = form_for(resource, as: resource_name, url: session_path(resource_name), html: { class: 'new_user gl-show-field-errors', 'aria-live' => 'assertive'}) do |f|
   .form-group
     = f.label _('Username or email'), for: 'user_login', class: 'label-bold'
-    = f.text_field :login, class: 'form-control top', autofocus: 'autofocus', autocapitalize: 'off', autocorrect: 'off', required: true, title: _('This field is required.'), data: { qa_selector: 'login_field' }
+    = f.text_field :login, value: @invite_email, class: 'form-control top', autofocus: 'autofocus', autocapitalize: 'off', autocorrect: 'off', required: true, title: _('This field is required.'), data: { qa_selector: 'login_field' }
   .form-group
     = f.label :password, class: 'label-bold'
     = f.password_field :password, class: 'form-control bottom', required: true, title: _('This field is required.'), data: { qa_selector: 'password_field' }

app/views/devise/shared/_signup_box.html.haml

@@ -19,7 +19,7 @@
         %p.validation-pending.gl-field-error-ignore.field-validation.hide= _('Checking username availability...')
       .form-group
         = f.label :email, class: 'label-bold'
-        = f.email_field :email, class: "form-control middle", data: { qa_selector: 'new_user_email_field' }, required: true, title: _("Please provide a valid email address.")
+        = f.email_field :email, value: @invite_email, class: "form-control middle", data: { qa_selector: 'new_user_email_field' }, required: true, title: _("Please provide a valid email address.")
       .form-group
         = f.label :email_confirmation, class: 'label-bold'
         = f.email_field :email_confirmation, class: "form-control middle", data: { qa_selector: 'new_user_email_confirmation_field' }, required: true, title: _("Please retype the email address.")

app/views/explore/groups/index.html.haml

@@ -12,7 +12,7 @@
 
 - if cookies[:explore_groups_landing_dismissed] != 'true'
   .explore-groups.landing.content-block.js-explore-groups-landing.hide
-    %button.dismiss-button{ type: 'button', 'aria-label' => _('Dismiss') }= sprite_icon('close', size: 16)
+    %button.dismiss-button{ type: 'button', 'aria-label' => _('Dismiss') }= sprite_icon('close')
     .svg-container
       = custom_icon('icon_explore_groups_splash')
     .inner-content

app/views/groups/_activities.html.haml

@@ -2,9 +2,8 @@
   = render 'shared/event_filter', show_group_events: @group.supports_events?
   .controls
     = link_to group_path(@group, rss_url_options), class: 'btn gl-button btn-default btn-icon d-none d-sm-inline-flex has-tooltip' , title: 'Subscribe' do
-      = sprite_icon('rss', css_class: 'qa-rss-icon gl-icon', size: 16)
+      = sprite_icon('rss', css_class: 'qa-rss-icon gl-icon')
 
 .content_list
 .loading
   .spinner.spinner-md
-

app/views/import/gitlab/status.html.haml

 - page_title _("GitLab.com import")
 - header_title _("Projects"), root_path
 %h3.page-title
-  = sprite_icon('heart', size: 16, css_class: 'gl-vertical-align-middle')
+  = sprite_icon('heart', css_class: 'gl-vertical-align-middle')
   = _('Import projects from GitLab.com')
 
 = render 'import/githubish_status', provider: 'gitlab', filterable: false

app/views/import/gitlab_projects/new.html.haml

@@ -3,7 +3,7 @@
 
 %h3.page-title.d-flex
   .gl-display-flex.gl-align-items-center.gl-justify-content-center
-    = sprite_icon('tanuki', size: 16, css_class: 'gl-mr-2')
+    = sprite_icon('tanuki', css_class: 'gl-mr-2')
   = _('Import an exported GitLab project')
 %hr
 

app/views/layouts/_flash.html.haml

@@ -6,8 +6,8 @@
       .js-toast-message{ data: { message: value } }
     - elsif value
       %div{ class: "flash-#{key} mb-2" }
-        = sprite_icon(icons[key], size: 16, css_class: 'align-middle mr-1') unless icons[key].nil?
+        = sprite_icon(icons[key], css_class: 'align-middle mr-1') unless icons[key].nil?
         %span= value
         - if %w(alert notice success).include?(key)
           %div{ class: "close-icon-wrapper js-close-icon" }
-            = sprite_icon('close', size: 16, css_class: 'close-icon')
+            = sprite_icon('close', css_class: 'close-icon')

app/views/layouts/_search.html.haml

@@ -20,8 +20,8 @@
                   %a
                     = _('Loading...')
             = dropdown_loading
-          = sprite_icon('search', size: 16, css_class: 'search-icon')
-          = sprite_icon('close', size: 16, css_class: 'clear-icon js-clear-input')
+          = sprite_icon('search', css_class: 'search-icon')
+          = sprite_icon('close', css_class: 'clear-icon js-clear-input')
 
     = hidden_field_tag :group_id, search_context.for_group? ? search_context.group.id : '', class: 'js-search-group-options', data: search_context.group_metadata
     = hidden_field_tag :project_id, search_context.for_project? ? search_context.project.id : '', id: 'search_project_id', class: 'js-search-project-options', data: search_context.project_metadata

app/views/layouts/header/_default.html.haml

@@ -32,32 +32,32 @@
               = render 'layouts/search' unless current_controller?(:search)
             %li.nav-item.d-inline-block.d-lg-none
               = link_to search_context.search_url, title: _('Search'), aria: { label: _('Search') }, data: {toggle: 'tooltip', placement: 'bottom', container: 'body'} do
-                = sprite_icon('search', size: 16)
+                = sprite_icon('search')
           - if header_link?(:issues)
             = nav_link(path: 'dashboard#issues', html_options: { class: "user-counter" }) do
               = link_to assigned_issues_dashboard_path, title: _('Issues'), class: 'dashboard-shortcuts-issues', aria: { label: _('Issues') }, data: { qa_selector: 'issues_shortcut_button', toggle: 'tooltip', placement: 'bottom', container: 'body' } do
-                = sprite_icon('issues', size: 16)
+                = sprite_icon('issues')
                 - issues_count = assigned_issuables_count(:issues)
                 %span.badge.badge-pill.issues-count.green-badge{ class: ('hidden' if issues_count == 0) }
                   = number_with_delimiter(issues_count)
           - if header_link?(:merge_requests)
             = nav_link(path: 'dashboard#merge_requests', html_options: { class: "user-counter" }) do
               = link_to assigned_mrs_dashboard_path, title: _('Merge requests'), class: 'dashboard-shortcuts-merge_requests', aria: { label: _('Merge requests') }, data: { qa_selector: 'merge_requests_shortcut_button', toggle: 'tooltip', placement: 'bottom', container: 'body' } do
-                = sprite_icon('git-merge', size: 16)
+                = sprite_icon('git-merge')
                 - merge_requests_count = assigned_issuables_count(:merge_requests)
                 %span.badge.badge-pill.merge-requests-count{ class: ('hidden' if merge_requests_count == 0) }
                   = number_with_delimiter(merge_requests_count)
           - if header_link?(:todos)
             = nav_link(controller: 'dashboard/todos', html_options: { class: "user-counter" }) do
               = link_to dashboard_todos_path, title: _('To-Do List'), aria: { label: _('To-Do List') }, class: 'shortcuts-todos', data: { qa_selector: 'todos_shortcut_button', toggle: 'tooltip', placement: 'bottom', container: 'body' } do
-                = sprite_icon('todo-done', size: 16)
+                = sprite_icon('todo-done')
                 %span.badge.badge-pill.todos-count{ class: ('hidden' if todos_pending_count == 0) }
                   = todos_count_format(todos_pending_count)
           %li.nav-item.header-help.dropdown.d-none.d-md-block
             = link_to help_path, class: 'header-help-dropdown-toggle', data: { toggle: "dropdown" } do
               %span.gl-sr-only
                 = s_('Nav|Help')
-              = sprite_icon('question', size: 16)
+              = sprite_icon('question')
               = sprite_icon('angle-down', css_class: 'caret-down')
             .dropdown-menu.dropdown-menu-right
               = render 'layouts/header/help_dropdown'

app/views/layouts/header/_new_dropdown.haml

 %li.header-new.dropdown{ data: { track_label: "new_dropdown", track_event: "click_dropdown", track_value: "" } }
   = link_to new_project_path, class: "header-new-dropdown-toggle has-tooltip qa-new-menu-toggle", id: "js-onboarding-new-project-link", title: _("New..."), ref: 'tooltip', aria: { label: _("New...") }, data: { toggle: 'dropdown', placement: 'bottom', container: 'body', display: 'static' } do
-    = sprite_icon('plus-square', size: 16)
+    = sprite_icon('plus-square')
     = sprite_icon('angle-down', css_class: 'caret-down')
   .dropdown-menu.dropdown-menu-right
     %ul

app/views/profiles/gpg_keys/_key.html.haml

 %li.key-list-item
   .float-left.gl-mr-3
-    = sprite_icon('key', size: 16, css_class: "settings-list-icon d-none d-sm-block gl-mt-4")
+    = sprite_icon('key', css_class: "settings-list-icon d-none d-sm-block gl-mt-4")
   .key-list-item-info
     - key.emails_with_verified_status.map do |email, verified|
       = render partial: 'shared/email_with_badge', locals: { email: email, verified: verified }

app/views/profiles/keys/_key.html.haml

@@ -3,12 +3,12 @@
     - if key.valid?
       - if key.expired?
         %span.d-inline-block.has-tooltip{ title: s_('Profiles|Your key has expired') }
-          = sprite_icon('warning-solid', size: 16, css_class: 'settings-list-icon d-none d-sm-block')
+          = sprite_icon('warning-solid', css_class: 'settings-list-icon d-none d-sm-block')
       - else
-        = sprite_icon('key', size: 16, css_class: 'settings-list-icon d-none d-sm-block ')
+        = sprite_icon('key', css_class: 'settings-list-icon d-none d-sm-block ')
     - else
       %span.d-inline-block.has-tooltip{ title: key.errors.full_messages.join(', ') }
-        = sprite_icon('warning-solid', size: 16, css_class: 'settings-list-icon d-none d-sm-block')
+        = sprite_icon('warning-solid', css_class: 'settings-list-icon d-none d-sm-block')
 
   .key-list-item-info.w-100.float-none
     = link_to path_to_key(key, is_admin), class: "title" do
@@ -28,4 +28,4 @@
         - if key.can_delete?
           = link_to path_to_key(key, is_admin), data: { confirm: _('Are you sure?')}, method: :delete, class: "btn btn-transparent gl-ml-3 align-baseline" do
             %span.sr-only= _('Remove')
-            = sprite_icon('remove', size: 16)
+            = sprite_icon('remove')

app/views/projects/_activity.html.haml

@@ -5,7 +5,7 @@
     = render 'shared/event_filter'
     .controls.gl-display-flex
       = link_to project_path(@project, rss_url_options), title: s_("ProjectActivityRSS|Subscribe"), class: 'btn gl-button btn-default btn-icon d-none d-sm-inline-flex has-tooltip' do
-        = sprite_icon('rss', css_class: 'qa-rss-icon gl-icon', size: 16)
+        = sprite_icon('rss', css_class: 'qa-rss-icon gl-icon')
       - if is_project_overview && can?(current_user, :download_code, @project)
         .project-clone-holder.d-none.d-md-inline-flex.gl-ml-2
           = render "projects/buttons/clone", dropdown_class: 'dropdown-menu-right'

app/views/projects/_home_panel.html.haml

@@ -24,7 +24,7 @@
               = render 'shared/members/access_request_links', source: @project
           - if @project.tag_list.present?
             %span.home-panel-topic-list.mt-2.w-100.d-inline-flex
-              = sprite_icon('tag', size: 16, css_class: 'icon gl-mr-2')
+              = sprite_icon('tag', css_class: 'icon gl-mr-2')
 
               - @project.topics_to_show.each do |topic|
                 - project_topics_classes = "badge badge-pill badge-secondary gl-mr-2"

app/views/projects/_import_project_pane.html.haml

@@ -57,7 +57,7 @@
       - if git_import_enabled?
         %div
           %button.btn.btn-svg.js-toggle-button.js-import-git-toggle-button{ type: "button", data: { toggle_open_class: 'active' }, **tracking_attrs(track_label, 'click_button', 'repo_url') }
-            = sprite_icon('link', size: 16, css_class: 'gl-icon')
+            = sprite_icon('link', css_class: 'gl-icon')
             = _('Repo by URL')
 
       - if manifest_import_enabled?

app/views/projects/_visibility_modal.html.haml

@@ -7,7 +7,7 @@
       .modal-header
         %h3.page-title= _('Reduce this project’s visibility?')
         %button.close{ type: "button", "data-dismiss": "modal", "aria-label" => _('Close') }
-          %span{ "aria-hidden": true }= sprite_icon("close", size: 16)
+          %span{ "aria-hidden": true }= sprite_icon("close")
       .modal-body
         %p
           - if @project.group

app/views/projects/blob/viewers/_changelog.html.haml

-= sprite_icon('history', size: 16, css_class: 'gl-mr-1 gl-vertical-align-text-bottom')
+= sprite_icon('history', css_class: 'gl-mr-1 gl-vertical-align-text-bottom')
 = succeed '.' do
   To find the state of this project's repository at the time of any of these versions, check out
   = link_to "the tags", project_tags_path(viewer.project)

app/views/projects/blob/viewers/_license.html.haml

 - license = viewer.license
 
-= sprite_icon('scale', size: 16)
+= sprite_icon('scale')
 This project is licensed under the
 = succeed '.' do
   %strong= license.name

app/views/projects/commits/show.html.haml

@@ -27,7 +27,7 @@
             = search_field_tag :search, params[:search], { placeholder: _('Search by message'), id: 'commits-search', class: 'form-control search-text-input input-short gl-mt-3 gl-sm-mt-0 gl-min-w-full', spellcheck: false }
         .control.d-none.d-md-block
           = link_to project_commits_path(@project, @ref, rss_url_options), title: _("Commits feed"), class: 'btn btn-svg' do
-            = sprite_icon('rss', css_class: 'qa-rss-icon', size: 16)
+            = sprite_icon('rss', css_class: 'qa-rss-icon')
 
   = render_if_exists 'projects/commits/mirror_status'
 

app/views/projects/compare/_form.html.haml

@@ -10,7 +10,7 @@
       = hidden_field_tag :to, params[:to]
       = button_tag type: 'button', title: params[:to], class: "btn form-control compare-dropdown-toggle js-compare-dropdown has-tooltip", required: true, data: { refs_url: refs_project_path(@project), toggle: "dropdown", target: ".js-compare-to-dropdown", selected: params[:to], field_name: :to } do
         .dropdown-toggle-text.str-truncated.monospace.float-left= params[:to] || _("Select branch/tag")
-        = sprite_icon('chevron-down', size: 16, css_class: 'float-right')
+        = sprite_icon('chevron-down', css_class: 'float-right')
     = render 'shared/ref_dropdown'
   .compare-ellipsis.inline ...
   .form-group.dropdown.compare-form-group.from.js-compare-from-dropdown
@@ -21,7 +21,7 @@
       = hidden_field_tag :from, params[:from]
       = button_tag type: 'button', title: params[:from], class: "btn form-control compare-dropdown-toggle js-compare-dropdown has-tooltip", required: true, data: { refs_url: refs_project_path(@project), toggle: "dropdown", target: ".js-compare-from-dropdown", selected: params[:from], field_name: :from } do
         .dropdown-toggle-text.str-truncated.monospace.float-left= params[:from] || _("Select branch/tag")
-        = sprite_icon('chevron-down', size: 16, css_class: 'float-right')
+        = sprite_icon('chevron-down', css_class: 'float-right')
     = render 'shared/ref_dropdown'
    
   = button_tag s_("CompareBranches|Compare"), class: "btn btn-success commits-compare-btn"

app/views/projects/diffs/_file.html.haml

@@ -14,7 +14,7 @@
       .file-actions.d-none.d-sm-block
         - if blob&.readable_text?
           = link_to '#', class: 'js-toggle-diff-comments btn active has-tooltip', title: _("Toggle comments for this file"), disabled: @diff_notes_disabled do
-            = sprite_icon('comment', size: 16)
+            = sprite_icon('comment')
           \
           - if editable_diff?(diff_file)
             - link_opts = @merge_request.persisted? ? { from_merge_request_iid: @merge_request.iid } : {}

app/views/projects/diffs/_stats.html.haml

@@ -22,7 +22,7 @@
         - diff_files.each do |diff_file|
           %li
             %a.diff-changed-file{ href: "##{hexdigest(diff_file.file_path)}", title: diff_file.new_path }
-              = sprite_icon(diff_file_changed_icon(diff_file), size: 16, css_class: "#{diff_file_changed_icon_color(diff_file)} diff-file-changed-icon gl-mr-3")
+              = sprite_icon(diff_file_changed_icon(diff_file), css_class: "#{diff_file_changed_icon_color(diff_file)} diff-file-changed-icon gl-mr-3")
               %span.diff-changed-file-content.gl-mr-3
                 - if diff_file.file_path
                   %strong.diff-changed-file-name

app/views/projects/forks/error.html.haml

@@ -2,7 +2,7 @@
 - if @forked_project && !@forked_project.saved?
   .alert.alert-danger.alert-block
     %h4
-      = sprite_icon('fork', size: 16)
+      = sprite_icon('fork')
       = _("Fork Error!")
     %p
       = _("You tried to fork %{link_to_the_project} but it failed for the following reason:").html_safe % { link_to_the_project: link_to_project(@project) }

app/views/projects/issues/_alert_moved_from_service_desk.html.haml

@@ -3,8 +3,8 @@
 - service_desk_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: service_desk_link_url }
 
 .hide.gl-alert.gl-alert-warning.js-alert-moved-from-service-desk-warning.gl-mt-5{ role: 'alert' }
-  = sprite_icon('warning', size: 16, css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
+  = sprite_icon('warning', css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
   %button.js-close.gl-alert-dismiss{ type: 'button', 'aria-label' => _('Dismiss') }
-    = sprite_icon('close', size: 16, css_class: 'gl-icon')
+    = sprite_icon('close', css_class: 'gl-icon')
   .gl-alert-body.gl-mr-3
     = s_('This project does not have %{service_desk_link_start}Service Desk%{service_desk_link_end} enabled, so the user who created the issue will no longer receive email notifications about new activity.').html_safe % { service_desk_link_start: service_desk_link_start, service_desk_link_end: '</a>'.html_safe }

app/views/projects/issues/_issue.html.haml

@@ -30,7 +30,7 @@
             %span.issuable-milestone.d-none.d-sm-inline-block
                
               = link_to project_issues_path(issue.project, milestone_title: issue.milestone.title), data: { html: 'true', toggle: 'tooltip', title: milestone_tooltip_due_date(issue.milestone) } do
-                = sprite_icon('clock', size: 16, css_class: 'gl-vertical-align-text-bottom')
+                = sprite_icon('clock', css_class: 'gl-vertical-align-text-bottom')
                 = issue.milestone.title
           - if issue.due_date
             %span.issuable-due-date.d-none.d-sm-inline-block.has-tooltip{ class: "#{'cred' if issue.overdue?}", title: _('Due date') }

app/views/projects/issues/_issue_estimate.html.haml

@@ -3,5 +3,5 @@
 - if issue.time_estimate > 0
   %span.issuable-estimate.d-none.d-sm-inline-block.has-tooltip{ data: { container: 'body', qa_selector: 'issuable_estimate' }, title: _('Estimate') }
      
-    = sprite_icon('timer', size: 16, css_class: 'issue-estimate-icon')
+    = sprite_icon('timer', css_class: 'issue-estimate-icon')
     = Gitlab::TimeTrackingFormatter.output(issue.time_estimate)

app/views/projects/issues/export_csv/_modal.html.haml

@@ -8,7 +8,7 @@
           .svg-content.import-export-svg-container
             = image_tag 'illustrations/export-import.svg', alt: _('Import/Export illustration'), class: 'illustration'
           %a.close{ href: '#', 'data-dismiss' => 'modal' }
-            = sprite_icon('close', size: 16, css_class: 'gl-icon')
+            = sprite_icon('close', css_class: 'gl-icon')
         .modal-body
           .modal-subheader
             = icon('check', { class: 'checkmark' })

app/views/projects/issues/show.html.haml

@@ -17,11 +17,11 @@
 .detail-page-header
   .detail-page-header-body
     .issuable-status-box.status-box.status-box-issue-closed{ class: issue_status_visibility(@issue, status_box: :closed) }
-      = sprite_icon('mobile-issue-close', size: 16, css_class: 'd-block d-sm-none')
+      = sprite_icon('mobile-issue-close', css_class: 'd-block d-sm-none')
       .d-none.d-sm-block
         = issue_closed_text(@issue, current_user)
     .issuable-status-box.status-box.status-box-open{ class: issue_status_visibility(@issue, status_box: :open) }
-      = sprite_icon('issue-open-m', size: 16, css_class: 'd-block d-sm-none')
+      = sprite_icon('issue-open-m', css_class: 'd-block d-sm-none')
       %span.d-none.d-sm-block Open
 
     .issuable-meta

app/views/projects/merge_requests/_approvals_count.html.haml

@@ -6,7 +6,7 @@
   - final_text = n_("%d approver", "%d approvers", total) % total
   - final_self_text = n_("%d approver (you've approved)", "%d approvers (you've approved)", total) % total
 
-  - approval_icon = sprite_icon((self_approved ? 'approval-solid' : 'approval'), size: 16, css_class: 'align-middle')
+  - approval_icon = sprite_icon((self_approved ? 'approval-solid' : 'approval'), css_class: 'align-middle')
 
   %li.d-none.d-sm-inline-block.has-tooltip.text-success{ title: self_approved ? final_self_text : final_text }
     = approval_icon

app/views/projects/merge_requests/_merge_request.html.haml

@@ -25,7 +25,7 @@
           %span.issuable-milestone.d-none.d-sm-inline-block
              
             = link_to project_merge_requests_path(merge_request.project, milestone_title: merge_request.milestone.title), data: { html: 'true', toggle: 'tooltip', title: milestone_tooltip_due_date(merge_request.milestone) } do
-              = sprite_icon('clock', size: 16, css_class: 'gl-vertical-align-text-bottom')
+              = sprite_icon('clock', css_class: 'gl-vertical-align-text-bottom')
               = merge_request.milestone.title
         - if merge_request.target_project.default_branch != merge_request.target_branch
           %span.project-ref-path.has-tooltip{ title: _('Target branch') }
@@ -45,13 +45,13 @@
             = _('MERGED')
         - elsif merge_request.closed?
           %li.issuable-status.d-none.d-sm-inline-block
-            = sprite_icon('cancel', size: 16, css_class: 'gl-vertical-align-text-bottom')
+            = sprite_icon('cancel', css_class: 'gl-vertical-align-text-bottom')
             = _('CLOSED')
         = render 'shared/merge_request_pipeline_status', merge_request: merge_request
         - if merge_request.open? && merge_request.broken?
           %li.issuable-pipeline-broken.d-none.d-sm-flex
             = link_to merge_request_path(merge_request), class: "has-tooltip", title: _('Cannot be merged automatically') do
-              = sprite_icon('warning-solid', size: 16)
+              = sprite_icon('warning-solid')
         - if merge_request.assignees.any?
           %li.d-flex
             = render 'shared/issuable/assignees', project: merge_request.project, issuable: merge_request

app/views/projects/merge_requests/_mr_title.html.haml

@@ -10,7 +10,7 @@
 .detail-page-header{ class: ("border-bottom-0 pt-0 pb-0" if mr_tabs_position_enabled?) }
   .detail-page-header-body
     .issuable-status-box.status-box{ class: status_box_class(@merge_request) }
-      = sprite_icon(state_icon_name, size: 16, css_class: 'd-block d-sm-none')
+      = sprite_icon(state_icon_name, css_class: 'd-block d-sm-none')
       %span.d-none.d-sm-block
         = state_human_name
 

app/views/projects/mirrors/_mirror_repos.html.haml

@@ -36,7 +36,7 @@
             = f.submit _('Mirror repository'), class: 'btn btn-success js-mirror-submit qa-mirror-repository-button', name: :update_remote_mirror
     - else
       .gl-alert.gl-alert-info{ role: 'alert' }
-        = sprite_icon('information-o', size: 16, css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
+        = sprite_icon('information-o', css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
         .gl-alert-body
           = _('Mirror settings are only available to GitLab administrators.')
 
@@ -75,4 +75,3 @@
                         = clipboard_button(text: mirror.ssh_public_key, class: 'btn btn-default', title: _('Copy SSH public key'), qa_selector: 'copy_public_key_button')
                       = render 'shared/remote_mirror_update_button', remote_mirror: mirror
                     %button.js-delete-mirror.qa-delete-mirror.rspec-delete-mirror.btn.btn-danger{ type: 'button', data: { mirror_id: mirror.id, toggle: 'tooltip', container: 'body' }, title: _('Remove') }= icon('trash-o')
-

app/views/projects/notes/_actions.html.haml

 - access = note_max_access_for_user(note)
 - if note.has_special_role?(Note::SpecialRole::FIRST_TIME_CONTRIBUTOR)
   %span.note-role.note-role-special.has-tooltip{ title: _("This is the author's first Merge Request to this project.") }
-    = sprite_icon('first-contribution', size: 16, css_class: 'gl-icon gl-vertical-align-top')
+    = sprite_icon('first-contribution', css_class: 'gl-icon gl-vertical-align-top')
 - if access.nonzero?
   %span.note-role.user-access-role= Gitlab::Access.human_access(access)
 

app/views/projects/pages/_list.html.haml

@@ -10,7 +10,7 @@
           - if verification_enabled
             - tooltip, status = domain.unverified? ? [s_('GitLabPages|Unverified'), 'failed'] : [s_('GitLabPages|Verified'), 'success']
             .domain-status.ci-status-icon.has-tooltip{ class: "ci-status-icon-#{status}", title: tooltip }
-              = sprite_icon("status_#{status}", size: 16 )
+              = sprite_icon("status_#{status}" )
           .domain-name
             = external_link(domain.url, domain.url)
             - if domain.certificate

app/views/projects/pipeline_schedules/_pipeline_schedule.html.haml

@@ -34,7 +34,7 @@
             = s_('PipelineSchedules|Take ownership')
         - if can?(current_user, :update_pipeline_schedule, pipeline_schedule)
           = link_to edit_pipeline_schedule_path(pipeline_schedule), title: _('Edit'), class: 'btn gl-display-flex' do
-            = sprite_icon('pencil', size: 16)
+            = sprite_icon('pencil')
         - if can?(current_user, :admin_pipeline_schedule, pipeline_schedule)
           = link_to pipeline_schedule_path(pipeline_schedule), title: _('Delete'), method: :delete, class: 'btn btn-remove', data: { confirm: _("Are you sure you want to delete this pipeline schedule?") } do
             = icon('trash')

app/views/projects/pipelines/_info.html.haml

@@ -8,7 +8,7 @@
 .info-well
   .well-segment.pipeline-info
     .icon-container.gl-vertical-align-text-bottom
-      = sprite_icon('clock', size: 16)
+      = sprite_icon('clock')
     = pluralize @pipeline.total_size, "job"
     = @pipeline.ref_text
     - if @pipeline.duration

app/views/projects/runners/_runner.html.haml

@@ -7,11 +7,11 @@
 
       - if runner.locked?
         %span.has-tooltip{ title: _('Locked to current projects') }
-          = sprite_icon('lock', size: 16)
+          = sprite_icon('lock')
 
       %small.edit-runner
         = link_to edit_project_runner_path(@project, runner), class: 'btn btn-edit' do
-          = sprite_icon('pencil', size: 16)
+          = sprite_icon('pencil')
     - else
       %span.commit-sha
         = runner.short_sha

app/views/projects/services/alerts/_top.html.haml

 .row
   .col-lg-12
     .gl-alert.gl-alert-info{ role: 'alert' }
-      = sprite_icon('information-o', size: 16, css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
+      = sprite_icon('information-o', css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
       .gl-alert-body
         = _('You can now manage alert endpoint configuration in the Alerts section on the Operations settings page. Fields on this page have been deprecated.')
       .gl-alert-actions

app/views/projects/services/mattermost_slash_commands/_detailed_help.html.haml

@@ -7,13 +7,13 @@
     1.
     = link_to 'https://docs.mattermost.com/developer/slash-commands.html#enabling-custom-commands', target: '_blank', rel: 'noopener noreferrer nofollow' do
       Enable custom slash commands
-      = sprite_icon('external-link', size: 16)
+      = sprite_icon('external-link')
     on your Mattermost installation
   %li
     2.
     = link_to 'https://docs.mattermost.com/developer/slash-commands.html#set-up-a-custom-command', target: '_blank', rel: 'noopener noreferrer nofollow' do
       Add a slash command
-      = sprite_icon('external-link', size: 16)
+      = sprite_icon('external-link')
     in your Mattermost team with these options:
 %hr
 

app/views/projects/services/mattermost_slash_commands/_help.html.haml

@@ -6,7 +6,7 @@
       = s_("MattermostService|This service allows users to perform common operations on this project by entering slash commands in Mattermost.")
       = link_to help_page_path('user/project/integrations/mattermost_slash_commands.md'), target: '_blank' do
         = _("View documentation")
-        = sprite_icon('external-link', size: 16)
+        = sprite_icon('external-link')
     %p.inline
       = s_("MattermostService|See list of available commands in Mattermost after setting up this service, by entering")
     %kbd.inline /<trigger> help

app/views/projects/services/prometheus/_top.html.haml

@@ -3,7 +3,7 @@
 .row
   .col-lg-12
     .gl-alert.gl-alert-info{ role: 'alert' }
-      = sprite_icon('information-o', size: 16, css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
+      = sprite_icon('information-o', css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
       .gl-alert-body
         = s_('AlertSettings|You can now set up alert endpoints for manually configured Prometheus instances in the Alerts section on the Operations settings page. Alert endpoint fields on this page have been deprecated.')
       .gl-alert-actions

app/views/projects/services/slack/_help.haml

@@ -3,7 +3,7 @@
 
 .info-well
   .well-segment
-    %p= s_('SlackIntegration|This service send notifications about projects\' events to Slack channels. To set up this service:')
+    %p= s_('SlackIntegration|This service sends notifications about project events to Slack channels. To set up this service:')
     %ol
       %li
         = html_escape(s_('SlackIntegration|%{webhooks_link_start}Add an incoming webhook%{webhooks_link_end} in your Slack team. The default channel can be overridden for each event.')) % { webhooks_link_start: webhooks_link_start.html_safe, webhooks_link_end: '</a>'.html_safe }

app/views/projects/services/slack_slash_commands/_help.html.haml

@@ -7,7 +7,7 @@
       = s_("SlackService|This service allows users to perform common operations on this project by entering slash commands in Slack.")
       = link_to help_page_path('user/project/integrations/slack_slash_commands.md'), target: '_blank' do
         = _("View documentation")
-        = sprite_icon('external-link', size: 16)
+        = sprite_icon('external-link')
     %p.inline
       = s_("SlackService|See list of available commands in Slack after setting up this service, by entering")
     %kbd.inline /<command> help
@@ -18,7 +18,7 @@
           1.
           = link_to 'https://my.slack.com/services/new/slash-commands', target: '_blank', rel: 'noreferrer noopener nofollow' do
             Add a slash command
-            = sprite_icon('external-link', size: 16)
+            = sprite_icon('external-link')
           in your Slack team with these options:
 
       %hr

app/views/projects/settings/integrations/show.html.haml

@@ -4,9 +4,9 @@
 
 - if show_webhooks_moved_alert?
   .gl-alert.gl-alert-info.js-webhooks-moved-alert.gl-mt-3{ role: 'alert', data: { feature_id: UserCalloutsHelper::WEBHOOKS_MOVED, dismiss_endpoint: user_callouts_path } }
-    = sprite_icon('information-o', size: 16, css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
+    = sprite_icon('information-o', css_class: 'gl-icon gl-alert-icon gl-alert-icon-no-title')
     %button.js-close.gl-alert-dismiss{ type: 'button', 'aria-label' => _('Dismiss') }
-      = sprite_icon('close', size: 16, css_class: 'gl-icon')
+      = sprite_icon('close', css_class: 'gl-icon')
     .gl-alert-body
       = _('Webhooks have moved. They can now be found under the Settings menu.')
     .gl-alert-actions

app/views/projects/tags/index.html.haml

@@ -27,7 +27,7 @@
         = link_to new_project_tag_path(@project), class: 'btn btn-success new-tag-btn', data: { qa_selector: "new_tag_button" } do
           = s_('TagsPage|New tag')
       = link_to project_tags_path(@project, rss_url_options), title: _("Tags feed"), class: 'btn btn-svg d-none d-sm-inline-block has-tooltip' do
-        = sprite_icon('rss', css_class: 'qa-rss-icon', size: 16)
+        = sprite_icon('rss', css_class: 'qa-rss-icon')
 
   = render_if_exists 'projects/commits/mirror_status'
 

app/views/search/_form.html.haml

@@ -11,7 +11,7 @@
         = search_field_tag :search, params[:search], placeholder: _("Search for projects, issues, etc."), class: "form-control search-text-input js-search-input", id: "dashboard_search", autofocus: true, spellcheck: false
         = icon("search", class: "search-icon")
         %button.search-clear.js-search-clear{ class: ("hidden" if !params[:search].present?), type: "button", tabindex: "-1" }
-          = sprite_icon('clear', size: 16)
+          = sprite_icon('clear')
           %span.sr-only
             = _("Clear search")
     - unless params[:snippets].eql? 'true'

app/views/search/results/_note.html.haml

@@ -4,7 +4,7 @@
 
 .search-result-row
   %h5.note-search-caption.str-truncated
-    = sprite_icon('comment', size: 16, css_class: 'gl-vertical-align-text-bottom')
+    = sprite_icon('comment', css_class: 'gl-vertical-align-text-bottom')
     = link_to_member(project, note.author, avatar: false)
     - link_to_project = link_to(project.full_name, project)
     = _("commented on %{link_to_project}").html_safe % { link_to_project: link_to_project }

app/views/shared/_broadcast_message.html.haml

@@ -3,7 +3,7 @@
 %div{ class: "broadcast-message #{'alert-warning' if is_banner} broadcast-#{message.broadcast_type}-message #{opts[:preview] && 'preview'} js-broadcast-notification-#{message.id} gl-display-flex",
   style: broadcast_message_style(message), dir: 'auto' }
   .flex-grow-1.text-right.pr-2
-    = sprite_icon('bullhorn', size: 16, css_class: 'vertical-align-text-top')
+    = sprite_icon('bullhorn', css_class: 'vertical-align-text-top')
   %div{ class: !fluid_layout && 'container-limited' }
     = render_broadcast_message(message)
   .flex-grow-1.text-right{ style: 'flex-basis: 0' }

app/views/shared/_check_recovery_settings.html.haml

 .gl-alert.gl-alert-warning.js-recovery-settings-callout{ role: 'alert', data: { feature_id: "account_recovery_regular_check", dismiss_endpoint: user_callouts_path, defer_links: "true" } }
   %button.js-close.gl-alert-dismiss.gl-cursor-pointer{ type: 'button', 'aria-label' => _('Dismiss') }
-    = sprite_icon('close', size: 16, css_class: 'gl-icon')
+    = sprite_icon('close', css_class: 'gl-icon')
   .gl-alert-body
     - account_link_start = '<a class="deferred-link" href="%{url}">'.html_safe % { url: profile_account_path }
     = _("Please ensure your account's %{account_link_start}recovery settings%{account_link_end} are up to date.").html_safe % { account_link_start: account_link_start, account_link_end: '</a>'.html_safe }

app/views/shared/_issuable_meta_data.html.haml

@@ -11,15 +11,15 @@
 
 - if upvotes > 0
   %li.issuable-upvotes.d-none.d-sm-block.has-tooltip{ title: _('Upvotes') }
-    = sprite_icon('thumb-up', size: 16, css_class: "vertical-align-middle")
+    = sprite_icon('thumb-up', css_class: "vertical-align-middle")
     = upvotes
 
 - if downvotes > 0
   %li.issuable-downvotes.d-none.d-sm-block.has-tooltip{ title: _('Downvotes') }
-    = sprite_icon('thumb-down', size: 16, css_class: "vertical-align-middle")
+    = sprite_icon('thumb-down', css_class: "vertical-align-middle")
     = downvotes
 
 %li.issuable-comments.d-none.d-sm-block
   = link_to issuable_path, class: ['has-tooltip', ('no-comments' if note_count == 0)], title: _('Comments') do
-    = sprite_icon('comments', size: 16, css_class: 'gl-vertical-align-text-bottom')
+    = sprite_icon('comments', css_class: 'gl-vertical-align-text-bottom')
     = note_count

app/views/shared/_md_preview.html.haml

@@ -2,7 +2,7 @@
 
 - if defined?(@merge_request) && @merge_request.discussion_locked?
   .issuable-note-warning
-    = sprite_icon('lock', size: 16, css_class: 'icon')
+    = sprite_icon('lock', css_class: 'icon')
     %span
       = _('This merge request is locked.')
       = _('Only project members can comment.')

app/views/shared/_new_project_item_select.html.haml

@@ -4,4 +4,4 @@
       = loading_icon(color: 'light')
     = project_select_tag :project_path, class: "project-item-select", data: { include_groups: local_assigns[:include_groups], order_by: 'last_activity_at', relative_path: local_assigns[:path], with_shared: local_assigns[:with_shared], include_projects_in_subgroups: local_assigns[:include_projects_in_subgroups] }, with_feature_enabled: local_assigns[:with_feature_enabled]
     %button.btn.btn-success.new-project-item-select-button.qa-new-project-item-select-button.gl-p-0
-      = sprite_icon('chevron-down', size: 16)
+      = sprite_icon('chevron-down')

app/views/shared/_no_ssh.html.haml

 - if show_no_ssh_key_message?
   %div{ class: 'no-ssh-key-message gl-alert gl-alert-warning', role: 'alert' }
-    = sprite_icon('warning', size: 16, css_class: 'gl-icon s16 gl-alert-icon gl-alert-icon-no-title')
+    = sprite_icon('warning', css_class: 'gl-icon s16 gl-alert-icon gl-alert-icon-no-title')
     %button{ class: 'gl-alert-dismiss hide-no-ssh-message', type: 'button', 'aria-label': _('Dismiss') }
-      = sprite_icon('close', size: 16, css_class: 'gl-icon s16')
+      = sprite_icon('close', css_class: 'gl-icon s16')
     .gl-alert-body
       = s_("MissingSSHKeyWarningLink|You won't be able to pull or push project code via SSH until you add an SSH key to your profile").html_safe
     .gl-alert-actions

app/views/shared/_outdated_browser.html.haml

 - if outdated_browser?
   .gl-alert.gl-alert-danger.outdated-browser{ :role => "alert" }
-    = sprite_icon('error', size: 16, css_class: "gl-alert-icon gl-alert-icon-no-title gl-icon")
+    = sprite_icon('error', css_class: "gl-alert-icon gl-alert-icon-no-title gl-icon")
     .gl-alert-body
       - if browser.ie? && browser.version.to_i == 11
         - feedback_link_url = 'https://gitlab.com/gitlab-org/gitlab/issues/197987'

app/views/shared/_sidebar_toggle_button.html.haml

@@ -4,5 +4,5 @@
   %span.collapse-text= _("Collapse sidebar")
 
 = button_tag class: 'close-nav-button', type: 'button' do
-  = sprite_icon('close', size: 16)
+  = sprite_icon('close')
   %span.collapse-text= _("Close sidebar")

app/views/shared/_zen.html.haml

@@ -16,4 +16,4 @@
   - else
     = text_area_tag attr, current_text, data: { qa_selector: qa_selector }, class: classes, placeholder: placeholder
   %a.zen-control.zen-control-leave.js-zen-leave.gl-text-gray-700{ href: "#" }
-    = sprite_icon('compress', size: 16)
+    = sprite_icon('compress')