Align help icon for code quality MR widget
What does this MR do?
Related to #283892 (closed)
Fixes the alignment for the help icon in merge request report widgets.
Screenshots (strongly suggested)
The change is subtle, but notice in the before screenshot that the SVG had 1 extra pixel on top that was pushing it down. This is primarily due to how the help_popover.vue
component is set up; it wraps the popover and the SVG in a span since there can only be one root component. This causes the popover to force a single pixel above the SVG, but can be fixed by making the component display: inline-flex
.
Before | After |
---|---|
![]() |
![]() |
I also changed the text to be wrapped in a p
tag so that it can be forced to the proper line height. Without this, the line height was 17px
, but now it is forced to 16px
. This forced me to add the the proper flex classes to the wrapper around the text and the popover button to make sure everything lined up properly.
Does this MR meet the acceptance criteria?
Conformity
-
📋 Does this MR need a changelog?- [] I have included a changelog entry.
-
I have not included a changelog entry because _____.
- [-] Documentation (if required)
- [] Code review guidelines
-
Merge request performance guidelines - [-] Style guides
- [-] Database guides
- [-] Separation of EE specific content
Availability and Testing
- [-] 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
Merge request reports
Activity
changed milestone to %13.12
1 Warning ⚠ You've made some app changes, but didn't add any tests.
That's OK as long as you're refactoring existing code,
but please consider adding any of the tooling, ~"tooling::pipelines", ~"tooling::workflow", documentation, QA labels.Reviewer roulette
Changes that require review have been detected! A merge request is normally reviewed by both a reviewer and a maintainer in its primary category (e.g. frontend or backend), and by a maintainer in all other categories.
To spread load more evenly across eligible reviewers, Danger has picked a candidate for each review slot, based on their timezone. Feel free to override these selections if you think someone else would be better-suited or use the GitLab Review Workload Dashboard to find other available reviewers.
To read more on how to use the reviewer roulette, please take a look at the Engineering workflow and code review guidelines. Please consider assigning a reviewer or maintainer who is a domain expert in the area of the merge request.
Once you've decided who will review this merge request, assign them as a reviewer! Danger does not automatically notify them for you.
Category Reviewer Maintainer frontend Jeremy Jackson ( @jejacks0n
) (UTC-6, 1 hour ahead of@shampton
)Tim Zallmann ( @timzallmann
) (UTC+2, 9 hours ahead of@shampton
)If needed, you can retry the
danger-review
job that generated this comment.Generated by
🚫 DangerEdited by 🤖 GitLab Bot 🤖- Resolved by Jose Ivan Vargas
@f_caplette can you review this small MR for me?
requested review from @f_caplette
removed workflowready for development label
removed [deprecated] Accepting merge requests label
requested review from @jivanvl
This looks good to me! Thanks @shampton
enabled an automatic merge when the pipeline for 3c7fdbad succeeds
mentioned in commit f5da36ab
added workflowstaging label
added workflowcanary label and removed workflowstaging label
added workflowproduction label and removed workflowcanary label
added releasedcandidate label