TudbuT/forgejo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Refactor "shortsha" (#26877)

Browse source 
The old code used complex `if` blocks and strange HTML layouts.

<details>


![image](https://github.com/go-gitea/gitea/assets/2114189/7fbee2b8-d150-4e6b-b67e-83400fa290eb)

</details>

This PR refactors the template code and remove legacy CSS styles. The UI
doesn't change much.



![image](https://github.com/go-gitea/gitea/assets/2114189/3e195df9-0ab5-4182-bcb2-bb20cad823f2)


![image](https://github.com/go-gitea/gitea/assets/2114189/f707a49f-be41-4dfe-871f-2869f2230380)
This commit is contained in:
wxiaoguang 2023-09-03 10:58:52 +08:00 • committed by GitHub
parent f1fe102c8c
commit fba7150ca9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 16 additions and 93 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
templates/repo/commits_list.tmpl
View file

@ -41,28 +41,18 @@
{{$class = (printf "%s%s" $class " isWarning")}} {{$class = (printf "%s%s" $class " isWarning")}}
{{end}} {{end}}
{{end}} {{end}}
{{$commitShaLink := ""}}
{{if $.PageIsWiki}} {{if $.PageIsWiki}}
<a href="{{$commitRepoLink}}/wiki/commit/{{.ID}}" rel="nofollow" class="{{$class}}"> {{$commitShaLink = (printf "%s/wiki/commit/%s" $commitRepoLink (PathEscape .ID.String))}}
{{else if $.PageIsPullCommits}} {{else if $.PageIsPullCommits}}
<a href="{{$commitRepoLink}}/pulls/{{$.Issue.Index}}/commits/{{.ID}}" rel="nofollow" class="{{$class}}"> {{$commitShaLink = (printf "%s/pulls/%d/commits/%s" $commitRepoLink $.Issue.Index (PathEscape .ID.String))}}
{{else if $.Reponame}} {{else if $.Reponame}}
<a href="{{$commitRepoLink}}/commit/{{.ID}}" rel="nofollow" class="{{$class}}"> {{$commitShaLink = (printf "%s/commit/%s" $commitRepoLink (PathEscape .ID.String))}}
{{else}}
<span class="{{$class}}">
{{end}} {{end}}
<a {{if $commitShaLink}}href="{{$commitShaLink}}"{{end}} class="{{$class}}">
<span class="shortsha">{{ShortSha .ID.String}}</span> <span class="shortsha">{{ShortSha .ID.String}}</span>
{{if .Signature}} {{if .Signature}}{{template "repo/shabox_badge" dict "root" $ "verification" .Verification}}{{end}}
{{template "repo/shabox_badge" dict "root" $ "verification" .Verification}}
{{end}}
{{if $.PageIsWiki}}
</a> </a>
{{else if $.PageIsPullCommits}}
</a>
{{else if $.Reponame}}
</a>
{{else}}
</span>
{{end}}
</td> </td>
<td class="message"> <td class="message">
<span class="message-wrapper"> <span class="message-wrapper">
@ -78,7 +68,7 @@
{{end}} {{end}}
{{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses "root" $}} {{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses "root" $}}
{{if IsMultilineCommitMessage .Message}} {{if IsMultilineCommitMessage .Message}}
<pre class="commit-body gt-hidden">{{RenderCommitBody $.Context .Message $commitRepoLink $.Repository.ComposeMetas}}</pre> <pre class="commit-body gt-m-0 gt-hidden">{{RenderCommitBody $.Context .Message $commitRepoLink $.Repository.ComposeMetas}}</pre>
{{end}} {{end}}
</td> </td>
{{if .Committer}} {{if .Committer}}

2
templates/repo/graph/commits.tmpl
View file

@ -24,7 +24,7 @@
<a href="{{$.RepoLink}}/commit/{{$commit.Rev|PathEscape}}" rel="nofollow" class="{{$class}}"> <a href="{{$.RepoLink}}/commit/{{$commit.Rev|PathEscape}}" rel="nofollow" class="{{$class}}">
<span class="shortsha">{{ShortSha $commit.Commit.ID.String}}</span> <span class="shortsha">{{ShortSha $commit.Commit.ID.String}}</span>
{{- if $commit.Commit.Signature -}} {{- if $commit.Commit.Signature -}}
<span class="shortsha-pad"></span>{{template "repo/shabox_badge" dict "root" $ "verification" $commit.Verification}} {{template "repo/shabox_badge" dict "root" $ "verification" $commit.Verification}}
{{- end -}} {{- end -}}
</a> </a>
</span> </span>

4
templates/repo/view_list.tmpl
View file

@ -6,7 +6,7 @@
<div class="ui active tiny slow centered inline">…</div> <div class="ui active tiny slow centered inline">…</div>
{{else}} {{else}}
{{if .LatestCommitUser}} {{if .LatestCommitUser}}
{{ctx.AvatarUtils.Avatar .LatestCommitUser 24}} {{ctx.AvatarUtils.Avatar .LatestCommitUser 24 "gt-mr-2"}}
{{if .LatestCommitUser.FullName}} {{if .LatestCommitUser.FullName}}
<a class="muted author-wrapper" title="{{.LatestCommitUser.FullName}}" href="{{.LatestCommitUser.HomeLink}}"><strong>{{.LatestCommitUser.FullName}}</strong></a> <a class="muted author-wrapper" title="{{.LatestCommitUser.FullName}}" href="{{.LatestCommitUser.HomeLink}}"><strong>{{.LatestCommitUser.FullName}}</strong></a>
{{else}} {{else}}
@ -14,7 +14,7 @@
{{end}} {{end}}
{{else}} {{else}}
{{if .LatestCommit.Author}} {{if .LatestCommit.Author}}
{{ctx.AvatarUtils.AvatarByEmail .LatestCommit.Author.Email .LatestCommit.Author.Name 24}} {{ctx.AvatarUtils.AvatarByEmail .LatestCommit.Author.Email .LatestCommit.Author.Name 24 "gt-mr-2"}}
<span class="author-wrapper" title="{{.LatestCommit.Author.Name}}"><strong>{{.LatestCommit.Author.Name}}</strong></span> <span class="author-wrapper" title="{{.LatestCommit.Author.Name}}"><strong>{{.LatestCommit.Author.Name}}</strong></span>
{{end}} {{end}}
{{end}} {{end}}

6
web_src/css/base.css
View file

@ -1308,9 +1308,13 @@ img.ui.avatar,
.ui .sha.label { .ui .sha.label {
font-family: var(--fonts-monospace); font-family: var(--fonts-monospace);
font-size: 13px; font-size: 13px;
padding: 6px 10px 4px;
font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal);
margin: 0 6px; margin: 0 6px;
padding: 5px 10px;
}
.ui .sha.label .shortsha {
display: inline-block; /* not sure whether it is still needed */
} }
.ui .button.copy-commit-sha { .ui .button.copy-commit-sha {

8
web_src/css/features/gitgraph.css
View file

@ -123,14 +123,6 @@
padding-bottom: 3px; padding-bottom: 3px;
} }
#git-graph-container #rev-list .sha.label .shortsha {
padding-top: 0;
}
#git-graph-container #rev-list .sha.label .shortsha-pad {
padding-right: 10px;
}
#git-graph-container #rev-list .sha.label .ui.detail.icon.button { #git-graph-container #rev-list .sha.label .ui.detail.icon.button {
padding-top: 3px; padding-top: 3px;
margin-top: -5px; margin-top: -5px;

63
web_src/css/repo.css
View file

@ -245,15 +245,9 @@
} }
.repository.file.list #repo-files-table thead th { .repository.file.list #repo-files-table thead th {
padding-top: 8px;
padding-bottom: 5px;
font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal);
} }
.repository.file.list #repo-files-table thead .ui.avatar {
margin-bottom: 5px;
}
.repository.file.list #repo-files-table tbody .svg { .repository.file.list #repo-files-table tbody .svg {
margin-left: 3px; margin-left: 3px;
margin-right: 5px; margin-right: 5px;
@ -891,11 +885,6 @@
background: var(--color-red-badge-bg); background: var(--color-red-badge-bg);
} }
.repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isWarning .shortsha {
display: inline-block;
padding-top: 1px;
}
.repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isWarning:hover { .repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isWarning:hover {
background: var(--color-red-badge-hover-bg) !important; background: var(--color-red-badge-hover-bg) !important;
} }
@ -905,11 +894,6 @@
background: var(--color-green-badge-bg); background: var(--color-green-badge-bg);
} }
.repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isVerified .shortsha {
display: inline-block;
padding-top: 1px;
}
.repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isVerified:hover { .repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isVerified:hover {
background: var(--color-green-badge-hover-bg) !important; background: var(--color-green-badge-hover-bg) !important;
} }
@ -919,11 +903,6 @@
background: var(--color-yellow-badge-bg); background: var(--color-yellow-badge-bg);
} }
.repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isVerifiedUntrusted .shortsha {
display: inline-block;
padding-top: 1px;
}
.repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isVerifiedUntrusted:hover { .repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isVerifiedUntrusted:hover {
background: var(--color-yellow-badge-hover-bg) !important; background: var(--color-yellow-badge-hover-bg) !important;
} }
@ -933,11 +912,6 @@
background: var(--color-orange-badge-bg); background: var(--color-orange-badge-bg);
} }
.repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isVerifiedUnmatched .shortsha {
display: inline-block;
padding-top: 1px;
}
.repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isVerifiedUnmatched:hover { .repository.view.issue .comment-list .timeline-item.commits-list .singular-commit .shabox .sha.label.isSigned.isVerifiedUnmatched:hover {
background: var(--color-orange-badge-hover-bg) !important; background: var(--color-orange-badge-hover-bg) !important;
} }
@ -1387,14 +1361,6 @@
background: var(--color-red-badge-bg); background: var(--color-red-badge-bg);
} }
.repository #commits-table td.sha .sha.label.isSigned.isWarning .shortsha,
.repository #repo-files-table .sha.label.isSigned.isWarning .shortsha,
.repository #rev-list .sha.label.isSigned.isWarning .shortsha,
.repository .timeline-item.commits-list .singular-commit .sha.label.isSigned.isWarning .shortsha {
display: inline-block;
padding-top: 1px;
}
.repository #commits-table td.sha .sha.label.isSigned.isWarning .detail.icon, .repository #commits-table td.sha .sha.label.isSigned.isWarning .detail.icon,
.repository #repo-files-table .sha.label.isSigned.isWarning .detail.icon, .repository #repo-files-table .sha.label.isSigned.isWarning .detail.icon,
.repository #rev-list .sha.label.isSigned.isWarning .detail.icon, .repository #rev-list .sha.label.isSigned.isWarning .detail.icon,
@ -1418,14 +1384,6 @@
background: var(--color-green-badge-bg); background: var(--color-green-badge-bg);
} }
.repository #commits-table td.sha .sha.label.isSigned.isVerified .shortsha,
.repository #repo-files-table .sha.label.isSigned.isVerified .shortsha,
.repository #rev-list .sha.label.isSigned.isVerified .shortsha,
.repository .timeline-item.commits-list .singular-commit .sha.label.isSigned.isVerified .shortsha {
display: inline-block;
padding-top: 1px;
}
.repository #commits-table td.sha .sha.label.isSigned.isVerified .detail.icon, .repository #commits-table td.sha .sha.label.isSigned.isVerified .detail.icon,
.repository #repo-files-table .sha.label.isSigned.isVerified .detail.icon, .repository #repo-files-table .sha.label.isSigned.isVerified .detail.icon,
.repository #rev-list .sha.label.isSigned.isVerified .detail.icon, .repository #rev-list .sha.label.isSigned.isVerified .detail.icon,
@ -1449,14 +1407,6 @@
background: var(--color-yellow-badge-bg); background: var(--color-yellow-badge-bg);
} }
.repository #commits-table td.sha .sha.label.isSigned.isVerifiedUntrusted .shortsha,
.repository #repo-files-table .sha.label.isSigned.isVerifiedUntrusted .shortsha,
.repository #rev-list .sha.label.isSigned.isVerifiedUntrusted .shortsha,
.repository .timeline-item.commits-list .singular-commit .sha.label.isSigned.isVerifiedUntrusted .shortsha {
display: inline-block;
padding-top: 1px;
}
.repository #commits-table td.sha .sha.label.isSigned.isVerifiedUntrusted .detail.icon, .repository #commits-table td.sha .sha.label.isSigned.isVerifiedUntrusted .detail.icon,
.repository #repo-files-table .sha.label.isSigned.isVerifiedUntrusted .detail.icon, .repository #repo-files-table .sha.label.isSigned.isVerifiedUntrusted .detail.icon,
.repository #rev-list .sha.label.isSigned.isVerifiedUntrusted .detail.icon, .repository #rev-list .sha.label.isSigned.isVerifiedUntrusted .detail.icon,
@ -1480,14 +1430,6 @@
background: var(--color-orange-badge-bg); background: var(--color-orange-badge-bg);
} }
.repository #commits-table td.sha .sha.label.isSigned.isVerifiedUnmatched .shortsha,
.repository #repo-files-table .sha.label.isSigned.isVerifiedUnmatched .shortsha,
.repository #rev-list .sha.label.isSigned.isVerifiedUnmatched .shortsha,
.repository .timeline-item.commits-list .singular-commit .sha.label.isSigned.isVerifiedUnmatched .shortsha {
display: inline-block;
padding-top: 1px;
}
.repository #commits-table td.sha .sha.label.isSigned.isVerifiedUnmatched .detail.icon, .repository #commits-table td.sha .sha.label.isSigned.isVerifiedUnmatched .detail.icon,
.repository #repo-files-table .sha.label.isSigned.isVerifiedUnmatched .detail.icon, .repository #repo-files-table .sha.label.isSigned.isVerifiedUnmatched .detail.icon,
.repository #rev-list .sha.label.isSigned.isVerifiedUnmatched .detail.icon, .repository #rev-list .sha.label.isSigned.isVerifiedUnmatched .detail.icon,
@ -2691,11 +2633,6 @@ tbody.commit-list {
line-height: initial; line-height: initial;
} }
/* commit history list */
.repository:not(.diff) .commit-body {
margin: 0;
}
/* PR-comment */ /* PR-comment */
.repository:not(.diff) .timeline-item .commit-body { .repository:not(.diff) .timeline-item .commit-body {
margin-left: 40px; margin-left: 40px;