mirror of https://github.com/go-gitea/gitea.git
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>
This commit is contained in:
silverwind
GitHub
parent
9264811217
commit
df9a78cd04
|
|
@ -2632,6 +2632,7 @@ release.new_release = New Release
|
|||
release.draft = Draft
|
||||
release.prerelease = Pre-Release
|
||||
release.stable = Stable
|
||||
release.latest = Latest
|
||||
release.compare = Compare
|
||||
release.edit = edit
|
||||
release.ahead.commits = <strong>%d</strong> commits
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
|
||||
{{$treeNamesLen := len .TreeNames}}
|
||||
{{$isTreePathRoot := eq $treeNamesLen 0}}
|
||||
{{$showSidebar := $isTreePathRoot}}
|
||||
{{$showSidebar := and $isTreePathRoot (not .HideRepoInfo) (not .IsBlame)}}
|
||||
<div class="{{Iif $showSidebar "repo-grid-filelist-sidebar" "repo-grid-filelist-only"}}">
|
||||
<div class="repo-home-filelist">
|
||||
{{template "repo/sub_menu" .}}
|
||||
|
|
@ -130,8 +130,8 @@
|
|||
</div>
|
||||
|
||||
{{if $showSidebar}}
|
||||
<div class="repo-home-sidebar-top">{{template "repo/home_sidebar_top" .}}</div>
|
||||
<div class="repo-home-sidebar-bottom">{{template "repo/home_sidebar_bottom" .}}</div>
|
||||
{{template "repo/home_sidebar_top" .}}
|
||||
{{template "repo/home_sidebar_bottom" .}}
|
||||
{{end}}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
<div class="flex-list">
|
||||
<div class="repo-home-sidebar-bottom">
|
||||
<div class="flex-list">
|
||||
{{if .LatestRelease}}
|
||||
<div class="flex-item">
|
||||
<div class="flex-item-main">
|
||||
|
|
@ -16,7 +17,7 @@
|
|||
<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>
|
||||
{{template "repo/release/label" (dict "Release" .LatestRelease "IsLatest" true)}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-item-body">
|
||||
|
|
@ -56,4 +57,5 @@
|
|||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,32 +1,34 @@
|
|||
<form class="ignore-dirty tw-flex tw-flex-1 tw-mt-1" action="{{.RepoLink}}/search" method="get">
|
||||
<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"}}
|
||||
<input name="q" size="10" placeholder="{{ctx.Locale.Tr "search.code_kind"}}"> {{template "shared/search/button"}}
|
||||
</div>
|
||||
</form>
|
||||
</form>
|
||||
|
||||
<div class="flex-list">
|
||||
<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">
|
||||
<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}}
|
||||
{{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 */}}
|
||||
|
||||
{{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-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">
|
||||
<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}}
|
||||
|
|
@ -35,34 +37,34 @@
|
|||
{{end}}
|
||||
<div class="text"></div>
|
||||
</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}}
|
||||
<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>
|
||||
</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}}
|
||||
|
|
@ -33,13 +33,7 @@
|
|||
<h4 class="release-list-title tw-break-anywhere">
|
||||
{{if $.PageIsSingleTag}}{{$release.Title}}{{else}}<a class="muted" href="{{$.RepoLink}}/releases/tag/{{$release.TagName | PathEscapeSegments}}">{{$release.Title}}</a>{{end}}
|
||||
{{template "repo/commit_statuses" dict "Status" $info.CommitStatus "Statuses" $info.CommitStatuses "AdditionalClasses" "tw-flex"}}
|
||||
{{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}}
|
||||
{{template "repo/release/label" (dict "Release" $release)}}
|
||||
</h4>
|
||||
<div>
|
||||
{{if and $.CanCreateRelease (not $.PageIsSingleTag)}}
|
||||
|
|
|
|||
|
|
@ -101,11 +101,6 @@
|
|||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.repository .repo-description {
|
||||
font-size: 16px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.commit-summary {
|
||||
flex: 1;
|
||||
overflow-wrap: anywhere;
|
||||
|
|
|
|||
|
|
@ -4,22 +4,24 @@
|
|||
grid-template-rows: auto auto 1fr;
|
||||
}
|
||||
|
||||
.repo-grid-filelist-sidebar .repo-home-filelist {
|
||||
.repo-home-filelist {
|
||||
min-width: 0;
|
||||
grid-column: 1;
|
||||
grid-row: 1 / 4;
|
||||
}
|
||||
|
||||
.repo-grid-filelist-sidebar .repo-home-sidebar-top {
|
||||
.repo-home-sidebar-top {
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
padding-left: 1em;
|
||||
}
|
||||
.repo-grid-filelist-sidebar .repo-home-sidebar-bottom {
|
||||
|
||||
.repo-home-sidebar-bottom {
|
||||
grid-column: 2;
|
||||
grid-row: 2;
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
.repo-home-sidebar-bottom .flex-list > :first-child {
|
||||
border-top: 1px solid var(--color-secondary); /* same to .flex-list > .flex-item + .flex-item */
|
||||
}
|
||||
|
|
@ -29,16 +31,16 @@
|
|||
grid-template-columns: 100%;
|
||||
grid-template-rows: auto auto auto;
|
||||
}
|
||||
.repo-grid-filelist-sidebar .repo-home-filelist {
|
||||
.repo-home-filelist {
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
}
|
||||
.repo-grid-filelist-sidebar .repo-home-sidebar-top {
|
||||
.repo-home-sidebar-top {
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
padding-left: 0;
|
||||
}
|
||||
.repo-grid-filelist-sidebar .repo-home-sidebar-bottom {
|
||||
.repo-home-sidebar-bottom {
|
||||
grid-column: 1;
|
||||
grid-row: 3;
|
||||
padding-left: 0;
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ export function initRepoTopicBar() {
|
|||
let lastErrorToast: Toast;
|
||||
|
||||
mgrBtn.addEventListener('click', () => {
|
||||
hideElem(viewDiv);
|
||||
hideElem([viewDiv, mgrBtn]);
|
||||
showElem(editDiv);
|
||||
topicDropdown.querySelector<HTMLInputElement>('input.search').focus();
|
||||
});
|
||||
|
|
@ -24,7 +24,7 @@ export function initRepoTopicBar() {
|
|||
document.querySelector('#cancel_topic_edit').addEventListener('click', () => {
|
||||
lastErrorToast?.hideToast();
|
||||
hideElem(editDiv);
|
||||
showElem(viewDiv);
|
||||
showElem([viewDiv, mgrBtn]);
|
||||
mgrBtn.focus();
|
||||
});
|
||||
|
||||
|
|
@ -55,7 +55,7 @@ export function initRepoTopicBar() {
|
|||
}
|
||||
}
|
||||
hideElem(editDiv);
|
||||
showElem(viewDiv);
|
||||
showElem([viewDiv, mgrBtn]);
|
||||
}
|
||||
} else if (response.status === 422) {
|
||||
// how to test: input topic like " invalid topic " (with spaces), and select it from the list, then "Save"
|
||||
|
|
|
|||
Loading…
Reference in New Issue