Fix sticky diff stats container (#12002)
* Fix sticky diff stats container * Use pure CSS sticky instead of Fomantic's JS * add border color to arc-green * add slight padding on sides * make linter happy Co-authored-by: techknowlogick <techknowlogick@gitea.io>
This commit is contained in:
parent
fc2f2c7602
commit
daf62841f6
|
@ -52,7 +52,6 @@
|
||||||
"segment",
|
"segment",
|
||||||
"sidebar",
|
"sidebar",
|
||||||
"site",
|
"site",
|
||||||
"sticky",
|
|
||||||
"tab",
|
"tab",
|
||||||
"table",
|
"table",
|
||||||
"text",
|
"text",
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{{if .DiffNotAvailable}}
|
{{if .DiffNotAvailable}}
|
||||||
<div class="diff-detail-box diff-box ui sticky">
|
<div class="diff-detail-box diff-box sticky">
|
||||||
<div>
|
<div>
|
||||||
<div class="ui right">
|
<div class="ui right">
|
||||||
{{if .PageIsPullFiles}}
|
{{if .PageIsPullFiles}}
|
||||||
|
@ -17,7 +17,7 @@
|
||||||
<h4>{{.i18n.Tr "repo.diff.data_not_available"}}</h4>
|
<h4>{{.i18n.Tr "repo.diff.data_not_available"}}</h4>
|
||||||
{{else}}
|
{{else}}
|
||||||
<div>
|
<div>
|
||||||
<div class="diff-detail-box diff-box ui sticky">
|
<div class="diff-detail-box diff-box sticky">
|
||||||
<i class="fa fa-retweet"></i>
|
<i class="fa fa-retweet"></i>
|
||||||
{{.i18n.Tr "repo.diff.stats_desc" .Diff.NumFiles .Diff.TotalAddition .Diff.TotalDeletion | Str2html}}
|
{{.i18n.Tr "repo.diff.stats_desc" .Diff.NumFiles .Diff.TotalAddition .Diff.TotalDeletion | Str2html}}
|
||||||
<div class="ui right">
|
<div class="ui right">
|
||||||
|
@ -192,7 +192,7 @@
|
||||||
<td class="add-comment-right">
|
<td class="add-comment-right">
|
||||||
{{if and $resolved (eq $line.GetCommentSide "proposed")}}
|
{{if and $resolved (eq $line.GetCommentSide "proposed")}}
|
||||||
<div class="ui top attached header">
|
<div class="ui top attached header">
|
||||||
<span class="ui grey text left"><b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}}</span>
|
<span class="ui grey text left"><b>{{$resolveDoer.Name}}</b> {{$.i18n.Tr "repo.issues.review.resolved_by"}}</span>
|
||||||
<button id="show-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="ui compact right labeled button show-outdated">
|
<button id="show-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="ui compact right labeled button show-outdated">
|
||||||
{{svg "octicon-unfold" 16}}
|
{{svg "octicon-unfold" 16}}
|
||||||
{{$.i18n.Tr "repo.issues.review.show_resolved"}}
|
{{$.i18n.Tr "repo.issues.review.show_resolved"}}
|
||||||
|
@ -200,7 +200,7 @@
|
||||||
<button id="hide-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="hide ui compact right labeled button hide-outdated">
|
<button id="hide-outdated-{{(index $line.Comments 0).ID}}" data-comment="{{(index $line.Comments 0).ID}}" class="hide ui compact right labeled button hide-outdated">
|
||||||
{{svg "octicon-fold" 16}}
|
{{svg "octicon-fold" 16}}
|
||||||
{{$.i18n.Tr "repo.issues.review.hide_resolved"}}
|
{{$.i18n.Tr "repo.issues.review.hide_resolved"}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
{{end}}
|
{{end}}
|
||||||
{{if eq $line.GetCommentSide "proposed"}}
|
{{if eq $line.GetCommentSide "proposed"}}
|
||||||
|
|
|
@ -1204,8 +1204,6 @@ function initPullRequestReview() {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
$('.diff-detail-box.ui.sticky').sticky();
|
|
||||||
|
|
||||||
$('.btn-review').on('click', function (e) {
|
$('.btn-review').on('click', function (e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
$(this).closest('.dropdown').find('.menu').toggle('visible');
|
$(this).closest('.dropdown').find('.menu').toggle('visible');
|
||||||
|
@ -2042,7 +2040,6 @@ function initCodeView() {
|
||||||
$.get(`${$blob.data('url')}?${$blob.data('query')}&anchor=${$blob.data('anchor')}`, (blob) => {
|
$.get(`${$blob.data('url')}?${$blob.data('query')}&anchor=${$blob.data('anchor')}`, (blob) => {
|
||||||
$row.replaceWith(blob);
|
$row.replaceWith(blob);
|
||||||
$(`[data-anchor="${$blob.data('anchor')}"]`).on('click', (e) => { insertBlobExcerpt(e) });
|
$(`[data-anchor="${$blob.data('anchor')}"]`).on('click', (e) => { insertBlobExcerpt(e) });
|
||||||
$('.diff-detail-box.ui.sticky').sticky();
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
$('.ui.blob-excerpt').on('click', (e) => { insertBlobExcerpt(e) });
|
$('.ui.blob-excerpt').on('click', (e) => { insertBlobExcerpt(e) });
|
||||||
|
|
|
@ -1567,6 +1567,16 @@
|
||||||
background: #ffffff;
|
background: #ffffff;
|
||||||
line-height: 30px;
|
line-height: 30px;
|
||||||
|
|
||||||
|
&.sticky {
|
||||||
|
position: sticky;
|
||||||
|
top: 0;
|
||||||
|
z-index: 800;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #d4d4d5;
|
||||||
|
padding-left: 5px;
|
||||||
|
padding-right: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
> div:after {
|
> div:after {
|
||||||
clear: both;
|
clear: both;
|
||||||
content: "";
|
content: "";
|
||||||
|
|
|
@ -1335,6 +1335,10 @@ a.ui.labels .label:hover {
|
||||||
.detail-files {
|
.detail-files {
|
||||||
background-color: inherit;
|
background-color: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.sticky {
|
||||||
|
border-bottom-color: rgba(255, 255, 255, .1);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.comment-code-cloud {
|
.comment-code-cloud {
|
||||||
|
|
Loading…
Reference in New Issue