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 <img width="468" alt="Screen Shot 2022-11-07 at 22 10 44" src="https://user-images.githubusercontent.com/115237/200417500-149f40f5-2376-42b4-92a7-d7eba3ac359d.png"> <img width="1015" alt="Screen Shot 2022-11-07 at 22 27 14" src="https://user-images.githubusercontent.com/115237/200419201-b28f39d6-fe9e-4049-8023-b301c9bae528.png"> <img width="1019" alt="Screen Shot 2022-11-07 at 22 27 27" src="https://user-images.githubusercontent.com/115237/200419206-3f07d988-42f6-421d-8ba9-303a0d59e711.png"> <img width="709" alt="Screen Shot 2022-11-07 at 22 42 10" src="https://user-images.githubusercontent.com/115237/200421671-f0393cde-2d8f-4e1f-a788-f1f51fc4807c.png"> <img width="713" alt="Screen Shot 2022-11-07 at 22 42 27" src="https://user-images.githubusercontent.com/115237/200421676-5797f8cf-dfe8-4dd6-85d4-dc69e31a9912.png"> <img width="406" alt="image" src="https://user-images.githubusercontent.com/115237/200418220-8c3f7549-61b4-4661-935e-39e1352f7851.png"> <img width="416" alt="Screen Shot 2022-11-07 at 22 21 36" src="https://user-images.githubusercontent.com/115237/200418107-cdb0eb6f-1292-469c-b89a-2cb13f24173c.png"> Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
This commit is contained in:
silverwind
GitHub
parent
74874d065f
commit
e2fa84fddc
5 changed files with 80 additions and 41 deletions
|
|
@ -36,21 +36,21 @@
|
|||
</h3>
|
||||
<div class="download df ac">
|
||||
{{if $.Permission.CanRead $.UnitTypeCode}}
|
||||
<a class="mr-3 mono" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}}</a>
|
||||
<a class="mr-3 mono muted" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}}</a>
|
||||
{{if not $.DisableDownloadSourceArchives}}
|
||||
<a class="archive-link mr-3" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.zip" rel="nofollow">{{svg "octicon-file-zip" 16 "mr-2"}}ZIP</a>
|
||||
<a class="archive-link mr-3" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip" 16 "mr-2"}}TAR.GZ</a>
|
||||
<a class="archive-link mr-3 muted" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.zip" rel="nofollow">{{svg "octicon-file-zip" 16 "mr-2"}}ZIP</a>
|
||||
<a class="archive-link mr-3 muted" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip" 16 "mr-2"}}TAR.GZ</a>
|
||||
{{end}}
|
||||
{{if (and $.CanCreateRelease $release.IsTag)}}
|
||||
<a class="mr-3" href="{{$.RepoLink}}/releases/new?tag={{.TagName}}">{{svg "octicon-tag" 16 "mr-2"}}{{$.locale.Tr "repo.release.new_release"}}</a>
|
||||
<a class="mr-3 muted" href="{{$.RepoLink}}/releases/new?tag={{.TagName}}">{{svg "octicon-tag" 16 "mr-2"}}{{$.locale.Tr "repo.release.new_release"}}</a>
|
||||
{{end}}
|
||||
{{if (and ($.Permission.CanWrite $.UnitTypeCode) $release.IsTag)}}
|
||||
<a class="ui red delete-button mr-3" data-url="{{$.RepoLink}}/tags/delete" data-id="{{.ID}}">
|
||||
<a class="ui delete-button mr-3 muted" data-url="{{$.RepoLink}}/tags/delete" data-id="{{.ID}}">
|
||||
{{svg "octicon-trash" 16 "mr-2"}}{{$.locale.Tr "repo.release.delete_tag"}}
|
||||
</a>
|
||||
{{end}}
|
||||
{{if (not $release.IsTag)}}
|
||||
<a class="mr-3" href="{{$.RepoLink}}/releases/tag/{{.TagName | PathEscapeSegments}}">{{svg "octicon-tag" 16 "mr-2"}}{{$.locale.Tr "repo.release.detail"}}</a>
|
||||
<a class="mr-3 muted" href="{{$.RepoLink}}/releases/tag/{{.TagName | PathEscapeSegments}}">{{svg "octicon-tag" 16 "mr-2"}}{{$.locale.Tr "repo.release.detail"}}</a>
|
||||
{{end}}
|
||||
{{end}}
|
||||
</div>
|
||||
|
|
@ -69,19 +69,10 @@
|
|||
{{if .IsTag}}
|
||||
{{if .CreatedUnix}}<span class="time">{{TimeSinceUnix .CreatedUnix $.locale}}</span>{{end}}
|
||||
{{else}}
|
||||
{{if .IsDraft}}
|
||||
<span class="ui yellow label">{{$.locale.Tr "repo.release.draft"}}</span>
|
||||
{{else if .IsPrerelease}}
|
||||
<span class="ui orange label">{{$.locale.Tr "repo.release.prerelease"}}</span>
|
||||
{{else}}
|
||||
<span class="ui green label">{{$.locale.Tr "repo.release.stable"}}</span>
|
||||
{{end}}
|
||||
<span class="tag text blue">
|
||||
<a class="df ac je" href="{{if not .Sha1}}#{{else}}{{$.RepoLink}}/src/tag/{{.TagName | PathEscapeSegments}}{{end}}" rel="nofollow">{{svg "octicon-tag" 16 "mr-2"}}{{.TagName}}</a>
|
||||
</span>
|
||||
<a class="df ac je muted" href="{{if not .Sha1}}#{{else}}{{$.RepoLink}}/src/tag/{{.TagName | PathEscapeSegments}}{{end}}" rel="nofollow">{{svg "octicon-tag" 16 "mr-2"}}{{.TagName}}</a>
|
||||
{{if .Sha1}}
|
||||
<span class="commit">
|
||||
<a class="mono" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}}</a>
|
||||
<a class="mono muted" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}}</a>
|
||||
</span>
|
||||
{{template "repo/branch_dropdown" dict "root" $ "release" .}}
|
||||
{{end}}
|
||||
|
|
@ -89,36 +80,56 @@
|
|||
</div>
|
||||
<div class="ui twelve wide column detail">
|
||||
{{if .IsTag}}
|
||||
<h4>
|
||||
<a href="{{$.RepoLink}}/src/tag/{{.TagName | PathEscapeSegments}}" rel="nofollow">{{svg "octicon-tag" 16 "mr-2"}}{{.TagName}}</a>
|
||||
<div class="df ac sb fw mb-3">
|
||||
<h4 class="release-list-title df ac">
|
||||
<a class="df ac" href="{{$.RepoLink}}/src/tag/{{.TagName | PathEscapeSegments}}" rel="nofollow">{{svg "octicon-tag" 24 "mr-3"}}{{.TagName}}</a>
|
||||
</h4>
|
||||
</div>
|
||||
<p class="text grey">
|
||||
{{if gt .Publisher.ID 0}}
|
||||
<span class="author">
|
||||
{{avatar .Publisher 20}}
|
||||
<a href="{{.Publisher.HomeLink}}">{{.Publisher.Name}}</a>
|
||||
</span>
|
||||
<span class="released">
|
||||
{{$.locale.Tr "repo.released_this"}}
|
||||
</span>
|
||||
{{if .CreatedUnix}}
|
||||
<span class="time">{{TimeSinceUnix .CreatedUnix $.locale}}</span>
|
||||
{{end}}
|
||||
|
|
||||
{{end}}
|
||||
<span class="ahead"><a href="{{$.RepoLink}}/compare/{{.TagName | PathEscapeSegments}}{{if .Target}}...{{.Target | PathEscapeSegments}}{{end}}">{{$.locale.Tr "repo.release.ahead.commits" .NumCommitsBehind | Str2html}}</a> {{$.locale.Tr "repo.release.ahead.target" $.DefaultBranch}}</span>
|
||||
</p>
|
||||
<div class="download">
|
||||
{{if $.Permission.CanRead $.UnitTypeCode}}
|
||||
<a class="mono" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}}</a>
|
||||
<a class="mono muted" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}}</a>
|
||||
{{if not $.DisableDownloadSourceArchives}}
|
||||
<a class="archive-link" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.zip" rel="nofollow">{{svg "octicon-file-zip"}} ZIP</a>
|
||||
<a class="archive-link" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip"}} TAR.GZ</a>
|
||||
<a class="archive-link muted" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.zip" rel="nofollow">{{svg "octicon-file-zip"}} ZIP</a>
|
||||
<a class="archive-link muted" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip"}} TAR.GZ</a>
|
||||
{{end}}
|
||||
{{end}}
|
||||
</div>
|
||||
{{else}}
|
||||
<div class="df ac sb fw mb-3">
|
||||
<h4 class="release-list-title df ac">
|
||||
<a href="{{$.RepoLink}}/releases/tag/{{.TagName | PathEscapeSegments}}">{{.Title}}</a>
|
||||
{{if $.CanCreateRelease}}
|
||||
<small class="ml-2">
|
||||
(<a href="{{$.RepoLink}}/releases/edit/{{.TagName | PathEscapeSegments}}" rel="nofollow">{{$.locale.Tr "repo.release.edit"}}</a>)
|
||||
</small>
|
||||
{{if .IsDraft}}
|
||||
<span class="ui yellow label ml-3 mt-1">{{$.locale.Tr "repo.release.draft"}}</span>
|
||||
{{else if .IsPrerelease}}
|
||||
<span class="ui orange label ml-3 mt-1">{{$.locale.Tr "repo.release.prerelease"}}</span>
|
||||
{{else if not .IsTag}}
|
||||
<span class="ui green label ml-3 mt-1">{{$.locale.Tr "repo.release.stable"}}</span>
|
||||
{{end}}
|
||||
</h4>
|
||||
<div class="df ac">
|
||||
{{if $.CanCreateRelease}}
|
||||
<a class="muted tooltip ml-3 df ac" data-content="{{$.locale.Tr "repo.release.edit"}}" href="{{$.RepoLink}}/releases/edit/{{.TagName | PathEscapeSegments}}" rel="nofollow">
|
||||
{{svg "octicon-pencil"}}
|
||||
</a>
|
||||
{{end}}
|
||||
</div>
|
||||
</div>
|
||||
<p class="text grey">
|
||||
<span class="author">
|
||||
{{if .OriginalAuthor}}
|
||||
|
|
|
|||
|
|
@ -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)
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
Loading…
Reference in a new issue