mirror
/
gitea
mirror of https://github.com/go-gitea/gitea
2
0
Fork 0
Code Issues Releases Wiki Activity

Clean up various avatar dimensions (#24701)

Browse Source 
Clean up a few cases where avatar dimensions were overwritten via CSS,
which were no longer needed or were possible to set via HTML width.

Also included are two small fixes:

- Fix one more case of incorrect avatar offset on review timeline
- Vertically center avatars in review sidebar

There is more to be done here, but some of the work depends on Fomantic
`comment` module removal, or in the case of org member lists, a refactor
of the `avatarlink` template to accept a size.

<img width="371" alt="image"
src="https://github.com/go-gitea/gitea/assets/115237/9c5902fb-2b89-4a7d-a152-60e74c3b2c56">
<img width="306" alt="image"
src="https://github.com/go-gitea/gitea/assets/115237/c8d92e2a-91c9-4f4a-a7de-6ae1a6bc0479">

---------

Co-authored-by: Giteabot <teabot@gitea.io>
pull/24712/head^2
silverwind 2 years ago committed by GitHub
parent 3af2c8e4ab
commit b92c142c97
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 29 additions and 70 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 4
      templates/repo/commits_list_small.tmpl
  2. 10
      templates/repo/issue/view_content.tmpl
  3. 22
      templates/repo/issue/view_content/comments.tmpl
  4. 2
      templates/repo/issue/view_content/pull.tmpl
  5. 2
      templates/shared/issuelist.tmpl
  6. 5
      web_src/css/base.css
  7. 14
      web_src/css/modules/comment.css
  8. 2
      web_src/css/organization.css
  9. 36
      web_src/css/repository.css
  10. 2
      web_src/css/shared/issuelist.css

4
templates/repo/commits_list_small.tmpl
Unescape View File

@ -15,7 +15,7 @@
{{$commitLink:= printf "%s/commit/%s" $.comment.Issue.PullRequest.BaseRepo.Link (PathEscape .ID.String)}}
<span class="ui float right shabox">
<span class="ui float right shabox gt-df gt-ac">
{{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses "root" $.root}}
{{$class := "ui sha label"}}
{{if .Signature}}
@ -32,7 +32,7 @@
{{$class = (printf "%s%s" $class " isWarning")}}
{{end}}
{{end}}
<a href="{{$commitLink}}" rel="nofollow" class="{{$class}}">
<a href="{{$commitLink}}" rel="nofollow" class="gt-ml-3 {{$class}}">
<span class="shortsha">{{ShortSha .ID.String}}</span>
{{if .Signature}}
{{template "repo/shabox_badge" dict "root" $.root "verification" .Verification}}

10
templates/repo/issue/view_content.tmpl
Unescape View File

@ -11,10 +11,12 @@
<div class="ui timeline">
<div id="{{.Issue.HashTag}}" class="timeline-item comment first">
{{if .Issue.OriginalAuthor}}
<span class="timeline-avatar"><img src="{{AppSubUrl}}/assets/img/avatar_default.png"></span>
<span class="timeline-avatar">
<img src="{{AppSubUrl}}/assets/img/avatar_default.png" width="40" height="40">
</span>
{{else}}
<a class="timeline-avatar" {{if gt .Issue.Poster.ID 0}}href="{{.Issue.Poster.HomeLink}}"{{end}}>
{{avatar $.Context .Issue.Poster}}
{{avatar $.Context .Issue.Poster 40}}
</a>
{{end}}
<div class="content comment-container">
@ -33,7 +35,7 @@
</span>
{{else}}
<a class="inline-timeline-avatar" href="{{.Issue.Poster.HomeLink}}">
{{avatar $.Context .Issue.Poster}}
{{avatar $.Context .Issue.Poster 24}}
</a>
<span class="text grey">
{{template "shared/user/authorlink" .Issue.Poster}}
@ -93,7 +95,7 @@
{{if and (or .IsRepoAdmin .HasIssuesOrPullsWritePermission (not .Issue.IsLocked)) (not .Repository.IsArchived)}}
<div class="timeline-item comment form">
<a class="timeline-avatar" href="{{.SignedUser.HomeLink}}">
{{avatar $.Context .SignedUser}}
{{avatar $.Context .SignedUser 40}}
</a>
<div class="content">
<form class="ui segment form" id="comment-form" action="{{$.RepoLink}}/issues/{{.Issue.Index}}/comments" method="post">

22
templates/repo/issue/view_content/comments.tmpl
Unescape View File

@ -15,10 +15,12 @@
{{if eq .Type 0}}
<div class="timeline-item comment" id="{{.HashTag}}">
{{if .OriginalAuthor}}
<span class="timeline-avatar"><img src="{{AppSubUrl}}/assets/img/avatar_default.png"></span>
<span class="timeline-avatar">
<img src="{{AppSubUrl}}/assets/img/avatar_default.png" width="40" height="40">
</span>
{{else}}
<a class="timeline-avatar"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>
{{avatar $.Context .Poster}}
{{avatar $.Context .Poster 40}}
</a>
{{end}}
<div class="content comment-container">
@ -38,7 +40,7 @@
{{else}}
{{if gt .Poster.ID 0}}
<a class="inline-timeline-avatar" href="{{.Poster.HomeLink}}">
{{avatar $.Context .Poster}}
{{avatar $.Context .Poster 24}}
</a>
{{end}}
<span class="text grey muted-links">
@ -375,8 +377,8 @@
{{/* 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 class="timeline-avatar{{if or (and (eq .Review.Type 1) (or .Content .Attachments)) (and (eq .Review.Type 2) (or .Content .Attachments)) (eq .Review.Type 3)}} timeline-avatar-offset{{end}}"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>
{{avatar $.Context .Poster 40}}
</a>
{{end}}
<span class="badge{{if eq .Review.Type 1}} gt-bg-green gt-text-white{{else if eq .Review.Type 3}} gt-bg-red gt-text-white{{end}}">{{svg (printf "octicon-%s" .Review.Type.Icon)}}</span>
@ -413,7 +415,7 @@
<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}}
{{avatar $.Context .Poster 24}}
</a>
{{end}}
<span class="text grey muted-links">
@ -482,7 +484,7 @@
{{range $filename, $lines := .Review.CodeComments}}
{{range $line, $comms := $lines}}
<div class="ui segments">
<div class="ui segment gt-py-3 gt-df gt-ac gt-sb">
<div class="ui segment collapsible-comment-box gt-py-3 gt-df gt-ac gt-sb">
{{$invalid := (index $comms 0).Invalidated}}
{{$resolved := (index $comms 0).IsResolved}}
{{$resolveDoer := (index $comms 0).ResolveDoer}}
@ -541,7 +543,7 @@
<div class="comment-header-left gt-df gt-ac">
{{if not .OriginalAuthor}}
<a class="avatar">
{{avatar $.Context .Poster}}
{{avatar $.Context .Poster 20}}
</a>
{{end}}
<span class="text grey muted-links">
@ -768,7 +770,7 @@
<div class="timeline-item-group">
<div class="timeline-item event" id="{{.HashTag}}">
<a class="timeline-avatar"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>
<img src="{{.Poster.AvatarLink $.Context}}">
<img src="{{.Poster.AvatarLink $.Context}}" width="40" height="40">
</a>
<span class="badge grey">{{svg "octicon-x" 16}}</span>
{{template "shared/user/avatarlink" dict "Context" $.Context "user" .Poster}}
@ -789,7 +791,7 @@
<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}}
{{avatar $.Context .Poster 24}}
</a>
{{end}}
<span class="text grey muted-links">

2
templates/repo/issue/view_content/pull.tmpl
Unescape View File

@ -115,7 +115,7 @@
{{- else if .Issue.PullRequest.IsChecking}}yellow
{{- else if .Issue.PullRequest.IsEmpty}}grey
{{- else if .Issue.PullRequest.CanAutoMerge}}green
{{- else}}red{{end}}">{{svg "octicon-git-merge" 32}}</a>
{{- else}}red{{end}}">{{svg "octicon-git-merge" 40}}</a>
<div class="content">
{{template "repo/pulls/status" .}}
{{$showGeneralMergeForm := false}}

2
templates/shared/issuelist.tmpl
Unescape View File

@ -153,7 +153,7 @@
<div class="issue-item-icon-right text grey">
{{range .Assignees}}
<a class="ui assignee gt-tdn" href="{{.HomeLink}}" data-tooltip-content="{{.GetDisplayName}}">
{{avatar $.Context .}}
{{avatar $.Context . 20}}
</a>
{{end}}
</div>

5
web_src/css/base.css
Unescape View File

@ -1903,11 +1903,6 @@ img.ui.avatar,
color: var(--color-text-light);
}
.repo-title .avatar {
width: 32px !important;
height: 32px !important;
}
.repo-title .labels {
margin-left: 0.5rem;
}

14
web_src/css/modules/comment.css
Unescape View File

@ -47,20 +47,8 @@
}
.ui.comments .comment .avatar {
display: block;
width: 2.5em;
height: auto;
float: left;
margin: 0.2em 0 0;
}
.ui.comments .comment img.avatar,
.ui.comments .comment .avatar img {
display: block;
margin: 0 auto;
width: 100%;
height: 100%;
border-radius: 0.25rem;
width: 2.5em;
}
.ui.comments .comment > .content {

2
web_src/css/organization.css
Unescape View File

@ -170,7 +170,7 @@
.organization.members .list .item .ui.avatar {
width: 48px;
height: auto;
height: 48px;
margin-right: 1rem;
align-self: flex-start;
}

36
web_src/css/repository.css
Unescape View File

@ -691,11 +691,6 @@
margin-right: 5px;
}
.repository.view.issue .merge.box .timeline-avatar {
margin-top: 3px;
margin-left: 4px;
}
.repository.view.issue .merge.box .branch-update.grid .row {
padding-bottom: 1rem;
}
@ -788,23 +783,11 @@
left: -68px;
}
.repository.view.issue .comment-list .timeline-item .timeline-avatar img {
width: 40px !important;
height: 40px !important;
}
/* Don't show the mobile oriented avatar ".inline-timeline-avatar" on desktop. Desktop uses the avatar with class ".timeline-avatar" */
.repository.view.issue .comment-list .timeline-item .inline-timeline-avatar {
display: none;
}
.repository.view.issue .comment-list .timeline-item img.avatar,
.repository.view.issue .comment-list .timeline-item .avatar img {
width: 20px;
height: 20px;
vertical-align: middle;
}
.repository.view.issue .comment-list .timeline-item:first-child:not(.commit) {
padding-top: 0 !important;
}
@ -1063,12 +1046,12 @@
.repository.view.issue .comment-list .code-comment {
border: 1px solid transparent;
padding: 0.25rem 0.5rem;
margin: 0;
}
.repository.view.issue .comment-list .code-comment .content {
border: none !important;
/* fix fomantic's border-radius via :first-child with hidden elements */
.collapsible-comment-box:has(.gt-hidden) {
border-radius: var(--border-radius) !important;
}
.repository.view.issue .comment-list .code-comment .comment-header {
@ -1091,13 +1074,7 @@
}
.repository.view.issue .comment-list .comment > .avatar ~ .content {
margin-left: 3em;
}
.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;
margin-left: 42px;
}
.repository.view.issue .comment-list .comment-code-cloud .segment.reactions {
@ -3085,6 +3062,7 @@ td.blob-excerpt {
}
.sidebar-item-link {
display: inline-flex;
align-items: center;
word-break: break-all;
}
@ -3260,10 +3238,6 @@ td.blob-excerpt {
margin-left: 6px;
margin-right: 2px;
}
.repository.view.issue .comment-list .timeline .inline-timeline-avatar img.avatar {
height: 24px;
width: 24px;
}
.repository.view.issue .comment-list .timeline .comment-header {
padding-left: 4px;
}

2
web_src/css/shared/issuelist.css
Unescape View File

@ -69,8 +69,6 @@
}
.issue.list > .item .assignee img {
width: 20px;
height: 20px;
margin-right: 2px;
}

Write Preview
Loading…
Cancel
Save