Projects dropdown is misaligned on issue boards page
What does this MR do?
This MR fixes the following three layout issues on the issue board:
1. Popup alignment
before
after
The main problem here was the fixed height calculation and overflow:hidden
style in .board-list-component
. The suggested solution is based on flex-box to proper resize the available space without the need of overflow:hidden
. This allows the popup to proper size and place itself.
2. Overflow handling in Project Dropdown
before
after
The content part of the projects popup has a to large max-height:
property set in general. In that particular case the max-height:
property is forced to a smaller value to avoid overflows. It would be nice to switch to flexbox in general in that area. The layout strategy is very confusing because of lots of height and with calculations. This is kind a workaround but common practice in that scss file.
3. Overflow handling in Empty State list
before
after
Switched to flexbox to allow a proper overflow handling.
What are the relevant issue numbers?
Closes #54920 (closed) Closes #48682 (closed)
Does this MR meet the acceptance criteria?
-
Changelog entry added, if necessary -
Documentation created/updated -
Tests added for this feature/bug -
Tested in all supported browsers -
Conforms to the code review guidelines -
Conforms to the merge request performance guidelines -
Conforms to the style guides -
Conforms to the database guides -
Link to e2e tests MR added if this MR has Requires e2e tests label. See the Test Planning Process. -
Security reports checked/validated by reviewer