mirror of https://github.com/go-gitea/gitea.git
Review fixes and enhancements (#24526)
- Fix regression with icons wrapping from https://github.com/go-gitea/gitea/pull/24459 - Fix box misalignment on small screen - Fix avatar misalignment on review comment - Fix incorrect underline hover effect on review icons - Move status icon to left side in review box - Enhance review icon colors, add helper function for it - Add missing inline avatars in review comments - Tweak icon sizes because some octicons have inconsistent sizing ### Before <img width="655" alt="Screenshot 2023-05-04 at 20 50 28" src="https://user-images.githubusercontent.com/115237/236301230-92325507-6e03-47ac-bfb4-c9ddde310571.png"> <img width="260" alt="Screenshot 2023-05-04 at 20 50 42" src="https://user-images.githubusercontent.com/115237/236301236-0dfa50e7-b8fc-4179-ae68-d872bc90f1f3.png"> ### After <img width="498" alt="Screenshot 2023-05-04 at 20 55 08" src="https://user-images.githubusercontent.com/115237/236301810-23862c2c-c0a9-43a4-a3eb-ee611c14a7f4.png"> <img width="219" alt="Screenshot 2023-05-04 at 20 55 16" src="https://user-images.githubusercontent.com/115237/236301817-d0de02ea-6ab5-43e1-9183-6b3848b72995.png"> --------- Co-authored-by: Giteabot <teabot@gitea.io>
This commit is contained in:
silverwind
GitHub
parent
8bbbf7e6b8
commit
ae0fa64ef6
|
|
@ -189,6 +189,20 @@ func (r *Review) LoadAttributes(ctx context.Context) (err error) {
|
|||
return err
|
||||
}
|
||||
|
||||
func (r *Review) HTMLTypeColorName() string {
|
||||
switch r.Type {
|
||||
case ReviewTypeApprove:
|
||||
return "green"
|
||||
case ReviewTypeComment:
|
||||
return "grey"
|
||||
case ReviewTypeReject:
|
||||
return "red"
|
||||
case ReviewTypeRequest:
|
||||
return "yellow"
|
||||
}
|
||||
return "grey"
|
||||
}
|
||||
|
||||
// GetReviewByID returns the review by the given ID
|
||||
func GetReviewByID(ctx context.Context, id int64) (*Review, error) {
|
||||
review := new(Review)
|
||||
|
|
|
|||
|
|
@ -372,7 +372,10 @@
|
|||
<div class="timeline-item event">
|
||||
{{if .OriginalAuthor}}
|
||||
{{else}}
|
||||
<a class="timeline-avatar"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>
|
||||
{{/* Some timeline avatars need a offset to correctly allign with their speech
|
||||
bubble. The condition depends on review type and for positive reviews whether
|
||||
there is a comment element or not */}}
|
||||
<a class="timeline-avatar{{if or (and (eq .Review.Type 1) (or .Content .Attachments)) (eq .Review.Type 2) (eq .Review.Type 3)}} timeline-avatar-offset{{end}}"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>
|
||||
{{avatar $.Context .Poster}}
|
||||
</a>
|
||||
{{end}}
|
||||
|
|
@ -408,6 +411,11 @@
|
|||
<div class="content comment-container">
|
||||
<div class="ui top attached header comment-header gt-df gt-ac gt-sb">
|
||||
<div class="comment-header-left gt-df gt-ac">
|
||||
{{if gt .Poster.ID 0}}
|
||||
<a class="inline-timeline-avatar" href="{{.Poster.HomeLink}}">
|
||||
{{avatar $.Context .Poster}}
|
||||
</a>
|
||||
{{end}}
|
||||
<span class="text grey muted-links">
|
||||
{{if .OriginalAuthor}}
|
||||
<span class="text black gt-bold">
|
||||
|
|
@ -763,6 +771,7 @@
|
|||
<img src="{{.Poster.AvatarLink $.Context}}">
|
||||
</a>
|
||||
<span class="badge grey">{{svg "octicon-x" 16}}</span>
|
||||
{{template "shared/user/avatarlink" dict "Context" $.Context "user" .Poster}}
|
||||
<span class="text grey muted-links">
|
||||
{{template "shared/user/authorlink" .Poster}}
|
||||
{{$reviewerName := ""}}
|
||||
|
|
@ -777,7 +786,12 @@
|
|||
{{if .Content}}
|
||||
<div class="timeline-item comment">
|
||||
<div class="content">
|
||||
<div class="ui top attached header arrow-top">
|
||||
<div class="ui top attached header comment-header-left gt-df gt-ac arrow-top">
|
||||
{{if gt .Poster.ID 0}}
|
||||
<a class="inline-timeline-avatar" href="{{.Poster.HomeLink}}">
|
||||
{{avatar $.Context .Poster}}
|
||||
</a>
|
||||
{{end}}
|
||||
<span class="text grey muted-links">
|
||||
{{$.locale.Tr "action.review_dismissed_reason"}}
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{{if or .PullReviewers .OriginalReviews}}
|
||||
<div class="comment box">
|
||||
<div class="comment box timeline-item gt-pt-3 gt-pb-0">
|
||||
<div class="content">
|
||||
<div class="ui segment">
|
||||
<h4>{{$.locale.Tr "repo.issues.review.reviewers"}}</h4>
|
||||
|
|
@ -8,9 +8,12 @@
|
|||
<div class="ui divider"></div>
|
||||
<div class="review-item">
|
||||
<div class="review-item-left">
|
||||
<span class="gt-mr-3 text {{.Review.HTMLTypeColorName}}">
|
||||
{{svg (printf "octicon-%s" .Review.Type.Icon)}}
|
||||
</span>
|
||||
{{if .User}}
|
||||
<a href="{{.User.HomeLink}}">
|
||||
{{avatar $.Context .User}}
|
||||
{{avatar $.Context .User 20}}
|
||||
</a>
|
||||
{{end}}
|
||||
<span class="gt-ml-2">
|
||||
|
|
@ -34,13 +37,13 @@
|
|||
</div>
|
||||
<div class="review-item-right">
|
||||
{{if .Review.Stale}}
|
||||
<span class="ui type-icon text grey" data-tooltip-content="{{$.locale.Tr "repo.issues.is_stale"}}">
|
||||
<span class="ui text grey" data-tooltip-content="{{$.locale.Tr "repo.issues.is_stale"}}">
|
||||
{{svg "octicon-hourglass" 16 "icon"}}
|
||||
</span>
|
||||
{{end}}
|
||||
{{if (and $.Permission.IsAdmin (or (eq .Review.Type 1) (eq .Review.Type 3)) (not $.Issue.IsClosed))}}
|
||||
<a href="#" class="ui muted icon dismiss-review-btn" data-review-id="dismiss-review-{{.Review.ID}}" data-tooltip-content="{{$.locale.Tr "repo.issues.dismiss_review"}}">
|
||||
{{svg "octicon-x" 16}}
|
||||
<a href="#" class="ui muted icon gt-df gt-ac dismiss-review-btn" data-review-id="dismiss-review-{{.Review.ID}}" data-tooltip-content="{{$.locale.Tr "repo.issues.dismiss_review"}}">
|
||||
{{svg "octicon-x" 20}}
|
||||
</a>
|
||||
<div class="ui small modal" id="dismiss-review-modal">
|
||||
<div class="header">
|
||||
|
|
@ -65,19 +68,9 @@
|
|||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
<span class="type-icon text {{if eq .Review.Type 1}}green
|
||||
{{- else if eq .Review.Type 2}}grey
|
||||
{{- else if eq .Review.Type 3}}red
|
||||
{{- else if eq .Review.Type 4}}yellow
|
||||
{{else}}grey{{end}}">
|
||||
|
||||
{{if .CanChange}}
|
||||
<a href="#" class="ui icon re-request-review {{if .Checked}}checked{{end}}" data-issue-id="{{$.Issue.ID}}" data-tooltip-content="{{if .Checked}} {{$.locale.Tr "repo.issues.remove_request_review"}} {{else}} {{$.locale.Tr "repo.issues.re_request_review"}} {{end}}" data-id="{{.ItemID}}" data-update-url="{{$.RepoLink}}/issues/request_review">
|
||||
{{if .Checked}} {{svg "octicon-trash"}} {{else}} {{svg "octicon-sync"}} {{end}}
|
||||
</a>
|
||||
<a href="#" class="ui icon muted gt-df gt-ac re-request-review{{if .Checked}} checked{{end}}" data-issue-id="{{$.Issue.ID}}" data-tooltip-content="{{if .Checked}}{{$.locale.Tr "repo.issues.remove_request_review"}}{{else}}{{$.locale.Tr "repo.issues.re_request_review"}}{{end}}" data-id="{{.ItemID}}" data-update-url="{{$.RepoLink}}/issues/request_review">{{if .Checked}}{{svg "octicon-trash"}}{{else}}{{svg "octicon-sync"}}{{end}}</a>
|
||||
{{end}}
|
||||
{{svg (printf "octicon-%s" .Review.Type.Icon)}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
|
|
@ -86,6 +79,9 @@
|
|||
<div class="ui divider"></div>
|
||||
<div class="review-item">
|
||||
<div class="review-item-left">
|
||||
<span class="gt-mr-3 text {{.Review.HTMLTypeColorName}}">
|
||||
{{svg (printf "octicon-%s" .Type.Icon)}}
|
||||
</span>
|
||||
<a href="{{$.Repository.OriginalURL}}" data-tooltip-content="{{$.locale.Tr "repo.migrated_from_fake" ($.Repository.GetOriginalURLHostname|Escape) | Safe}}">
|
||||
<span class="text black">
|
||||
{{svg (MigrationIcon $.Repository.GetOriginalURLHostname)}}
|
||||
|
|
@ -93,15 +89,6 @@
|
|||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="review-item-right">
|
||||
<span class="type-icon text {{if eq .Type 1}}green
|
||||
{{- else if eq .Type 2}}grey
|
||||
{{- else if eq .Type 3}}red
|
||||
{{- else if eq .Type 4}}yellow
|
||||
{{else}}grey{{end}}">
|
||||
{{svg (printf "octicon-%s" .Type.Icon)}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
|
|
@ -204,7 +191,7 @@
|
|||
</div>
|
||||
{{else if .Issue.PullRequest.IsAncestor}}
|
||||
<div class="item">
|
||||
<i class="icon icon-octicon">{{svg "octicon-alert" 16}}</i>
|
||||
<i class="icon icon-octicon">{{svg "octicon-alert"}}</i>
|
||||
{{$.locale.Tr "repo.pulls.is_ancestor"}}
|
||||
</div>
|
||||
{{else if or .Issue.PullRequest.CanAutoMerge .Issue.PullRequest.IsEmpty}}
|
||||
|
|
@ -230,7 +217,7 @@
|
|||
</div>
|
||||
{{else if .IsBlockedByChangedProtectedFiles}}
|
||||
<div class="item">
|
||||
<i class="icon icon-octicon">{{svg "octicon-x" 16}}</i>
|
||||
<i class="icon icon-octicon">{{svg "octicon-x"}}</i>
|
||||
{{$.locale.TrN $.ChangedProtectedFilesNum "repo.pulls.blocked_by_changed_protected_files_1" "repo.pulls.blocked_by_changed_protected_files_n" | Safe}}
|
||||
<ul>
|
||||
{{range .ChangedProtectedFiles}}
|
||||
|
|
@ -294,7 +281,7 @@
|
|||
<div class="ui divider"></div>
|
||||
|
||||
<div class="item">
|
||||
<i class="icon icon-octicon">{{svg "octicon-alert" 16}}</i>
|
||||
<i class="icon icon-octicon">{{svg "octicon-alert"}}</i>
|
||||
{{$.locale.Tr "repo.pulls.is_empty"}}
|
||||
</div>
|
||||
{{end}}
|
||||
|
|
@ -430,7 +417,7 @@
|
|||
</div>
|
||||
{{else if .IsBlockedByChangedProtectedFiles}}
|
||||
<div class="item text red">
|
||||
<i class="icon icon-octicon">{{svg "octicon-x" 16}}</i>
|
||||
<i class="icon icon-octicon">{{svg "octicon-x"}}</i>
|
||||
{{$.locale.TrN $.ChangedProtectedFilesNum "repo.pulls.blocked_by_changed_protected_files_1" "repo.pulls.blocked_by_changed_protected_files_n" | Safe}}
|
||||
<ul>
|
||||
{{range .ChangedProtectedFiles}}
|
||||
|
|
|
|||
|
|
@ -54,37 +54,27 @@
|
|||
{{range .PullReviewers}}
|
||||
<div class="item gt-mb-2">
|
||||
{{if .User}}
|
||||
<a class="muted sidebar-item-link" href="{{.User.HomeLink}}">
|
||||
{{avatar $.Context .User 28 "gt-mr-3"}}
|
||||
{{.User.GetDisplayName}}
|
||||
</a>
|
||||
<a class="muted sidebar-item-link" href="{{.User.HomeLink}}">{{avatar $.Context .User 28 "gt-mr-3"}}{{.User.GetDisplayName}}</a>
|
||||
{{else if .Team}}
|
||||
<span class="text">{{svg "octicon-people" 16 "teamavatar"}}{{$.Issue.Repo.OwnerName}}/{{.Team.Name}}</span>
|
||||
{{end}}
|
||||
<span class="ui right type-icon text {{if eq .Review.Type 1}}green
|
||||
{{- else if eq .Review.Type 2}}grey
|
||||
{{- else if eq .Review.Type 3}}red
|
||||
{{- else if eq .Review.Type 4}}yellow
|
||||
{{- else}}grey{{end}} right ">
|
||||
|
||||
<span class="ui right gt-df gt-ac gt-gap-3">
|
||||
{{if .CanChange}}
|
||||
<a href="#" class="ui icon re-request-review {{if .Checked}}checked{{end}}" data-tooltip-content="{{if .Checked}} {{$.locale.Tr "repo.issues.remove_request_review"}} {{else}} {{$.locale.Tr "repo.issues.re_request_review"}} {{end}}" data-issue-id="{{$.Issue.ID}}" data-id="{{.ItemID}}" data-update-url="{{$.RepoLink}}/issues/request_review">
|
||||
{{if .Checked}} {{svg "octicon-trash"}} {{else}} {{svg "octicon-sync"}} {{end}}
|
||||
</a>
|
||||
<a href="#" class="ui muted icon re-request-review{{if .Checked}} checked{{end}}" data-tooltip-content="{{if .Checked}}{{$.locale.Tr "repo.issues.remove_request_review"}}{{else}}{{$.locale.Tr "repo.issues.re_request_review"}}{{end}}" data-issue-id="{{$.Issue.ID}}" data-id="{{.ItemID}}" data-update-url="{{$.RepoLink}}/issues/request_review">{{if .Checked}}{{svg "octicon-trash"}}{{else}}{{svg "octicon-sync"}}{{end}}</a>
|
||||
{{end}}
|
||||
{{svg (printf "octicon-%s" .Review.Type.Icon)}}
|
||||
{{svg (printf "octicon-%s" .Review.Type.Icon) 16 (printf "text %s" (.Review.HTMLTypeColorName))}}
|
||||
</span>
|
||||
</div>
|
||||
{{end}}
|
||||
{{range .OriginalReviews}}
|
||||
<div class="item" style="margin-bottom: 10px;">
|
||||
<div class="item gt-mb-3">
|
||||
<a href="{{$.Repository.OriginalURL}}" data-tooltip-content="{{$.locale.Tr "repo.migrated_from_fake" ($.Repository.GetOriginalURLHostname|Escape) | Safe}}">
|
||||
<span class="text black">
|
||||
{{svg (MigrationIcon $.Repository.GetOriginalURLHostname)}}
|
||||
{{.OriginalAuthor}}
|
||||
</span>
|
||||
</a>
|
||||
<span class="ui right type-icon text {{if eq .Type 1}}green
|
||||
<span class="ui right text {{if eq .Type 1}}green
|
||||
{{- else if eq .Type 2}}grey
|
||||
{{- else if eq .Type 3}}red
|
||||
{{- else if eq .Type 4}}yellow
|
||||
|
|
|
|||
|
|
@ -691,49 +691,41 @@
|
|||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.repository.view.issue .pull .merge.box .timeline-avatar {
|
||||
.repository.view.issue .merge.box .timeline-avatar {
|
||||
margin-top: 3px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
.repository.view.issue .pull .merge.box .branch-update.grid .row {
|
||||
.repository.view.issue .merge.box .branch-update.grid .row {
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
|
||||
.repository.view.issue .pull .merge.box .branch-update.grid .row .icon {
|
||||
.repository.view.issue .merge.box .branch-update.grid .row .icon {
|
||||
margin-top: 1.1rem;
|
||||
}
|
||||
|
||||
.repository.view.issue .pull .review-item {
|
||||
.repository.view.issue .review-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.repository.view.issue .pull .review-item .review-item-left,
|
||||
.repository.view.issue .pull .review-item .review-item-right {
|
||||
.review-item-left,
|
||||
.review-item-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.repository.view.issue .pull .review-item .text {
|
||||
margin: 0.3em 0 0.5em 0.5em;
|
||||
.review-item-right {
|
||||
gap: 8px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
.repository.view.issue .pull .review-item .type-icon {
|
||||
align-self: flex-start;
|
||||
margin-right: 1em;
|
||||
}
|
||||
|
||||
.repository.view.issue .pull .review-item .type-icon i {
|
||||
line-height: 1.8em;
|
||||
}
|
||||
|
||||
.repository.view.issue .pull .review-item .divider {
|
||||
.repository.view.issue .review-item .divider {
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
|
||||
.repository.view.issue .pull .review-item .review-content {
|
||||
.repository.view.issue .review-item .review-content {
|
||||
padding: 1em 0 1em 3.8em;
|
||||
}
|
||||
|
||||
|
|
@ -782,6 +774,10 @@
|
|||
padding-bottom: 8px;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .timeline-avatar-offset {
|
||||
margin-top: 48px;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .timeline-item {
|
||||
margin-left: 16px;
|
||||
position: relative;
|
||||
|
|
@ -1098,8 +1094,8 @@
|
|||
margin-left: 3em;
|
||||
}
|
||||
|
||||
.repository.view.issue .comment-list .code-comment img.avatar,
|
||||
.repository.view.issue .comment-list .comment img.avatar {
|
||||
.repository.view.issue .comment-code-cloud .comment-list .code-comment img.avatar,
|
||||
.repository.view.issue .comment-code-cloud .comment-list .comment img.avatar {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
|
|
@ -3261,6 +3257,8 @@ td.blob-excerpt {
|
|||
.repository.view.issue .comment-list .timeline .inline-timeline-avatar {
|
||||
display: flex;
|
||||
margin-bottom: auto;
|
||||
margin-left: 6px;
|
||||
margin-right: 2px;
|
||||
}
|
||||
.repository.view.issue .comment-list .timeline .inline-timeline-avatar img.avatar {
|
||||
height: 24px;
|
||||
|
|
|
|||
Loading…
Reference in New Issue