From e2fa84fddc80368c0315616870b8c75592397422 Mon Sep 17 00:00:00 2001 From: silverwind Date: Tue, 6 Dec 2022 14:15:46 +0100 Subject: [PATCH] Release and Tag List tweaks (#21712) - Reduce font size on tag list and add muted links - Move Release tag to right side on release list - Move Release edit button to far-right and make it icon-only - Add styles for error dropdowns, seen on release edit page - Make the release page slightly more mobile-friendly Screen Shot 2022-11-07 at 22 10 44 Screen Shot 2022-11-07 at 22 27 14 Screen Shot 2022-11-07 at 22 27 27 Screen Shot 2022-11-07 at 22 42 10 Screen Shot 2022-11-07 at 22 42 27 image Screen Shot 2022-11-07 at 22 21 36 Co-authored-by: Lunny Xiao --- templates/repo/release/list.tmpl | 73 ++++++++++++++---------- tests/integration/release_test.go | 2 +- web_src/less/_base.less | 31 +++++++++- web_src/less/_repository.less | 13 ++--- web_src/less/themes/theme-arc-green.less | 2 + 5 files changed, 80 insertions(+), 41 deletions(-) diff --git a/templates/repo/release/list.tmpl b/templates/repo/release/list.tmpl index 6abb240cc34..5f668d74a9f 100644 --- a/templates/repo/release/list.tmpl +++ b/templates/repo/release/list.tmpl @@ -36,21 +36,21 @@ @@ -69,19 +69,10 @@ {{if .IsTag}} {{if .CreatedUnix}}{{TimeSinceUnix .CreatedUnix $.locale}}{{end}} {{else}} - {{if .IsDraft}} - {{$.locale.Tr "repo.release.draft"}} - {{else if .IsPrerelease}} - {{$.locale.Tr "repo.release.prerelease"}} - {{else}} - {{$.locale.Tr "repo.release.stable"}} - {{end}} - - {{svg "octicon-tag" 16 "mr-2"}}{{.TagName}} - + {{svg "octicon-tag" 16 "mr-2"}}{{.TagName}} {{if .Sha1}} - {{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}} + {{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}} {{template "repo/branch_dropdown" dict "root" $ "release" .}} {{end}} @@ -89,36 +80,56 @@
{{if .IsTag}} -

- {{svg "octicon-tag" 16 "mr-2"}}{{.TagName}} -

+

{{if gt .Publisher.ID 0}} {{avatar .Publisher 20}} {{.Publisher.Name}} + + {{$.locale.Tr "repo.released_this"}} + + {{if .CreatedUnix}} + {{TimeSinceUnix .CreatedUnix $.locale}} + {{end}} + | {{end}} {{$.locale.Tr "repo.release.ahead.commits" .NumCommitsBehind | Str2html}} {{$.locale.Tr "repo.release.ahead.target" $.DefaultBranch}}

{{else}} -

- {{.Title}} - {{if $.CanCreateRelease}} - - ({{$.locale.Tr "repo.release.edit"}}) - - {{end}} -

+
+

+ {{.Title}} + {{if .IsDraft}} + {{$.locale.Tr "repo.release.draft"}} + {{else if .IsPrerelease}} + {{$.locale.Tr "repo.release.prerelease"}} + {{else if not .IsTag}} + {{$.locale.Tr "repo.release.stable"}} + {{end}} +

+
+ {{if $.CanCreateRelease}} + + {{svg "octicon-pencil"}} + + {{end}} +
+

{{if .OriginalAuthor}} diff --git a/tests/integration/release_test.go b/tests/integration/release_test.go index b4f7560fa33..3fcd4a5b5e8 100644 --- a/tests/integration/release_test.go +++ b/tests/integration/release_test.go @@ -53,7 +53,7 @@ func checkLatestReleaseAndCount(t *testing.T, session *TestSession, repoURL, ver resp := session.MakeRequest(t, req, http.StatusOK) htmlDoc := NewHTMLParser(t, resp.Body) - labelText := htmlDoc.doc.Find("#release-list > li .meta .label").First().Text() + labelText := htmlDoc.doc.Find("#release-list > li .detail .label").First().Text() assert.EqualValues(t, label, labelText) titleText := htmlDoc.doc.Find("#release-list > li .detail h4 a").First().Text() assert.EqualValues(t, version, titleText) diff --git a/web_src/less/_base.less b/web_src/less/_base.less index e156ccd6cc0..022afcea927 100644 --- a/web_src/less/_base.less +++ b/web_src/less/_base.less @@ -108,6 +108,8 @@ --color-diff-inactive: #f2f2f2; --color-error-border: #e0b4b4; --color-error-bg: #fff6f6; + --color-error-bg-active: #fbb; + --color-error-bg-hover: #fdd; --color-error-text: #9f3a38; --color-success-border: #a3c293; --color-success-bg: #fcfff5; @@ -1293,6 +1295,11 @@ a.ui.card:hover, .ui.form .fields.error .field input[type="text"], .ui.form .fields.error .field input[type="file"], .ui.form .fields.error .field input[type="url"], +.ui.form .fields.error .field .ui.dropdown, +.ui.form .fields.error .field .ui.dropdown .item, +.ui.form .field.error .ui.dropdown, +.ui.form .field.error .ui.dropdown .text, +.ui.form .field.error .ui.dropdown .item, .ui.form .field.error textarea, .ui.form .field.error select, .ui.form .field.error input:not([type]), @@ -1321,10 +1328,32 @@ a.ui.card:hover, .ui.form .field.error input[type="file"]:focus, .ui.form .field.error input[type="url"]:focus { background-color: var(--color-error-bg); - border: 1px solid var(--color-error-border); + border-color: var(--color-error-border); color: var(--color-error-text); } +.ui.form .fields.error .field .ui.dropdown, +.ui.form .field.error .ui.dropdown, +.ui.form .fields.error .field .ui.dropdown:hover, +.ui.form .field.error .ui.dropdown:hover { + border-color: var(--color-error-border) !important; +} + +.ui.form .fields.error .field .ui.dropdown .menu .item:hover, +.ui.form .field.error .ui.dropdown .menu .item:hover { + background-color: var(--color-error-bg-hover); +} + +.ui.form .fields.error .field .ui.dropdown .menu .active.item, +.ui.form .field.error .ui.dropdown .menu .active.item { + background-color: var(--color-error-bg-active) !important; +} + +.ui.form .fields.error .dropdown .menu, +.ui.form .field.error .dropdown .menu { + border-color: var(--color-error-border) !important; +} + .ui.loading.loading.input > i.icon svg { visibility: hidden; } diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index 3eb0178d373..0f318fa53cd 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -1855,11 +1855,13 @@ border-top: 1px solid var(--color-secondary); margin-top: 20px; padding-top: 15px; + padding-left: 0; .release-list-title { font-size: 2rem; font-weight: normal; - margin-top: -6px; + margin-top: -4px; + margin-bottom: 0; } > li { @@ -1879,11 +1881,6 @@ margin-right: 0; } - .tag:not(.icon) { - display: block; - margin-top: 15px; - } - .commit { display: block; margin-top: 10px; @@ -1903,7 +1900,7 @@ .author { img { - margin-bottom: -3px; + margin-bottom: 3px; } } @@ -1966,7 +1963,7 @@ } .release-tag-name { - font-size: 20px; + font-size: 18px; font-weight: normal; } } diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less index 8c05ad278f4..2f06f33aca7 100644 --- a/web_src/less/themes/theme-arc-green.less +++ b/web_src/less/themes/theme-arc-green.less @@ -97,6 +97,8 @@ --color-diff-inactive: #353846; --color-error-border: #a04141; --color-error-bg: #522; + --color-error-bg-active: #744; + --color-error-bg-hover: #633; --color-error-text: #f9cbcb; --color-success-border: #458a57; --color-success-bg: #284034;