mirror of
				https://github.com/go-gitea/gitea.git
				synced 2025-10-31 10:56:10 +01:00 
			
		
		
		
	Always use HTML attributes for avatar size (#31509)
Many avatars were rendered in HTML with certain width/height but then resized again in CSS. This was pointless so I removed all these cases and made the HTML size match the previous render size. Also did a few CSS cleanups in the tribute rendering: <img width="648" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/cb2fafb3-5e20-46e9-814f-07df20038beb">
This commit is contained in:
		| @@ -1,5 +1,5 @@ | ||||
| <div class="commit-form-wrapper"> | ||||
| 	{{ctx.AvatarUtils.Avatar .SignedUser 48 "commit-avatar"}} | ||||
| 	{{ctx.AvatarUtils.Avatar .SignedUser 40 "commit-avatar"}} | ||||
| 	<div class="commit-form"> | ||||
| 		<h3>{{- if .CanCommitToBranch.WillSign}} | ||||
| 			<span title="{{ctx.Locale.Tr "repo.signing.will_sign" .CanCommitToBranch.SigningKey}}">{{svg "octicon-lock" 24}}</span> | ||||
|   | ||||
| @@ -58,16 +58,16 @@ | ||||
| 							{{end}} | ||||
| 						{{end}} | ||||
| 					</span> | ||||
| 					<span class="author tw-flex tw-items-center tw-mr-2"> | ||||
| 					<span class="author tw-flex tw-items-center tw-mr-2 tw-gap-[1px]"> | ||||
| 						{{$userName := $commit.Commit.Author.Name}} | ||||
| 						{{if $commit.User}} | ||||
| 							{{if and $commit.User.FullName DefaultShowFullName}} | ||||
| 								{{$userName = $commit.User.FullName}} | ||||
| 							{{end}} | ||||
| 							<span class="tw-mr-1">{{ctx.AvatarUtils.Avatar $commit.User}}</span> | ||||
| 							{{ctx.AvatarUtils.Avatar $commit.User 18}} | ||||
| 							<a href="{{$commit.User.HomeLink}}">{{$userName}}</a> | ||||
| 						{{else}} | ||||
| 							<span class="tw-mr-1">{{ctx.AvatarUtils.AvatarByEmail $commit.Commit.Author.Email $userName}}</span> | ||||
| 							{{ctx.AvatarUtils.AvatarByEmail $commit.Commit.Author.Email $userName 18}} | ||||
| 							{{$userName}} | ||||
| 						{{end}} | ||||
| 					</span> | ||||
|   | ||||
| @@ -3,10 +3,10 @@ | ||||
| 		<div title="{{if eq .verification.TrustStatus "trusted"}}{{else if eq .verification.TrustStatus "untrusted"}}{{ctx.Locale.Tr "repo.commits.signed_by_untrusted_user"}}: {{else}}{{ctx.Locale.Tr "repo.commits.signed_by_untrusted_user_unmatched"}}: {{end}}{{.verification.Reason}}"> | ||||
| 		{{if ne .verification.SigningUser.ID 0}} | ||||
| 			{{svg "gitea-lock"}} | ||||
| 			{{ctx.AvatarUtils.Avatar .verification.SigningUser 28 "signature"}} | ||||
| 			{{ctx.AvatarUtils.Avatar .verification.SigningUser 16 "signature"}} | ||||
| 		{{else}} | ||||
| 			<span title="{{ctx.Locale.Tr "gpg.default_key"}}">{{svg "gitea-lock-cog"}}</span> | ||||
| 			{{ctx.AvatarUtils.AvatarByEmail .verification.SigningEmail "" 28 "signature"}} | ||||
| 			{{ctx.AvatarUtils.AvatarByEmail .verification.SigningEmail "" 16 "signature"}} | ||||
| 		{{end}} | ||||
| 		</div> | ||||
| 	{{else}} | ||||
|   | ||||
| @@ -8,7 +8,7 @@ | ||||
| 		{{range .Cards}} | ||||
| 			<li class="item ui segment"> | ||||
| 				<a href="{{.HomeLink}}"> | ||||
| 					{{ctx.AvatarUtils.Avatar .}} | ||||
| 					{{ctx.AvatarUtils.Avatar . 48}} | ||||
| 				</a> | ||||
| 				<h3 class="name"><a href="{{.HomeLink}}">{{.DisplayName}}</a></h3> | ||||
|  | ||||
|   | ||||
| @@ -123,12 +123,6 @@ | ||||
|   padding-bottom: 1px; | ||||
| } | ||||
|  | ||||
| #git-graph-container #rev-list .author img.ui.avatar { | ||||
|   width: auto; | ||||
|   height: 18px; | ||||
|   max-width: none; | ||||
| } | ||||
|  | ||||
| #git-graph-container #graph-raw-list { | ||||
|   margin: 0; | ||||
| } | ||||
|   | ||||
| @@ -17,7 +17,6 @@ | ||||
| .tribute-container li span.fullname { | ||||
|   font-weight: var(--font-weight-normal); | ||||
|   font-size: 0.8rem; | ||||
|   margin-left: 3px; | ||||
| } | ||||
|  | ||||
| .tribute-container li.highlight, | ||||
| @@ -29,14 +28,5 @@ | ||||
| .tribute-item { | ||||
|   display: flex; | ||||
|   align-items: center; | ||||
| } | ||||
|  | ||||
| .tribute-item .emoji, | ||||
| .tribute-item img[src*="/avatar/"] { | ||||
|   margin-right: 0.5rem; | ||||
| } | ||||
|  | ||||
| .tribute-container img { | ||||
|   width: 1.5rem !important; | ||||
|   height: 1.5rem !important; | ||||
|   gap: 6px; | ||||
| } | ||||
|   | ||||
| @@ -50,10 +50,6 @@ | ||||
|   background: none; | ||||
| } | ||||
|  | ||||
| .ui.comments .comment .avatar { | ||||
|   width: 30px; | ||||
| } | ||||
|  | ||||
| .ui.comments .comment > .content { | ||||
|   display: flex; | ||||
|   flex-direction: column; | ||||
|   | ||||
| @@ -127,8 +127,6 @@ | ||||
| } | ||||
|  | ||||
| .page-content.organization .members .ui.avatar { | ||||
|   width: 48px; | ||||
|   height: 48px; | ||||
|   margin-right: 5px; | ||||
|   margin-bottom: 5px; | ||||
| } | ||||
|   | ||||
| @@ -460,14 +460,12 @@ td .commit-summary { | ||||
| } | ||||
|  | ||||
| .repository.file.editor .commit-form-wrapper { | ||||
|   padding-left: 64px; | ||||
|   padding-left: 48px; | ||||
| } | ||||
|  | ||||
| .repository.file.editor .commit-form-wrapper .commit-avatar { | ||||
|   float: left; | ||||
|   margin-left: -64px; | ||||
|   width: 3em; | ||||
|   height: auto; | ||||
|   margin-left: -48px; | ||||
| } | ||||
|  | ||||
| .repository.file.editor .commit-form-wrapper .commit-form { | ||||
| @@ -535,10 +533,6 @@ td .commit-summary { | ||||
|   min-width: 100px; | ||||
| } | ||||
|  | ||||
| #new-issue .comment .avatar { | ||||
|   width: 3em; | ||||
| } | ||||
|  | ||||
| .repository.new.issue .comment.form .content::before, | ||||
| .repository.new.issue .comment.form .content::after { | ||||
|   right: 100%; | ||||
| @@ -1216,16 +1210,6 @@ td .commit-summary { | ||||
|   border: 1px solid var(--color-light-border); | ||||
| } | ||||
|  | ||||
| .repository #commits-table td.sha .sha.label .ui.signature.avatar, | ||||
| .repository #repo-files-table .sha.label .ui.signature.avatar, | ||||
| .repository #repo-file-commit-box .sha.label .ui.signature.avatar, | ||||
| .repository #rev-list .sha.label .ui.signature.avatar, | ||||
| .repository .timeline-item.commits-list .singular-commit .sha.label .ui.signature.avatar { | ||||
|   height: 16px; | ||||
|   margin-bottom: 0; | ||||
|   width: 16px; | ||||
| } | ||||
|  | ||||
| .repository #commits-table td.sha .sha.label .detail.icon, | ||||
| .repository #repo-files-table .sha.label .detail.icon, | ||||
| .repository #repo-file-commit-box .sha.label .detail.icon, | ||||
| @@ -1242,14 +1226,6 @@ td .commit-summary { | ||||
|   border-bottom-left-radius: 0; | ||||
| } | ||||
|  | ||||
| .repository #commits-table td.sha .sha.label .detail.icon img, | ||||
| .repository #repo-files-table .sha.label .detail.icon img, | ||||
| .repository #repo-file-commit-box .sha.label .detail.icon img, | ||||
| .repository #rev-list .sha.label .detail.icon img, | ||||
| .repository .timeline-item.commits-list .singular-commit .sha.label .detail.icon img { | ||||
|   margin-right: 0; | ||||
| } | ||||
|  | ||||
| .repository #commits-table td.sha .sha.label .detail.icon .svg, | ||||
| .repository #repo-files-table .sha.label .detail.icon .svg, | ||||
| .repository #repo-file-commit-box .sha.label .detail.icon .svg, | ||||
| @@ -1931,8 +1907,6 @@ td .commit-summary { | ||||
| } | ||||
|  | ||||
| .user-cards .list .item .avatar { | ||||
|   width: 48px; | ||||
|   height: 48px; | ||||
|   float: left; | ||||
|   display: block; | ||||
|   margin-right: 10px; | ||||
|   | ||||
| @@ -36,7 +36,7 @@ function makeCollections({mentions, emoji}) { | ||||
|       menuItemTemplate: (item) => { | ||||
|         return ` | ||||
|           <div class="tribute-item"> | ||||
|             <img src="${htmlEscape(item.original.avatar)}" class="tw-mr-2"/> | ||||
|             <img src="${htmlEscape(item.original.avatar)}" width="21" height="21"/> | ||||
|             <span class="name">${htmlEscape(item.original.name)}</span> | ||||
|             ${item.original.fullname && item.original.fullname !== '' ? `<span class="fullname">${htmlEscape(item.original.fullname)}</span>` : ''} | ||||
|           </div> | ||||
|   | ||||
		Reference in New Issue
	
	Block a user