diff --git a/app/assets/javascripts/boards/components/board_card.vue b/app/assets/javascripts/boards/components/board_card.vue
index 563bed6a6b850a4b3eb9836924a7bf1ca8335b46..dc821cb9f58d0f1868ce2386673563bbd460ed86 100644
--- a/app/assets/javascripts/boards/components/board_card.vue
+++ b/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,
diff --git a/app/assets/javascripts/boards/components/board_list_header.vue b/app/assets/javascripts/boards/components/board_list_header.vue
index 19004518edf3378c90be8af5921e796c54b36898..6835d83a66c84969afe560c5c998f87f324ed04a 100644
--- a/app/assets/javascripts/boards/components/board_list_header.vue
+++ b/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,
diff --git a/app/assets/javascripts/related_issues/components/related_issues_list.vue b/app/assets/javascripts/related_issues/components/related_issues_list.vue
index 5813865524197e641a29db6727df3a5a85fc10d1..8b39851405edd2db538bd60a197c683c4dcc4112 100644
--- a/app/assets/javascripts/related_issues/components/related_issues_list.vue
+++ b/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,
}"
diff --git a/app/assets/stylesheets/page_bundles/boards.scss b/app/assets/stylesheets/page_bundles/boards.scss
index d4c59a6ab0c01213a405d9a64f3d328d13c174d9..f91ca489bdf183c63957f5631d18d7d6e3201a97 100644
--- a/app/assets/stylesheets/page_bundles/boards.scss
+++ b/app/assets/stylesheets/page_bundles/boards.scss
@@ -1,9 +1,5 @@
@import 'mixins_and_variables_and_functions';
-.user-can-drag {
- cursor: grab;
-}
-
.is-ghost {
opacity: 0.3;
pointer-events: none;
diff --git a/app/assets/stylesheets/page_bundles/issues_list.scss b/app/assets/stylesheets/page_bundles/issues_list.scss
index 8a958bdf0c5750cc1bbef47c88131ccf23f5c7fe..41515a98e0a6e40705d44850f81d7a3c40f32208 100644
--- a/app/assets/stylesheets/page_bundles/issues_list.scss
+++ b/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;
diff --git a/app/helpers/issues_helper.rb b/app/helpers/issues_helper.rb
index b1a5e4068cc35e0e7d1ba067a53e1e89a7fe45b5..5aa2aca37f3308fd36a5c460695472d1bbca4a3f 100644
--- a/app/helpers/issues_helper.rb
+++ b/app/helpers/issues_helper.rb
@@ -7,7 +7,7 @@ def issue_css_classes(issue)
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
diff --git a/ee/app/assets/javascripts/related_items_tree/components/tree_item_body.vue b/ee/app/assets/javascripts/related_items_tree/components/tree_item_body.vue
index b3259332e7b2f9037594b44acac458db283c0f26..eb964231581edb1bda0e85565c660039f42c8975 100644
--- a/ee/app/assets/javascripts/related_items_tree/components/tree_item_body.vue
+++ b/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">
diff --git a/ee/app/assets/stylesheets/pages/issuable.scss b/ee/app/assets/stylesheets/pages/issuable.scss
index ff77705e80ca23c8c1d0be50050873a5d8362fcd..0e3f6ce761bd0d28877010a27b53c6bb191206bc 100644
--- a/ee/app/assets/stylesheets/pages/issuable.scss
+++ b/ee/app/assets/stylesheets/pages/issuable.scss
@@ -73,10 +73,6 @@
}
}
-.issuable-tag-valign {
- vertical-align: 1px;
-}
-
.issuable-assignees {
a:not(.btn) {
color: inherit;
diff --git a/spec/features/boards/boards_spec.rb b/spec/features/boards/boards_spec.rb
index 2f21961d1fca9e485e1cd9d88550867309362919..d25cddea9028ff8f5c30060fa8e7ce351fc83c57 100644
--- a/spec/features/boards/boards_spec.rb
+++ b/spec/features/boards/boards_spec.rb
@@ -528,7 +528,7 @@
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
diff --git a/spec/features/groups/issues_spec.rb b/spec/features/groups/issues_spec.rb
index 1bac1bcdf5ad8fb0d3be51b0acd77530a3323593..3fc1484826c4d8bc3b313880ba6b92decab8a8ac 100644
--- a/spec/features/groups/issues_spec.rb
+++ b/spec/features/groups/issues_spec.rb
@@ -156,10 +156,10 @@
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
diff --git a/spec/frontend/boards/components/board_card_spec.js b/spec/frontend/boards/components/board_card_spec.js
index 5742dfdc5d2cdaa19c5a5504463f7db4591bf2d5..3af173aa18c1ab58d651af1501875d42a41fbdb5 100644
--- a/spec/frontend/boards/components/board_card_spec.js
+++ b/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');
});
});
});
diff --git a/spec/frontend/boards/components/board_list_header_spec.js b/spec/frontend/boards/components/board_list_header_spec.js
index 148d0c5684de2b31f382aa869416d7686c1be15d..8cc0ad5f30cfa55f7d09a27492cf3c210387b54f 100644
--- a/spec/frontend/boards/components/board_list_header_spec.js
+++ b/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');
});
});
});