Add grab cursor for ops dashboard cards
What does this MR do?
This MR is for issue: #37001 (closed)
When the user hovers over a dashboard card in the operations screen, we want to show a grab icon which lets the user know the dashboard card is draggable/order-able.
We do this by creating a small utility class which can be re-used in the future: .cursor-grab
and applying it to the dashboard cards in a utlity driven fashion as outlined by the Gitlab style guide here
We create this class as it encapsulates a very clear purpose which can be re-used.
My only question is: Is it okay to have created this ultiity class inside common.scss?
I can see from the style guide this is the old
utility style-sheet but to me it made sense to group the cursor utility class here with the previously existing ones i.e. .cursor-pointer
UPDATE
CSS utility created in gitlab/ui
to support this action and not add any extra bloat to the GitLab project!
Screenshots
Before | After | After With Link | After With Link Hover |
---|---|---|---|
Does this MR meet the acceptance criteria?
Conformity
-
Changelog entry -
Documentation (if required) -
Code review guidelines -
Merge request performance guidelines -
Style guides -
Database guides -
Separation of EE specific content
Availability and Testing
Test case added in: ee/spec/javascripts/operations/components/dashboard/project_spec.js
to ensure the utility class is applied.
-
Review and add/update tests for this feature/bug. Consider all test levels. See the Test Planning Process. -
Tested in all supported browsers -
Informed Infrastructure department of a default or new setting change, if applicable per definition of done
Security
If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:
-
Label as security and @ mention @gitlab-com/gl-security/appsec
-
The MR includes necessary changes to maintain consistency between UI, API, email, or other methods -
Security reports checked/validated by a reviewer from the AppSec team