Standalone finding modal: Minor UX tweaks
What does this MR do and why?
Addresses a few UX tweeks around the standalone security finding modal:
- Increases padding of modal to make it consistent with other modals (work-items for example)
- Fixes a layout issue that affects the spacing between the footer buttons
- Makes the pressing the "esc" key close the comment text-area when it is focused, rather than closing the whole modal
- Various other small fixes
Screenshots or screen recordings
| description | before | after |
|---|---|---|
| padding |  |
 |
| buttons | |
 |
| "esc" when commenting | Screen_Recording_2023-04-14_at_2.38.17_pm | Screen_Recording_2023-04-14_at_2.36.34_pm |
How to set up and validate locally
- Have the related FF enabled:
echo "Feature.enable(:pipeline_security_dashboard_graphql)" | rails c - You'll need an EE License
- You'll need to have runners enabled (See $2408961 for setting up a runner)
- Import https://gitlab.com/gitlab-examples/security/security-reports
- Run a pipeline on master
- Go to the pipeline page
- Click on a finding and validate that:
- The padding has increased
- The footer buttons are evenly spaced
- When adding a dismissal comment the "Esc" button first closes the comment area and then the modal
- When the comment text-area is not focused the modal should close itself
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Edited by David Pisek