Skip to content

Commit 548ae3e

Browse files
authored
Make commit-statuses popup show correctly (#17447) (#17466)
Backport #17447 Close #17443
1 parent 2c383d8 commit 548ae3e

File tree

2 files changed

+19
-3
lines changed

2 files changed

+19
-3
lines changed

web_src/js/index.js

+4-1
Original file line numberDiff line numberDiff line change
@@ -788,10 +788,13 @@ async function initRepository() {
788788

789789
// Commit statuses
790790
$('.commit-statuses-trigger').each(function () {
791+
const positionRight = $('.repository.file.list').length > 0 || $('.repository.diff').length > 0;
792+
const popupPosition = positionRight ? 'right center' : 'left center';
791793
$(this)
792794
.popup({
793795
on: 'click',
794-
position: ($('.repository.file.list').length > 0 ? 'right center' : 'left center'),
796+
lastResort: popupPosition, // prevent error message "Popup does not fit within the boundaries of the viewport"
797+
position: popupPosition,
795798
});
796799
});
797800

web_src/less/_repository.less

+15-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,19 @@
11
.repository {
2-
.commit-statuses .list > .item {
3-
line-height: 2;
2+
.popup.commit-statuses {
3+
// we had better limit the max size of the popup, and add scroll bars if the content size is too large.
4+
// otherwise some part of the popup will be hidden by viewport boundary
5+
max-height: 45vh;
6+
max-width: 60vw;
7+
overflow: auto;
8+
padding: 0;
9+
10+
.list {
11+
padding: .8em; // to make the scrollbar align to the border, we move the padding from outer `.popup` to this inside `.list`
12+
13+
> .item {
14+
line-height: 2;
15+
}
16+
}
417
}
518

619
.repo-header {

0 commit comments

Comments
 (0)