Merge branch 'replace-prepend-left-default' into 'master'

Replace prepend-left-default class

See merge request gitlab-org/gitlab!35978

app/assets/javascripts/ide/components/commit_sidebar/empty_state.vue

@@ -12,7 +12,7 @@ export default {
   <div v-if="!lastCommitMsg" class="multi-file-commit-panel-section ide-commit-empty-state">
     <div class="ide-commit-empty-state-container">
       <div class="svg-content svg-80"><img :src="noChangesStateSvgPath" /></div>
-      <div class="append-right-default prepend-left-default">
+      <div class="append-right-default gl-ml-3">
         <div class="text-content text-center">
           <h4>{{ __('No changes') }}</h4>
           <p>{{ __('Edit files in the editor and commit changes here') }}</p>

app/assets/javascripts/ide/components/commit_sidebar/success_message.vue

@@ -13,7 +13,7 @@ export default {
     <div class="svg-content svg-80">
       <img :src="committedStateSvgPath" :alt="s__('IDE|Successful commit')" />
     </div>
-    <div class="append-right-default prepend-left-default">
+    <div class="append-right-default gl-ml-3">
       <div class="text-content text-center">
         <h4>{{ __('All changes are committed') }}</h4>
         <p v-html="lastCommitMsg"></p>

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

@@ -26,9 +26,9 @@ export default {
       :img-src="user.avatar_url"
       :img-size="26"
       :tooltip-text="user.name"
-      class="prepend-left-default js-pipeline-url-user"
+      class="gl-ml-3 js-pipeline-url-user"
     />
-    <span v-else class="prepend-left-default js-pipeline-url-api api">
+    <span v-else class="gl-ml-3 js-pipeline-url-api api">
       {{ s__('Pipelines|API') }}
     </span>
   </div>

app/assets/javascripts/serverless/components/environment_row.vue

@@ -54,7 +54,7 @@ export default {
       <div class="folder-toggle-wrap d-flex align-items-center">
         <item-caret :is-group-open="isOpen" />
       </div>
-      <div class="group-text flex-grow title namespace-title prepend-left-default">
+      <div class="group-text flex-grow title namespace-title gl-ml-3">
         {{ envName }}
       </div>
     </div>

app/assets/javascripts/vue_merge_request_widget/components/mr_widget_pipeline.vue

@@ -126,7 +126,7 @@ export default {
       <div class="add-border ci-status-icon ci-status-icon-failed ci-error js-ci-error">
         <icon :size="24" name="status_failed_borderless" />
       </div>
-      <div class="media-body prepend-left-default" v-html="errorText"></div>
+      <div class="media-body gl-ml-3" v-html="errorText"></div>
     </template>
     <template v-else-if="hasPipeline">
       <a :href="status.details_path" class="align-self-start append-right-default">

app/assets/javascripts/vue_shared/components/file_finder/index.vue

@@ -261,7 +261,7 @@ export default {
             </li>
           </template>
           <li v-else class="dropdown-menu-empty-item">
-            <div class="append-right-default prepend-left-default gl-mt-3 gl-mb-3">
+            <div class="append-right-default gl-ml-3 gl-mt-3 gl-mb-3">
               <template v-if="loading">
                 {{ __('Loading...') }}
               </template>

app/assets/stylesheets/framework/common.scss

@@ -403,7 +403,6 @@ img.emoji {
 .prepend-left-5 { margin-left: 5px; }
 .prepend-left-10 { margin-left: 10px; }
 .prepend-left-15 { margin-left: 15px; }
-.prepend-left-default { margin-left: $gl-padding; }
 .prepend-left-20 { margin-left: 20px; }
 .prepend-left-64 { margin-left: 64px; }
 .append-right-5 { margin-right: 5px; }

app/assets/stylesheets/pages/labels.scss

@@ -134,6 +134,11 @@
   }
 }
 
+.label-description-wrapper {
+  margin-right: 8px;
+  margin-left: 8px;
+}
+
 .prioritized-labels {
   margin-bottom: 30px;
 
@@ -385,7 +390,7 @@
       order: 3;
       width: 100%;
 
-      > .append-right-default.prepend-left-default {
+      > .label-description-wrapper {
         margin-left: 0;
         margin-right: 0;
       }

app/views/profiles/show.html.haml

@@ -31,7 +31,7 @@
       %h5.gl-mt-0= s_("Profiles|Upload new avatar")
       .prepend-top-5.append-bottom-10
         %button.btn.js-choose-user-avatar-button{ type: 'button' }= s_("Profiles|Choose file...")
-        %span.avatar-file-name.prepend-left-default.js-avatar-filename= s_("Profiles|No file chosen")
+        %span.avatar-file-name.gl-ml-3.js-avatar-filename= s_("Profiles|No file chosen")
         = f.file_field_without_bootstrap :avatar, class: 'js-user-avatar-input hidden', accept: 'image/*'
       .form-text.text-muted= s_("Profiles|The maximum file size allowed is 200KB.")
       - if @user.avatar?

app/views/projects/cleanup/_show.html.haml

@@ -20,7 +20,7 @@
             = _("Upload object map")
           %button.btn.btn-default.js-choose-file{ type: "button" }
             = _("Choose a file")
-          %span.prepend-left-default.js-filename
+          %span.gl-ml-3.js-filename
             = _("No file selected")
           = f.file_field :bfg_object_map, class: "hidden js-object-map-input", required: true
         .form-text.text-muted

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

@@ -2,7 +2,7 @@
 - can_create_project = current_user.can?(:create_projects, namespace)
 
 - if forked_project = namespace.find_fork_of(@project)
-  .bordered-box.fork-thumbnail.text-center.prepend-left-default.append-right-default.gl-mt-3.gl-mb-3.forked
+  .bordered-box.fork-thumbnail.text-center.gl-ml-3.append-right-default.gl-mt-3.gl-mb-3.forked
     = link_to project_path(forked_project) do
       - if /no_((\w*)_)*avatar/.match(avatar)
         = group_icon(namespace, class: "avatar rect-avatar s100 identicon mx-auto")
@@ -12,7 +12,7 @@
       %h5.gl-mt-3
         = namespace.human_name
 - else
-  .bordered-box.fork-thumbnail.text-center.prepend-left-default.append-right-default.gl-mt-3.gl-mb-3{ class: ("disabled" unless can_create_project) }
+  .bordered-box.fork-thumbnail.text-center.gl-ml-3.append-right-default.gl-mt-3.gl-mb-3{ class: ("disabled" unless can_create_project) }
     = link_to project_forks_path(@project, namespace_key: namespace.id),
         method: "POST",
         class: ("disabled has-tooltip" unless can_create_project),

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

@@ -9,7 +9,7 @@
   .col-lg-9
     - if @namespaces.present?
       .fork-thumbnail-container.js-fork-content
-        %h5.gl-mt-0.gl-mb-0.prepend-left-default.append-right-default
+        %h5.gl-mt-0.gl-mb-0.gl-ml-3.append-right-default
           = _("Select a namespace to fork the project")
         - @namespaces.each do |namespace|
           = render 'fork_button', namespace: namespace

app/views/shared/_label_row.html.haml

@@ -6,7 +6,7 @@
 .label-name
   = render_label(label, tooltip: false)
 .label-description
-  .append-right-default.prepend-left-default
+  .label-description-wrapper
     - if label.description.present?
       .description-text
         = markdown_field(label, :description)

ee/app/assets/javascripts/packages/details/components/installation_tabs.vue

@@ -23,12 +23,12 @@ export default {
   <div class="gl-mb-3">
     <gl-tabs @input="trackInstallationTabChange">
       <gl-tab :title="s__('PackageRegistry|Installation')" title-item-class="js-installation-tab">
-        <div class="prepend-left-default append-right-default">
+        <div class="gl-ml-3 append-right-default">
           <slot name="installation"></slot>
         </div>
       </gl-tab>
       <gl-tab :title="s__('PackageRegistry|Registry Setup')" title-item-class="js-setup-tab">
-        <div class="prepend-left-default append-right-default">
+        <div class="gl-ml-3 append-right-default">
           <slot name="setup"></slot>
         </div>
       </gl-tab>

ee/app/assets/javascripts/subscriptions/new/components/order_summary.vue

@@ -42,7 +42,7 @@ export default {
             <gl-icon v-else name="chevron-down" :size="18" />
             <div>{{ titleWithName }}</div>
           </div>
-          <div class="prepend-left-default">{{ formatAmount(totalAmount, usersPresent) }}</div>
+          <div class="gl-ml-3">{{ formatAmount(totalAmount, usersPresent) }}</div>
         </h4>
       </div>
       <summary-details v-show="!collapsed" />

ee/app/views/projects/issues/_service_desk_info_content.html.haml

@@ -11,7 +11,7 @@
     .svg-content
       = render svg_path
 
-    %div{ class: is_empty_state ? "text-content" : "prepend-top-10 prepend-left-default" }
+    %div{ class: is_empty_state ? "text-content" : "prepend-top-10 gl-ml-3" }
       - if is_empty_state
         %h4= title_text
       - else