Merge branch 'cngo-delete-css' into 'master'

Remove issuable-tag-valign and user-can-drag classes

See merge request gitlab-org/gitlab!77890

app/assets/javascripts/boards/components/board_card.vue

@@ -72,7 +72,7 @@ export default {
     data-qa-selector="board_card"
     :class="{
       'multi-select': multiSelectVisible,
-      'user-can-drag': isDraggable,
+      'gl-cursor-grab': isDraggable,
       'is-disabled': isDisabled,
       'is-active': isActive,
       'gl-cursor-not-allowed gl-bg-gray-10': item.isLoading,

app/assets/javascripts/boards/components/board_list_header.vue

@@ -263,7 +263,7 @@ export default {
   >
     <h3
       :class="{
-        'user-can-drag': userCanDrag,
+        'gl-cursor-grab': userCanDrag,
         'gl-py-3 gl-h-full': list.collapsed && !isSwimlanesHeader,
         'gl-border-b-0': list.collapsed || isSwimlanesHeader,
         'gl-py-2': list.collapsed && isSwimlanesHeader,

app/assets/javascripts/related_issues/components/related_issues_list.vue

@@ -110,7 +110,7 @@ export default {
           v-for="issue in relatedIssues"
           :key="issue.id"
           :class="{
-            'user-can-drag': canReorder,
+            'gl-cursor-grab': canReorder,
             'sortable-row': canReorder,
             'card card-slim': canReorder,
           }"

app/assets/stylesheets/page_bundles/boards.scss

 @import 'mixins_and_variables_and_functions';
 
-.user-can-drag {
-  cursor: grab;
-}
-
 .is-ghost {
   opacity: 0.3;
   pointer-events: none;

app/assets/stylesheets/page_bundles/issues_list.scss

@@ -35,10 +35,6 @@
   }
 }
 
-.user-can-drag {
-  cursor: grab;
-}
-
 .is-ghost {
   opacity: 0.3;
   pointer-events: none;

app/helpers/issues_helper.rb

@@ -7,7 +7,7 @@ module IssuesHelper
     classes = ["issue"]
     classes << "closed" if issue.closed?
     classes << "today" if issue.new?
-    classes << "user-can-drag" if @sort == 'relative_position'
+    classes << "gl-cursor-grab" if @sort == 'relative_position'
     classes.join(' ')
   end
 

ee/app/assets/javascripts/related_items_tree/components/tree_item_body.vue

@@ -320,13 +320,13 @@ export default {
               v-if="showEpicHealthStatus"
               :health-status="item.healthStatus"
               data-testid="epic-health-status"
-              class="issuable-tag-valign gl-mr-5 gl-mb-3"
+              class="gl-mr-5 gl-mb-3"
             />
             <issue-health-status
               v-if="showIssueHealthStatus"
               :health-status="item.healthStatus"
               data-testid="issue-health-status"
-              class="issuable-tag-valign gl-mr-5 gl-mb-3"
+              class="gl-mr-5 gl-mb-3"
             />
 
             <template v-if="showLabels">

ee/app/assets/stylesheets/pages/issuable.scss

@@ -73,10 +73,6 @@
   }
 }
 
-.issuable-tag-valign {
-  vertical-align: 1px;
-}
-
 .issuable-assignees {
   a:not(.btn) {
     color: inherit;

spec/features/boards/boards_spec.rb

@@ -528,7 +528,7 @@ RSpec.describe 'Project issue boards', :js do
     end
 
     it 'does not allow dragging' do
-      expect(page).not_to have_selector('.user-can-drag')
+      expect(page).not_to have_selector('.gl-cursor-grab')
     end
   end
 

spec/features/groups/issues_spec.rb

@@ -156,10 +156,10 @@ RSpec.describe 'Group issues page' do
       expect(page).to have_selector('.manual-ordering')
     end
 
-    it 'each issue item has a user-can-drag css applied' do
+    it 'each issue item has a gl-cursor-grab css applied' do
       visit issues_group_path(group, sort: 'relative_position')
 
-      expect(page).to have_selector('.issue.user-can-drag', count: 3)
+      expect(page).to have_selector('.issue.gl-cursor-grab', count: 3)
     end
 
     it 'issues should be draggable and persist order' do

spec/frontend/boards/components/board_card_spec.js

@@ -167,7 +167,7 @@ describe('Board card', () => {
       mountComponent({ item: { ...mockIssue, isLoading: true } });
 
       expect(wrapper.classes()).toContain('is-disabled');
-      expect(wrapper.classes()).not.toContain('user-can-drag');
+      expect(wrapper.classes()).not.toContain('gl-cursor-grab');
     });
   });
 
@@ -177,7 +177,7 @@ describe('Board card', () => {
       mountComponent();
 
       expect(wrapper.classes()).not.toContain('is-disabled');
-      expect(wrapper.classes()).toContain('user-can-drag');
+      expect(wrapper.classes()).toContain('gl-cursor-grab');
     });
   });
 });

spec/frontend/boards/components/board_list_header_spec.js

@@ -180,18 +180,18 @@ describe('Board List Header Component', () => {
     const canDragList = [ListType.label, ListType.milestone, ListType.iteration, ListType.assignee];
 
     it.each(cannotDragList)(
-      'does not have user-can-drag-class so user cannot drag list',
+      'does not have gl-cursor-grab class so user cannot drag list',
       (listType) => {
         createComponent({ listType });
 
-        expect(findTitle().classes()).not.toContain('user-can-drag');
+        expect(findTitle().classes()).not.toContain('gl-cursor-grab');
       },
     );
 
-    it.each(canDragList)('has user-can-drag-class so user can drag list', (listType) => {
+    it.each(canDragList)('has gl-cursor-grab class so user can drag list', (listType) => {
       createComponent({ listType });
 
-      expect(findTitle().classes()).toContain('user-can-drag');
+      expect(findTitle().classes()).toContain('gl-cursor-grab');
     });
   });
 });