mirror of https://github.com/go-gitea/gitea
Tweak repo sidebar (#32847)
Before and after: <img width="218" alt="Screenshot 2024-12-15 at 04 53 53" src="https://github.com/user-attachments/assets/299b1f0a-ba72-47c6-b662-a9d540d4d741" /> <img width="222" alt="Screenshot 2024-12-15 at 04 53 41" src="https://github.com/user-attachments/assets/5a2b5332-e324-4d20-82e9-21d1c850e826" /> Diff without whitespace: https://github.com/go-gitea/gitea/pull/32847/files?diff=unified&w=1 The `tw-mt-2` is fine even if the element renders empty: <img width="387" alt="image" src="https://github.com/user-attachments/assets/76a976e4-ba2e-48a5-9248-c361552a937a" /> --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>pull/32852/head^2
silverwind
2 months ago
committed by
GitHub
parent
9264811217
commit
df9a78cd04
@ -1,59 +1,61 @@ |
||||
<div class="flex-list"> |
||||
{{if .LatestRelease}} |
||||
<div class="flex-item"> |
||||
<div class="flex-item-main"> |
||||
<div class="flex-item-title"> |
||||
<a class="item muted" href="{{.Link}}/releases"> |
||||
{{ctx.Locale.Tr "repo.releases"}} |
||||
<span class="ui small label">{{.NumReleases}}</span> |
||||
</a> |
||||
</div> |
||||
<div class="flex-item"> |
||||
<div class="flex-item-icon"> |
||||
{{svg "octicon-tag" 16}} |
||||
<div class="repo-home-sidebar-bottom"> |
||||
<div class="flex-list"> |
||||
{{if .LatestRelease}} |
||||
<div class="flex-item"> |
||||
<div class="flex-item-main"> |
||||
<div class="flex-item-title"> |
||||
<a class="item muted" href="{{.Link}}/releases"> |
||||
{{ctx.Locale.Tr "repo.releases"}} |
||||
<span class="ui small label">{{.NumReleases}}</span> |
||||
</a> |
||||
</div> |
||||
<div class="flex-item-main"> |
||||
<div class="flex-item-header"> |
||||
<div class="flex-item-title tw-gap-2"> |
||||
<a class="gt-ellipsis muted" href="{{.LatestRelease.Link}}" title="{{.LatestRelease.Title}}">{{.LatestRelease.Title}}</a> |
||||
<span class="ui basic green label tw-h-100">{{ctx.Locale.Tr "latest"}}</span> |
||||
</div> |
||||
<div class="flex-item"> |
||||
<div class="flex-item-icon"> |
||||
{{svg "octicon-tag" 16}} |
||||
</div> |
||||
<div class="flex-item-body"> |
||||
<span class="time">{{DateUtils.TimeSince .LatestRelease.CreatedUnix}}</span> |
||||
<div class="flex-item-main"> |
||||
<div class="flex-item-header"> |
||||
<div class="flex-item-title tw-gap-2"> |
||||
<a class="gt-ellipsis muted" href="{{.LatestRelease.Link}}" title="{{.LatestRelease.Title}}">{{.LatestRelease.Title}}</a> |
||||
{{template "repo/release/label" (dict "Release" .LatestRelease "IsLatest" true)}} |
||||
</div> |
||||
</div> |
||||
<div class="flex-item-body"> |
||||
<span class="time">{{DateUtils.TimeSince .LatestRelease.CreatedUnix}}</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
{{end}} |
||||
{{end}} |
||||
|
||||
{{if and (not .IsEmptyRepo) .LanguageStats}} |
||||
<div class="flex-item"> |
||||
<div class="flex-item-main"> |
||||
<div class="flex-item-title"> |
||||
{{ctx.Locale.Tr "repo.repo_lang"}} |
||||
</div> |
||||
|
||||
<div class="flex-item-body"> |
||||
<div class="language-stats"> |
||||
{{range .LanguageStats}} |
||||
<div class="bar" style="width: {{.Percentage}}%; background-color: {{.Color}}" data-tooltip-placement="top" data-tooltip-content={{.Language}} data-tooltip-follow-cursor="horizontal"></div> |
||||
{{end}} |
||||
{{if and (not .IsEmptyRepo) .LanguageStats}} |
||||
<div class="flex-item"> |
||||
<div class="flex-item-main"> |
||||
<div class="flex-item-title"> |
||||
{{ctx.Locale.Tr "repo.repo_lang"}} |
||||
</div> |
||||
<div class="language-stats-details"> |
||||
{{range .LanguageStats}} |
||||
<div class="item"> |
||||
<i class="color-icon" style="background-color: {{.Color}}"></i> |
||||
<span class="tw-font-semibold"> |
||||
{{Iif (eq .Language "other") (ctx.Locale.Tr "repo.language_other") .Language}} |
||||
</span> |
||||
{{.Percentage}}% |
||||
</div> |
||||
{{end}} |
||||
|
||||
<div class="flex-item-body"> |
||||
<div class="language-stats"> |
||||
{{range .LanguageStats}} |
||||
<div class="bar" style="width: {{.Percentage}}%; background-color: {{.Color}}" data-tooltip-placement="top" data-tooltip-content={{.Language}} data-tooltip-follow-cursor="horizontal"></div> |
||||
{{end}} |
||||
</div> |
||||
<div class="language-stats-details"> |
||||
{{range .LanguageStats}} |
||||
<div class="item"> |
||||
<i class="color-icon" style="background-color: {{.Color}}"></i> |
||||
<span class="tw-font-semibold"> |
||||
{{Iif (eq .Language "other") (ctx.Locale.Tr "repo.language_other") .Language}} |
||||
</span> |
||||
{{.Percentage}}% |
||||
</div> |
||||
{{end}} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
{{end}} |
||||
</div> |
||||
{{end}} |
||||
</div> |
||||
|
||||
@ -1,68 +1,70 @@ |
||||
<form class="ignore-dirty tw-flex tw-flex-1 tw-mt-1" action="{{.RepoLink}}/search" method="get"> |
||||
<div class="ui small action input tw-flex-1"> |
||||
<input name="q" size="10" placeholder="{{ctx.Locale.Tr "search.code_kind"}}"> |
||||
{{template "shared/search/button"}} |
||||
</div> |
||||
</form> |
||||
<div class="repo-home-sidebar-top"> |
||||
<form class="ignore-dirty tw-flex tw-flex-1 tw-mt-1" action="{{.RepoLink}}/search" method="get"> |
||||
<div class="ui small action input tw-flex-1"> |
||||
<input name="q" size="10" placeholder="{{ctx.Locale.Tr "search.code_kind"}}"> {{template "shared/search/button"}} |
||||
</div> |
||||
</form> |
||||
|
||||
<div class="flex-list"> |
||||
<div class="flex-item"> |
||||
<div class="flex-item-main"> |
||||
<div class="flex-item-title"> |
||||
{{ctx.Locale.Tr "repo.repo_desc"}} |
||||
</div> |
||||
{{if and (not .HideRepoInfo) (not .IsBlame)}} |
||||
<div class="flex-item-body repo-description tw-break-anywhere tw-gap-2 tw-mt-2"> |
||||
{{- $description := .Repository.DescriptionHTML ctx -}} |
||||
{{if $description}}{{$description | RenderCodeBlock}}{{else}}{{ctx.Locale.Tr "repo.repo_no_desc"}}{{end}} |
||||
{{if .Repository.Website}}{{svg "octicon-link"}}<a href="{{.Repository.Website}}">{{.Repository.Website}}</a>{{end}} |
||||
</div> |
||||
<div class="tw-flex tw-items-center tw-flex-wrap tw-gap-2 tw-my-2" id="repo-topics"> |
||||
{{/* !!!! it SHOULD and MUST match the code in issue-home.js */}} |
||||
{{range .Topics}}<a class="repo-topic ui large label gt-ellipsis" title={{.Name}} href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=1">{{.Name}}</a>{{end}} |
||||
</div> |
||||
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}} |
||||
<button id="manage_topic" class="btn interact-fg tw-text-12">{{ctx.Locale.Tr "repo.topic.manage_topics"}}</button> |
||||
{{end}} |
||||
{{end}} |
||||
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}} |
||||
<div class="ui form tw-hidden flex-item-body tw-gap-2 tw-my-2" id="topic_edit"> |
||||
<div class="ui fluid multiple search selection dropdown tw-flex-wrap tw-flex-1"> |
||||
<input type="hidden" name="topics" value="{{range $i, $v := .Topics}}{{.Name}}{{if Eval $i "+" 1 "<" (len $.Topics)}},{{end}}{{end}}"> |
||||
{{range .Topics}} |
||||
{{/* keep the same layout as Fomantic UI generated labels */}} |
||||
<a class="ui label transition visible tw-cursor-default tw-inline-block repo-topic" data-value="{{.Name}}">{{.Name}}{{svg "octicon-x" 16 "delete icon"}}</a> |
||||
<div class="flex-list"> |
||||
<div class="flex-item"> |
||||
<div class="flex-item-main"> |
||||
<div class="flex-item-title">{{ctx.Locale.Tr "repo.repo_desc"}}</div> |
||||
<div class="flex-item-body tw-text-16"> |
||||
<div class="tw-flex tw-flex-col tw-gap-2 tw-mt-2"> |
||||
<div class="repo-description tw-break-anywhere tw-gap-2"> |
||||
{{- $description := .Repository.DescriptionHTML ctx -}} |
||||
{{if $description}}{{$description | RenderCodeBlock}}{{else}}{{ctx.Locale.Tr "repo.repo_no_desc"}}{{end}} |
||||
</div> |
||||
|
||||
{{if .Repository.Website}} |
||||
<a class="flex-text-block" href="{{.Repository.Website}}"> |
||||
{{svg "octicon-link" 16 "tw-text-text"}} <span class="tw-text-primary">{{.Repository.Website}}</span> |
||||
</a> |
||||
{{end}} |
||||
|
||||
<div id="repo-topics" class="flex-text-block tw-flex-wrap tw-gap-1 tw-my-1 tw-text-text"> |
||||
{{/* !!!! it SHOULD and MUST match the code in repo-home.ts */}} |
||||
{{range .Topics}}<a class="repo-topic ui large label gt-ellipsis" title={{.Name}} href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=1">{{.Name}}</a>{{end}} |
||||
</div> |
||||
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}} |
||||
<button id="manage_topic" class="btn interact-fg tw-mb-2 tw-text-12">{{ctx.Locale.Tr "repo.topic.manage_topics"}}</button> |
||||
<div class="ui form tw-hidden tw-my-2" id="topic_edit"> |
||||
<div class="ui fluid multiple search selection dropdown tw-flex-wrap tw-flex-1"> |
||||
<input type="hidden" name="topics" value="{{range $i, $v := .Topics}}{{.Name}}{{if Eval $i "+" 1 "<" (len $.Topics)}},{{end}}{{end}}"> |
||||
{{range .Topics}} |
||||
{{/* keep the same layout as Fomantic UI generated labels */}} |
||||
<a class="ui label transition visible tw-cursor-default tw-inline-block repo-topic" data-value="{{.Name}}">{{.Name}}{{svg "octicon-x" 16 "delete icon"}}</a> |
||||
{{end}} |
||||
<div class="text"></div> |
||||
</div> |
||||
<div class="tw-my-2"> |
||||
<button class="ui primary button" id="save_topic" data-link="{{.RepoLink}}/topics">{{ctx.Locale.Tr "save"}}</button> |
||||
<button class="ui basic button" id="cancel_topic_edit">{{ctx.Locale.Tr "cancel"}}</button> |
||||
</div> |
||||
</div> |
||||
{{end}} |
||||
|
||||
{{if .ReadmeExist}} |
||||
<a class="flex-text-block muted" href="{{.TreeLink}}/{{.FileName}}"> |
||||
{{svg "octicon-book"}} {{ctx.Locale.Tr "readme"}} |
||||
</a> |
||||
{{end}} |
||||
|
||||
{{if .DetectedRepoLicenses}} |
||||
<a class="flex-text-block muted" href="{{.RepoLink}}/src/{{.Repository.DefaultBranch}}/{{PathEscapeSegments .LicenseFileName}}" title="{{StringUtils.Join .DetectedRepoLicenses ", "}}"> |
||||
{{svg "octicon-law"}} {{if eq (len .DetectedRepoLicenses) 1}}{{index .DetectedRepoLicenses 0}}{{else}}{{ctx.Locale.Tr "repo.multiple_licenses"}}{{end}} |
||||
</a> |
||||
{{end}} |
||||
|
||||
{{if .CitiationExist}} |
||||
{{template "repo/cite/cite_modal" .}} |
||||
<a class="flex-text-block muted" id="cite-repo-button"> |
||||
{{svg "octicon-cross-reference"}} {{ctx.Locale.Tr "repo.cite_this_repo"}} |
||||
</a> |
||||
{{end}} |
||||
<div class="text"></div> |
||||
</div> |
||||
<div> |
||||
<button class="ui primary button" id="save_topic" data-link="{{.RepoLink}}/topics">{{ctx.Locale.Tr "save"}}</button> |
||||
<button class="ui basic button" id="cancel_topic_edit">{{ctx.Locale.Tr "cancel"}}</button> |
||||
</div> |
||||
</div> |
||||
{{end}} |
||||
{{if .ReadmeExist}} |
||||
<div class="flex-item-body tw-mt-2"> |
||||
<a class="flex-text-block muted" href="{{.TreeLink}}/{{.FileName}}"> |
||||
{{svg "octicon-book"}} {{ctx.Locale.Tr "readme"}} |
||||
</a> |
||||
</div> |
||||
{{end}} |
||||
{{if .DetectedRepoLicenses}} |
||||
<div class="flex-item-body"> |
||||
<a class="flex-text-block muted" href="{{.RepoLink}}/src/{{.Repository.DefaultBranch}}/{{PathEscapeSegments .LicenseFileName}}" title="{{StringUtils.Join .DetectedRepoLicenses ", "}}"> |
||||
{{svg "octicon-law"}} {{if eq (len .DetectedRepoLicenses) 1}}{{index .DetectedRepoLicenses 0}}{{else}}{{ctx.Locale.Tr "repo.multiple_licenses"}}{{end}} |
||||
</a> |
||||
</div> |
||||
{{end}} |
||||
{{if .CitiationExist}} |
||||
<div class="flex-item-body"> |
||||
{{template "repo/cite/cite_modal" .}} |
||||
<a class="flex-text-block muted" id="cite-repo-button"> |
||||
{{svg "octicon-cross-reference"}} {{ctx.Locale.Tr "repo.cite_this_repo"}} |
||||
</a> |
||||
</div> |
||||
{{end}} |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
@ -0,0 +1,14 @@ |
||||
{{/* |
||||
Template Attributes: |
||||
* Release: the release |
||||
* IsLatest: boolean indicating whether this is the latest release, optional |
||||
*/}} |
||||
{{if .IsLatest}} |
||||
<span class="ui green label">{{ctx.Locale.Tr "repo.release.latest"}}</span> |
||||
{{else if .Release.IsDraft}} |
||||
<span class="ui yellow label">{{ctx.Locale.Tr "repo.release.draft"}}</span> |
||||
{{else if .Release.IsPrerelease}} |
||||
<span class="ui orange label">{{ctx.Locale.Tr "repo.release.prerelease"}}</span> |
||||
{{else if (not .Release.IsTag)}} |
||||
<span class="ui green label">{{ctx.Locale.Tr "repo.release.stable"}}</span> |
||||
{{end}} |
||||
Loading…
Reference in new issue