Fixes tooltips in mini pipeline graph
What does this MR do?
Fixes 2 different problems:
1. First one - with big pipelines with a lot of stages, when the user hovered the last one, it break the line. This was fixed sometime ago already, we must have changed the CSS again, we need to keep an eye on it ;)
2. Second one - Tooltips! We where applying a bootstrap "hack" in the wrong place. Bootstrap documentation says:
Multiple-line links Sometimes you want to add a tooltip to a hyperlink that wraps multiple lines. The default behavior of the tooltip plugin is to center it horizontally and vertically. Add white-space: nowrap; to your anchors to avoid this.
We were doing this in .tooltip
instead of doing this in the a
element.
Problem of doing this in the right element: it won't work for buttons. button, a {white-space: nowrap;}
.
We could transform the stage dropdowns into <a>
instead of buttons, but that will result in:
button | a |
---|---|
(Not sure if it's because it's a dropdown..)
The solution of this MR, sets a min-width in the button's tooltips resulting in:
Screenshots (if relevant)
Before | After |
---|---|
Does this MR meet the acceptance criteria?
-
Changelog entry added -
Documentation created/updated -
API support added - Tests
-
Added for this feature/bug -
All builds are passing
-
-
Conform by the merge request performance guides -
Conform by the style guides -
Branch has no merge conflicts with master
(if it does - rebase it please) -
Squashed related commits together
What are the relevant issue numbers?
Closes #27963 (closed) Closes #28008 (closed)