From 7ea2a910cebaf51cfd13c0941029c404e408ae54 Mon Sep 17 00:00:00 2001 From: wxiaoguang Date: Thu, 28 Sep 2023 12:04:32 +0800 Subject: [PATCH] Improve branch list UI (#27319) 1. Put the `"octicon-shield-lock"` into the flex container, then it doesn't need a separate flex box 2. Remove some unnecessary `gt-df` helpers 3. Make `btn` button has the same flex behavior as `ui button` ![image](https://github.com/go-gitea/gitea/assets/2114189/60ce75f7-7fac-4157-9c42-91c7dee9300e) ![image](https://github.com/go-gitea/gitea/assets/2114189/ea606baf-6f52-41e1-b964-c4840d3b1529) --- templates/repo/branch/list.tmpl | 22 +++++++++------------- templates/repo/commit_status.tmpl | 2 -- web_src/css/base.css | 1 + web_src/css/modules/button.css | 2 +- 4 files changed, 11 insertions(+), 16 deletions(-) diff --git a/templates/repo/branch/list.tmpl b/templates/repo/branch/list.tmpl index f554c851d3..370a412efb 100644 --- a/templates/repo/branch/list.tmpl +++ b/templates/repo/branch/list.tmpl @@ -19,12 +19,10 @@ -
- {{if .DefaultBranchBranch.IsProtected}} - {{svg "octicon-shield-lock"}} - {{end}} +
+ {{if .DefaultBranchBranch.IsProtected}}{{svg "octicon-shield-lock"}}{{end}} {{.DefaultBranchBranch.DBBranch.Name}} - + {{template "repo/commit_statuses" dict "Status" (index $.CommitStatus .DefaultBranchBranch.DBBranch.CommitID) "Statuses" (index $.CommitStatuses .DefaultBranchBranch.DBBranch.CommitID)}}

{{svg "octicon-git-commit" 16 "gt-mr-2"}}{{ShortSha .DefaultBranchBranch.DBBranch.CommitID}} · {{RenderCommitMessage $.Context .DefaultBranchBranch.DBBranch.CommitMessage .RepoLink .Repository.ComposeMetas}} · {{ctx.Locale.Tr "org.repo_updated"}} {{TimeSince .DefaultBranchBranch.DBBranch.CommitTime.AsTime ctx.Locale}}{{if .DefaultBranchBranch.DBBranch.Pusher}}  {{template "shared/user/avatarlink" dict "user" .DefaultBranchBranch.DBBranch.Pusher}}{{template "shared/user/namelink" .DefaultBranchBranch.DBBranch.Pusher}}{{end}}

@@ -91,21 +89,19 @@ {{if .DBBranch.IsDeleted}} -
+
{{.DBBranch.Name}} - +

{{ctx.Locale.Tr "repo.branch.deleted_by" .DBBranch.DeletedBy.Name}} {{TimeSinceUnix .DBBranch.DeletedUnix ctx.Locale}}

{{else}} -
- {{if .IsProtected}} - {{svg "octicon-shield-lock"}} - {{end}} +
+ {{if .IsProtected}}{{svg "octicon-shield-lock"}}{{end}} {{.DBBranch.Name}} - + {{template "repo/commit_statuses" dict "Status" (index $.CommitStatus .DBBranch.CommitID) "Statuses" (index $.CommitStatuses .DBBranch.CommitID)}}
-

{{svg "octicon-git-commit" 16 "gt-mr-2"}}{{ShortSha .DBBranch.CommitID}} · {{RenderCommitMessage $.Context .DBBranch.CommitMessage $.RepoLink $.Repository.ComposeMetas}} · {{ctx.Locale.Tr "org.repo_updated"}} {{TimeSince .DBBranch.CommitTime.AsTime ctx.Locale}}{{if .DBBranch.Pusher}}  {{template "shared/user/avatarlink" dict "user" .DBBranch.Pusher}}  {{template "shared/user/namelink" .DBBranch.Pusher}}{{end}}

+

{{svg "octicon-git-commit" 16 "gt-mr-2"}}{{ShortSha .DBBranch.CommitID}} · {{RenderCommitMessage $.Context .DBBranch.CommitMessage $.RepoLink $.Repository.ComposeMetas}} · {{ctx.Locale.Tr "org.repo_updated"}} {{TimeSince .DBBranch.CommitTime.AsTime ctx.Locale}}{{if .DBBranch.Pusher}}  {{template "shared/user/avatarlink" dict "user" .DBBranch.Pusher}}  {{template "shared/user/namelink" .DBBranch.Pusher}}{{end}}

{{end}} diff --git a/templates/repo/commit_status.tmpl b/templates/repo/commit_status.tmpl index 3dc1da61d3..ebd8a55f65 100644 --- a/templates/repo/commit_status.tmpl +++ b/templates/repo/commit_status.tmpl @@ -1,5 +1,4 @@ - {{if eq .State "pending"}} {{svg "octicon-dot-fill" 18 "commit-status icon text yellow"}} {{end}} @@ -12,4 +11,3 @@ {{if eq .State "failure"}} {{svg "octicon-x" 18 "commit-status icon text red"}} {{end}} - diff --git a/web_src/css/base.css b/web_src/css/base.css index 5efb0bfae5..1a4e9d16a1 100644 --- a/web_src/css/base.css +++ b/web_src/css/base.css @@ -2242,6 +2242,7 @@ table th[data-sortt-desc] .svg { right: 2em; } +.btn, .ui.ui.button, .ui.ui.dropdown, .ui.ui.label, diff --git a/web_src/css/modules/button.css b/web_src/css/modules/button.css index f292231319..0d30249c9c 100644 --- a/web_src/css/modules/button.css +++ b/web_src/css/modules/button.css @@ -30,7 +30,7 @@ color: var(--color-red); } -/* btn is a plain button without any opinionated styling */ +/* btn is a plain button without any opinionated styling, it only uses flex for vertical alignment like ".ui.button" in base.css */ .btn { background: transparent;