<div class="repo-home-sidebar-top">
	<form class="ignore-dirty tw-flex tw-flex-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>
				<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}}
						<span class="flex-text-block muted" {{if not (eq .Repository.Size 0)}}data-tooltip-placement="top" data-tooltip-content="{{.Repository.SizeDetailsString}}"{{end}}>
							{{$fileSizeFormatted := FileSize .Repository.Size}}{{/* the formatted string is always "{val} {unit}" */}}
							{{$fileSizeFields := StringUtils.Split $fileSizeFormatted " "}}
							{{svg "octicon-database"}} <b>{{ctx.Locale.PrettyNumber (index $fileSizeFields 0)}}</b> {{index $fileSizeFields 1}}
						</span>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
