0
0
mirror of https://github.com/go-gitea/gitea.git synced 2025-04-26 12:42:09 +02:00

Fix various trivial frontend problems (#34263)

1. Fix #20606
2. Fix #34246
3. Fix missing spaces, fix misspells, no visual change.
4. Fix missing "not-mobile", fix #34265

---------

Co-authored-by: silverwind <me@silverwind.io>
This commit is contained in:
wxiaoguang 2025-04-24 09:11:54 +08:00 committed by GitHub
parent 58d2a87c6c
commit e625250ffc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
18 changed files with 35 additions and 33 deletions

View File

@ -35,7 +35,7 @@ func AvatarHTML(src string, size int, class, name string) template.HTML {
}
// use empty alt, otherwise if the image fails to load, the width will follow the "alt" text's width
return template.HTML(`<img loading="lazy" alt="" class="` + class + `" src="` + src + `" title="` + html.EscapeString(name) + `" width="` + sizeStr + `" height="` + sizeStr + `"/>`)
return template.HTML(`<img loading="lazy" alt class="` + class + `" src="` + src + `" title="` + html.EscapeString(name) + `" width="` + sizeStr + `" height="` + sizeStr + `"/>`)
}
// Avatar renders user avatars. args: user, size (int), class (string)

View File

@ -351,5 +351,4 @@
</div>
</div>
</div>
<img class="tw-hidden" src="{{AssetUrlPrefix}}/img/loading.png">
{{template "base/footer" .}}

View File

@ -2,7 +2,7 @@
<div role="main" aria-label="{{.Title}}" class="page-content install post-install tw-h-full">
<div class="home tw-text-center tw-h-full tw-flex tw-flex-col tw-justify-center"><!-- the "home" class makes the links green -->
<!-- the "cup" has a handler, so move it a little leftward to make it visually in the center -->
<div class="tw-ml-[-30px]"><img width="160" src="{{AssetUrlPrefix}}/img/loading.png" alt="" aria-hidden="true"></div>
<div class="tw-ml-[-30px]"><img width="160" src="{{AssetUrlPrefix}}/img/loading.png" alt aria-hidden="true"></div>
<div class="tw-my-[2em] tw-text-[18px]">
<a id="goto-user-login" href="{{AppSubUrl}}/user/login">{{ctx.Locale.Tr "install.installing_desc"}}</a>
</div>

View File

@ -22,7 +22,7 @@
{{if .blobBase}}
<span class="side">
<p class="side-header">{{ctx.Locale.Tr "repo.diff.file_before"}}</p>
<span class="before-container"><img class="image-before"></span>
<span class="before-container"><img alt class="image-before"></span>
<p>
<span class="bounds-info-before">
{{ctx.Locale.Tr "repo.diff.file_image_width"}}: <span class="text bounds-info-width"></span>
@ -37,7 +37,7 @@
{{if .blobHead}}
<span class="side">
<p class="side-header">{{ctx.Locale.Tr "repo.diff.file_after"}}</p>
<span class="after-container"><img class="image-after"></span>
<span class="after-container"><img alt class="image-after"></span>
<p>
<span class="bounds-info-after">
{{ctx.Locale.Tr "repo.diff.file_image_width"}}: <span class="text bounds-info-width"></span>
@ -55,9 +55,9 @@
<div class="ui bottom attached tab image-diff-container" data-tab="diff-swipe-{{.file.NameHash}}">
<div class="diff-swipe">
<div class="swipe-frame">
<span class="before-container"><img class="image-before"></span>
<span class="before-container"><img alt class="image-before"></span>
<span class="swipe-container">
<span class="after-container"><img class="image-after"></span>
<span class="after-container"><img alt class="image-after"></span>
</span>
<span class="swipe-bar">
<span class="handle top-handle"></span>
@ -70,8 +70,8 @@
<div class="diff-overlay">
<input type="range" min="0" max="100" value="50">
<div class="overlay-frame">
<span class="before-container"><img class="image-before"></span>
<span class="after-container"><img class="image-after"></span>
<span class="before-container"><img alt class="image-before"></span>
<span class="after-container"><img alt class="image-after"></span>
</div>
</div>
</div>

View File

@ -1,6 +1,6 @@
{{$avatarLink := (.RelAvatarLink ctx)}}
{{if $avatarLink}}
<img class="ui avatar tw-align-middle" src="{{$avatarLink}}" width="24" height="24" alt="" aria-hidden="true">
<img class="ui avatar tw-align-middle" src="{{$avatarLink}}" width="24" height="24" alt aria-hidden="true">
{{else if $.IsMirror}}
{{svg "octicon-mirror" 24}}
{{else if $.IsFork}}

View File

@ -50,7 +50,7 @@
<div class="field">
<label for="color">{{ctx.Locale.Tr "repo.issues.label_color"}}</label>
<div class="column js-color-picker-input">
<input name="color" value="#70c24a"placeholder="#c320f6" required maxlength="7">
<input name="color" value="#70c24a" placeholder="#c320f6" required maxlength="7">
{{template "repo/issue/label_precolors"}}
</div>
</div>

View File

@ -28,8 +28,8 @@
{{end}}
<div class="tw-flex tw-flex-col tw-gap-2">
<progress class="milestone-progress-big" value="{{.Milestone.Completeness}}" max="100"></progress>
<div class="tw-flex tw-gap-4">
<div classs="tw-flex tw-items-center">
<div class="flex-text-block tw-gap-4">
<div class="flex-text-inline">
{{$closedDate:= DateUtils.TimeSince .Milestone.ClosedDateUnix}}
{{if .IsClosed}}
{{svg "octicon-clock"}} {{ctx.Locale.Tr "repo.milestones.closed" $closedDate}}
@ -46,7 +46,7 @@
{{end}}
{{end}}
</div>
<div class="tw-mr-2">{{ctx.Locale.Tr "repo.milestones.completeness" .Milestone.Completeness}}</div>
<div>{{ctx.Locale.Tr "repo.milestones.completeness" .Milestone.Completeness}}</div>
{{if .TotalTrackedTime}}
<div data-tooltip-content='{{ctx.Locale.Tr "tracked_time_summary"}}'>
{{svg "octicon-clock"}}

View File

@ -615,7 +615,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 ctx}}" width="40" height="40">
<img alt src="{{.Poster.AvatarLink ctx}}" width="40" height="40">
</a>
<span class="badge grey">{{svg "octicon-x" 16}}</span>
<span class="text grey muted-links">

View File

@ -9,12 +9,12 @@
<div class="ui stackable middle very relaxed page grid">
<div id="repo_migrating" class="sixteen wide tw-text-center centered column" data-migrating-repo-link="{{.Link}}">
<div>
<img src="{{AssetUrlPrefix}}/img/loading.png">
<img alt src="{{AssetUrlPrefix}}/img/loading.png">
</div>
</div>
<div id="repo_migrating_failed_image" class="sixteen wide tw-text-center centered column tw-hidden">
<div>
<img src="{{AssetUrlPrefix}}/img/failed.png">
<img alt src="{{AssetUrlPrefix}}/img/failed.png">
</div>
</div>
</div>

View File

@ -21,7 +21,7 @@
{{else if not .IsTextFile}}
<div class="view-raw">
{{if .IsImageFile}}
<img src="{{$.RawFileLink}}">
<img alt="{{$.RawFileLink}}" src="{{$.RawFileLink}}">
{{else if .IsVideoFile}}
<video controls src="{{$.RawFileLink}}">
<strong>{{ctx.Locale.Tr "repo.video_not_supported_in_browser"}}</strong>

View File

@ -4,7 +4,7 @@
{{if $.IsStaringRepo}}{{$buttonText = ctx.Locale.Tr "repo.unstar"}}{{end}}
<button type="submit" class="ui compact small basic button"{{if not $.IsSigned}} disabled{{end}} aria-label="{{$buttonText}}">
{{svg (Iif $.IsStaringRepo "octicon-star-fill" "octicon-star")}}
<span aria-hidden="true">{{$buttonText}}</span>
<span class="not-mobile" aria-hidden="true">{{$buttonText}}</span>
</button>
<a hx-boost="false" class="ui basic label" href="{{$.RepoLink}}/stars">
{{CountFmt .Repository.NumStars}}

View File

@ -98,7 +98,7 @@
{{else if not .IsTextSource}}
<div class="view-raw">
{{if .IsImageFile}}
<img src="{{$.RawFileLink}}">
<img alt="{{$.RawFileLink}}" src="{{$.RawFileLink}}">
{{else if .IsVideoFile}}
<video controls src="{{$.RawFileLink}}">
<strong>{{ctx.Locale.Tr "repo.video_not_supported_in_browser"}}</strong>

View File

@ -4,7 +4,7 @@
{{if $.IsWatchingRepo}}{{$buttonText = ctx.Locale.Tr "repo.unwatch"}}{{end}}
<button type="submit" class="ui compact small basic button"{{if not $.IsSigned}} disabled{{end}} aria-label="{{$buttonText}}">
{{svg "octicon-eye"}}
<span aria-hidden="true">{{$buttonText}}</span>
<span class="not-mobile" aria-hidden="true">{{$buttonText}}</span>
</button>
<a hx-boost="false" class="ui basic label" href="{{.RepoLink}}/watchers">
{{CountFmt .Repository.NumWatches}}

View File

@ -5,23 +5,23 @@
{{if eq .HookType "gitea"}}
{{svg "gitea-gitea" $size "img"}}
{{else if eq .HookType "gogs"}}
<img width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/gogs.ico">
<img alt width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/gogs.ico">
{{else if eq .HookType "slack"}}
<img width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/slack.png">
<img alt width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/slack.png">
{{else if eq .HookType "discord"}}
<img width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/discord.png">
<img alt width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/discord.png">
{{else if eq .HookType "dingtalk"}}
<img width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/dingtalk.ico">
<img alt width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/dingtalk.ico">
{{else if eq .HookType "telegram"}}
<img width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/telegram.png">
<img alt width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/telegram.png">
{{else if eq .HookType "msteams"}}
<img width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/msteams.png">
<img alt width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/msteams.png">
{{else if eq .HookType "feishu"}}
{{svg "gitea-feishu" $size "img"}}
{{else if eq .HookType "matrix"}}
{{svg "gitea-matrix" $size "img"}}
{{else if eq .HookType "wechatwork"}}
<img width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/wechatwork.png">
<img alt width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/wechatwork.png">
{{else if eq .HookType "packagist"}}
<img width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/packagist.png">
<img alt width="{{$size}}" height="{{$size}}" src="{{AssetUrlPrefix}}/img/packagist.png">
{{end}}

View File

@ -91,7 +91,7 @@
{{range $push.Commits}}
{{$commitLink := printf "%s/commit/%s" $repoLink .Sha1}}
<div class="flex-text-block">
<img class="ui avatar" src="{{$push.AvatarLink ctx .AuthorEmail}}" title="{{.AuthorName}}" width="16" height="16">
<img alt class="ui avatar" src="{{$push.AvatarLink ctx .AuthorEmail}}" title="{{.AuthorName}}" width="16" height="16">
<a class="ui sha label" href="{{$commitLink}}">{{ShortSha .Sha1}}</a>
<span class="text truncate">
{{ctx.RenderUtils.RenderCommitMessage .Message ($repo.ComposeCommentMetas ctx)}}

View File

@ -2,7 +2,10 @@
/* fonts */
--fonts-proportional: -apple-system, "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial;
--fonts-monospace: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace, var(--fonts-emoji);
--fonts-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Twemoji Mozilla";
/* GitHub explicitly sets font names like: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Twemoji Mozilla";
Actually "Twemoji Mozilla" emoji font is widely used by browsers like Firefox, Pale Moon, and it is more likely up-to-dated than the system emoji font.
So not setting emoji font seems to be the best choice, here we just use a non-existing dummy font name and let browsers choose. */
--fonts-emoji: -emoji-fallback;
/* font weights - use between 400 and 600 for general purposes. Avoid 700 as it is perceived too bold */
--font-weight-light: 300;
--font-weight-normal: 400;

View File

@ -138,7 +138,7 @@ function initDropdownUserRemoteSearch(el: Element) {
// the content is provided by backend IssuePosters handler
processedResults.length = 0;
for (const item of resp.results) {
let html = `<img class="ui avatar tw-align-middle" src="${htmlEscape(item.avatar_link)}" aria-hidden="true" alt="" width="20" height="20"><span class="gt-ellipsis">${htmlEscape(item.username)}</span>`;
let html = `<img class="ui avatar tw-align-middle" src="${htmlEscape(item.avatar_link)}" aria-hidden="true" alt width="20" height="20"><span class="gt-ellipsis">${htmlEscape(item.username)}</span>`;
if (item.full_name) html += `<span class="search-fullname tw-ml-2">${htmlEscape(item.full_name)}</span>`;
if (selectedUsername.toLowerCase() === item.username.toLowerCase()) selectedUsername = item.username;
processedResults.push({value: item.username, name: html});

View File

@ -34,7 +34,7 @@ export async function attachTribute(element: HTMLElement) {
menuItemTemplate: (item: TributeItem) => {
return `
<div class="tribute-item">
<img src="${htmlEscape(item.original.avatar)}" width="21" height="21"/>
<img alt 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>