forgejo/templates/projects/view.tmpl

<div class="ui two column stackable grid">
	<div class="column">
	</div>
	<div class="column right aligned">
		{{if .CanWriteProjects}}
			<a class="ui small green button show-modal item" data-modal="#new-board-item">{{.locale.Tr "new_project_column"}}</a>
		{{end}}
		<div class="ui small modal new-board-modal" id="new-board-item">
			<div class="header">
				{{$.locale.Tr "repo.projects.column.new"}}
			</div>
			<div class="content">
				<form class="ui form">
					<div class="required field">
						<label for="new_board">{{$.locale.Tr "repo.projects.column.new_title"}}</label>
						<input class="new-board" id="new_board" name="title" required>
					</div>

					<div class="field color-field">
						<label for="new_board_color">{{$.locale.Tr "repo.projects.column.color"}}</label>
						<div class="color picker column">
							<input class="color-picker" maxlength="7" placeholder="#c320f6" id="new_board_color_picker" name="color">
							<div class="column precolors">
								{{template "repo/issue/label_precolors"}}
							</div>
						</div>
					</div>

					<div class="text right actions">
						<button class="ui cancel button">{{$.locale.Tr "settings.cancel"}}</button>
						<button data-url="{{$.Link}}" class="ui primary button" id="new_board_submit">{{$.locale.Tr "repo.projects.column.new_submit"}}</button>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>
<div class="divider"></div>
<div class="ui two column stackable grid">
	<div class="column">
		<h2 class="project-title">{{$.Project.Title}}</h2>
		<div class="content project-description">{{$.Project.RenderedContent|Str2html}}</div>
	</div>
	{{if $.CanWriteProjects}}
		<div class="column right aligned">
			<div class="ui compact right mini menu">
				<a class="item" href="{{$.Link}}/edit?redirect=project">
					{{svg "octicon-pencil"}}
					<span class="gt-mx-3">{{$.locale.Tr "repo.issues.label_edit"}}</span>
				</a>
				{{if .Project.IsClosed}}
					<a class="item link-action" href data-url="{{$.Link}}/open">
						{{svg "octicon-check"}}
						<span class="gt-mx-3">{{$.locale.Tr "repo.projects.open"}}</span>
					</a>
				{{else}}
					<a class="item link-action" href data-url="{{$.Link}}/close">
						{{svg "octicon-skip"}}
						<span class="gt-mx-3">{{$.locale.Tr "repo.projects.close"}}</span>
					</a>
				{{end}}
				<a class="item delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.Project.ID}}">
					{{svg "octicon-trash"}}
					<span class="gt-mx-3">{{$.locale.Tr "repo.issues.label_delete"}}</span>
				</a>
			</div>
		</div>
	{{end}}
</div>

<div class="divider"></div>

<div id="project-board">
	<div class="board {{if .CanWriteProjects}}sortable{{end}}">
		{{range $board := .Boards}}
		<div class="ui segment board-column" style="background: {{.Color}} !important;" data-id="{{.ID}}" data-sorting="{{.Sorting}}" data-url="{{$.Link}}/{{.ID}}">
			<div class="board-column-header gt-df gt-ac gt-sb">
				<div class="ui large label board-label gt-py-2">
					<div class="ui small circular grey label board-card-cnt">
						{{.NumIssues}}
					</div>
					{{.Title}}
				</div>
				{{if and $.CanWriteProjects (ne .ID 0)}}
					<div class="ui dropdown jump item">
						<div class="not-mobile gt-px-3" tabindex="-1">
							{{svg "octicon-kebab-horizontal"}}
						</div>
						<div class="menu user-menu" tabindex="-1">
							<a class="item show-modal button" data-modal="#edit-project-board-modal-{{.ID}}">
								{{svg "octicon-pencil"}}
								{{$.locale.Tr "repo.projects.column.edit"}}
							</a>
							{{if not .Default}}
								<a class="item show-modal button default-project-board-show"
								data-modal="#default-project-board-modal-{{.ID}}"
								data-modal-default-project-board-header="{{$.locale.Tr "repo.projects.column.set_default"}}"
								data-modal-default-project-board-content="{{$.locale.Tr "repo.projects.column.set_default_desc"}}"
								data-url="{{$.Link}}/{{.ID}}/default">
									{{svg "octicon-pin"}}
									{{$.locale.Tr "repo.projects.column.set_default"}}
								</a>
							{{else}}
								<a class="item show-modal button default-project-board-show"
								data-modal="#default-project-board-modal-{{.ID}}"
								data-modal-default-project-board-header="{{$.locale.Tr "repo.projects.column.unset_default"}}"
								data-modal-default-project-board-content="{{$.locale.Tr "repo.projects.column.unset_default_desc"}}"
								data-url="{{$.Link}}/{{.ID}}/unsetdefault">
									{{svg "octicon-pin-slash"}}
									{{$.locale.Tr "repo.projects.column.unset_default"}}
								</a>
							{{end}}
							<a class="item show-modal button show-delete-column-modal"
								data-modal="#delete-board-modal-{{.ID}}"
								data-url="{{$.Link}}/{{.ID}}"
							>
								{{svg "octicon-trash"}}
								{{$.locale.Tr "repo.projects.column.delete"}}
							</a>

							<div class="ui small modal edit-project-board" id="edit-project-board-modal-{{.ID}}">
								<div class="header">
									{{$.locale.Tr "repo.projects.column.edit"}}
								</div>
								<div class="content">
									<form class="ui form">
										<div class="required field">
											<label for="new_board_title">{{$.locale.Tr "repo.projects.column.edit_title"}}</label>
											<input class="project-board-title" id="new_board_title" name="title" value="{{.Title}}" required>
										</div>

										<div class="field color-field">
											<label for="new_board_color">{{$.locale.Tr "repo.projects.column.color"}}</label>
											<div class="color picker column">
												<input class="color-picker" maxlength="7" placeholder="#c320f6" id="new_board_color" name="color" value="{{.Color}}">
												<div class="column precolors">
													{{template "repo/issue/label_precolors"}}
												</div>
											</div>
										</div>

										<div class="text right actions">
											<button class="ui cancel button">{{$.locale.Tr "settings.cancel"}}</button>
											<button data-url="{{$.Link}}/{{.ID}}" class="ui primary button edit-column-button">{{$.locale.Tr "repo.projects.column.edit"}}</button>
										</div>
									</form>
								</div>
							</div>

							<div class="ui g-modal-confirm modal default-project-board-modal" id="default-project-board-modal-{{.ID}}">
								<div class="header">
									<span id="default-project-board-header"></span>
								</div>
								<div class="content">
									<label id="default-project-board-content"></label>
								</div>
								{{template "base/modal_actions_confirm" (dict "locale" $.locale "ModalButtonTypes" "confirm")}}
							</div>

							<div class="ui g-modal-confirm modal" id="delete-board-modal-{{.ID}}">
								<div class="header">
									{{$.locale.Tr "repo.projects.column.delete"}}
								</div>
								<div class="content">
									<label>
										{{$.locale.Tr "repo.projects.column.deletion_desc"}}
									</label>
								</div>
								{{template "base/modal_actions_confirm" (dict "locale" $.locale "ModalButtonTypes" "confirm")}}
							</div>
						</div>
					</div>
				{{end}}
			</div>
			<div class="divider"></div>

			<div class="ui cards board" data-url="{{$.Link}}/{{.ID}}" data-project="{{$.Project.ID}}" data-board="{{.ID}}" id="board_{{.ID}}">

				{{range (index $.IssuesMap .ID)}}

				<!-- start issue card -->
				<div class="card board-card" data-issue="{{.ID}}">
					{{if eq $.Project.CardType 1}}{{/* Images and Text*/}}
						<div class="card-attachment-images">
							{{range (index $.issuesAttachmentMap .ID)}}
								<img src="{{.DownloadURL}}" alt="{{.Name}}" />
							{{end}}
						</div>
					{{end}}
					<div class="content gt-p-0">
						<div class="header">
							<span class="gt-dif gt-ac gt-vm">
								{{template "shared/issueicon" .}}
							</span>
							<a class="project-board-title gt-vm" href="{{.Link}}">
								{{.Title}}
							</a>
						</div>
						<div class="meta gt-my-2">
							<span class="text light grey">
								{{.Repo.FullName}}#{{.Index}}
								{{$timeStr := TimeSinceUnix .GetLastEventTimestamp $.locale}}
								{{if .OriginalAuthor}}
									{{$.locale.Tr .GetLastEventLabelFake $timeStr (.OriginalAuthor|Escape) | Safe}}
								{{else if gt .Poster.ID 0}}
									{{$.locale.Tr .GetLastEventLabel $timeStr (.Poster.HomeLink|Escape) (.Poster.GetDisplayName | Escape) | Safe}}
								{{else}}
									{{$.locale.Tr .GetLastEventLabelFake $timeStr (.Poster.GetDisplayName | Escape) | Safe}}
								{{end}}
							</span>
						</div>
						{{- if .MilestoneID}}
						<div class="meta gt-my-2">
							<a class="milestone" href="{{$.RepoLink}}/milestone/{{.MilestoneID}}">
								{{svg "octicon-milestone" 16 "gt-mr-2 gt-vm"}}
								<span class="gt-vm">{{.Milestone.Name}}</span>
							</a>
						</div>
						{{- end}}
						{{- range index $.LinkedPRs .ID}}
						<div class="meta gt-my-2">
							<a href="{{$.RepoLink}}/pulls/{{.Index}}">
								<span class="gt-m-0 text {{if .PullRequest.HasMerged}}purple{{else if .IsClosed}}red{{else}}green{{end}}">{{svg "octicon-git-merge" 16 "gt-mr-2 gt-vm"}}</span>
								<span class="gt-vm">{{.Title}} <span class="text light grey">#{{.Index}}</span></span>
							</a>
						</div>
						{{- end}}
					</div>

					{{if or .Labels .Assignees}}
					<div class="extra content labels-list gt-p-0 gt-pt-2">
						{{range .Labels}}
							<a target="_blank" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{RenderLabel $.Context .}}</a>
						{{end}}
						<div class="right floated">
							{{range .Assignees}}
								<a target="_blank" href="{{.HomeLink}}" data-tooltip-content="{{$.locale.Tr "repo.projects.column.assigned_to"}} {{.Name}}">{{avatar $.Context . 28 "mini gt-mr-3"}}</a>
							{{end}}
						</div>
					</div>
					{{end}}
				</div>
				<!-- stop issue card -->

				{{end}}
			</div>
		</div>
		{{end}}
	</div>

</div>

{{if .CanWriteProjects}}
	<div class="ui g-modal-confirm delete modal">
		<div class="header">
			{{svg "octicon-trash"}}
			{{.locale.Tr "repo.projects.deletion"}}
		</div>
		<div class="content">
			<p>{{.locale.Tr "repo.projects.deletion_desc"}}</p>
		</div>
		{{template "base/modal_actions_confirm" .}}
	</div>
{{end}}