<form class="ui comment form stackable grid" action="{{.Link}}" method="post">
	{{.CsrfTokenHtml}}
	{{if .Flash}}
		<div class="sixteen wide column">
			{{template "base/alert" .}}
		</div>
	{{end}}
	<div class="twelve wide column">
		<div class="ui comments">
			<div class="comment">
				<a class="avatar" href="{{.SignedUser.HomeLink}}">
					<img src="{{.SignedUser.RelAvatarLink}}">
				</a>
				<div class="ui segment content">
					<div class="field">
						<input name="title" id="issue_title" placeholder="{{.i18n.Tr "repo.milestones.title"}}" value="{{.title}}" tabindex="3" autofocus required maxlength="255">
						{{if .PageIsComparePull}}
							<div class="title_wip_desc" data-wip-prefixes="{{Json .PullRequestWorkInProgressPrefixes}}">{{.i18n.Tr "repo.pulls.title_wip_desc" (index .PullRequestWorkInProgressPrefixes 0| Escape) | Safe}}</div>
						{{end}}
					</div>
					{{template "repo/issue/comment_tab" .}}
					<div class="text right">
						<button class="ui green button" tabindex="6">
							{{if .PageIsComparePull}}
								{{.i18n.Tr "repo.pulls.create"}}
							{{else}}
								{{.i18n.Tr "repo.issues.create"}}
							{{end}}
						</button>
					</div>
				</div>
			</div>
		</div>
	</div>

	<div class="four wide column">
		<div class="ui segment metas">
			{{template "repo/issue/branch_selector_field" .}}

			<input id="label_ids" name="label_ids" type="hidden" value="{{.label_ids}}">
			<div class="ui {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}} floating jump select-label dropdown">
				<span class="text">
					<strong>{{.i18n.Tr "repo.issues.new.labels"}}</strong>
					{{if .HasIssuesOrPullsWritePermission}}
						{{svg "octicon-gear" 16}}
					{{end}}
				</span>
				<div class="filter menu" data-id="#label_ids">
					<div class="header" style="text-transform: none;font-size:16px;">{{.i18n.Tr "repo.issues.new.add_labels_title"}}</div>
					{{if or .Labels .OrgLabels}}
					<div class="ui icon search input">
						<i class="search icon"></i>
						<input type="text" placeholder="{{.i18n.Tr "repo.issues.filter_labels"}}">
					</div>
					{{end}}
					<div class="no-select item">{{.i18n.Tr "repo.issues.new.clear_labels"}}</div>
					{{if or .Labels .OrgLabels}}
						{{range .Labels}}
							<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{svg "octicon-check" 16}}</span><span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
							{{if .Description }}<br><small class="desc">{{.Description | RenderEmoji}}</small>{{end}}</a>
						{{end}}

						<div class="ui divider"></div>
						{{range .OrgLabels}}
							<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{svg "octicon-check" 16}}</span><span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
							{{if .Description }}<br><small class="desc">{{.Description | RenderEmoji}}</small>{{end}}</a>
						{{end}}
					{{else}}
						<div class="header" style="text-transform: none;font-size:14px;">{{.i18n.Tr "repo.issues.new.no_items"}}</div>
					{{end}}
				</div>
			</div>
			<div class="ui labels list">
				<span class="no-select item {{if .HasSelectedLabel}}hide{{end}}">{{.i18n.Tr "repo.issues.new.no_label"}}</span>
				{{range .Labels}}
					<a class="{{if not .IsChecked}}hide{{end}} item" id="label_{{.ID}}" href="{{$.RepoLink}}/issues?labels={{.ID}}"><span class="label color" style="background-color: {{.Color}}"></span> <span class="text">{{.Name | RenderEmoji}}</span></a>
				{{end}}
				{{range .OrgLabels}}
					<a class="{{if not .IsChecked}}hide{{end}} item" id="label_{{.ID}}" href="/issues?labels={{.ID}}"><span class="label color" style="background-color: {{.Color}}"></span> <span class="text">{{.Name | RenderEmoji}}</span></a>
				{{end}}
			</div>

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

			<input id="milestone_id" name="milestone_id" type="hidden" value="{{.milestone_id}}">
			<div class="ui {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}} floating jump select-milestone dropdown">
				<span class="text">
					<strong>{{.i18n.Tr "repo.issues.new.milestone"}}</strong>
					{{if .HasIssuesOrPullsWritePermission}}
						{{svg "octicon-gear" 16}}
					{{end}}
				</span>
				<div class="menu">
					<div class="header" style="text-transform: none;font-size:16px;">{{.i18n.Tr "repo.issues.new.add_milestone_title"}}</div>
					{{if or .OpenMilestones .ClosedMilestones}}
					<div class="ui icon search input">
						<i class="search icon"></i>
						<input type="text" placeholder="{{.i18n.Tr "repo.issues.filter_milestones"}}">
					</div>
					{{end}}
					<div class="no-select item">{{.i18n.Tr "repo.issues.new.clear_milestone"}}</div>
					{{if and (not .OpenMilestones) (not .ClosedMilestones)}}
						<div class="header" style="text-transform: none;font-size:14px;">
							{{.i18n.Tr "repo.issues.new.no_items"}}
						</div>
					{{else}}
						{{if .OpenMilestones}}
							<div class="divider"></div>
							<div class="header">
								{{svg "octicon-milestone" 16}}
								{{.i18n.Tr "repo.issues.new.open_milestone"}}
							</div>
							{{range .OpenMilestones}}
								<div class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}"> {{.Name}}</div>
							{{end}}
						{{end}}
						{{if .ClosedMilestones}}
							<div class="divider"></div>
							<div class="header">
								{{svg "octicon-milestone" 16}}
								{{.i18n.Tr "repo.issues.new.closed_milestone"}}
							</div>
							{{range .ClosedMilestones}}
								<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}"> {{.Name}}</a>
							{{end}}
						{{end}}
					{{end}}
				</div>
			</div>
			<div class="ui select-milestone list">
				<span class="no-select item {{if .Milestone}}hide{{end}}">{{.i18n.Tr "repo.issues.new.no_milestone"}}</span>
				<div class="selected">
					{{if .Milestone}}
						<a class="item" href="{{.RepoLink}}/issues?milestone={{.Milestone.ID}}"> {{.Milestone.Name}}</a>
					{{end}}
				</div>
			</div>

			{{if .IsProjectsEnabled}}
			<div class="ui divider"></div>

			<input id="project_id" name="project_id" type="hidden" value="{{.project_id}}">
			<div class="ui {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}} floating jump select-project dropdown">
			  <span class="text">
			    <strong>{{.i18n.Tr "repo.issues.new.projects"}}</strong>
			    {{if .HasIssuesOrPullsWritePermission}}
			      {{svg "octicon-gear" 16}}
			    {{end}}
			  </span>
			  <div class="menu">
			    <div class="header" style="text-transform: none;font-size:16px;">{{.i18n.Tr "repo.issues.new.add_project_title"}}</div>
			    {{if or .OpenProjects .ClosedProjects}}
			    <div class="ui icon search input">
			      <i class="search icon"></i>
			      <input type="text" placeholder="{{.i18n.Tr "repo.issues.filter_projects"}}">
			    </div>
			    {{end}}
			    <div class="no-select item">{{.i18n.Tr "repo.issues.new.clear_projects"}}</div>
			    {{if and (not .OpenProjects) (not .ClosedProjects)}}
			      <div class="header" style="text-transform: none;font-size:14px;">
			        {{.i18n.Tr "repo.issues.new.no_items"}}
			      </div>
			    {{else}}
			      {{if .OpenProjects}}
			        <div class="divider"></div>
			        <div class="header">
			          {{svg "octicon-project" 16}}
			          {{.i18n.Tr "repo.issues.new.open_projects"}}
			        </div>
			        {{range .OpenProjects}}
			          <div class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">{{.Title}}</div>
			        {{end}}
			      {{end}}
			      {{if .ClosedProjects}}
			        <div class="divider"></div>
			        <div class="header">
			          {{svg "octicon-project" 16}}
			          {{.i18n.Tr "repo.issues.new.closed_projects"}}
			        </div>
			        {{range .ClosedProjects}}
			          <a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">{{.Title}}</a>
			        {{end}}
			      {{end}}
			    {{end}}
			  </div>
			</div>
			<div class="ui select-project list">
			  <span class="no-select item {{if .Project}}hide{{end}}">{{.i18n.Tr "repo.issues.new.no_projects"}}</span>
			  <div class="selected">
			    {{if .Project}}
			      <a class="item" href="{{.RepoLink}}/projects/{{.Project.ID}}">{{.Project.Title}}</a>
			    {{end}}
			  </div>
			</div>
			{{end}}

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

				<input id="assignee_ids" name="assignee_ids" type="hidden" value="{{.assignee_ids}}">
				<div class="ui {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}} floating jump select-assignees dropdown">
					<span class="text">
						<strong>{{.i18n.Tr "repo.issues.new.assignees"}}</strong>
						{{if .HasIssuesOrPullsWritePermission}}
							{{svg "octicon-gear" 16}}
						{{end}}
					</span>
					<div class="filter menu" data-id="#assignee_ids">
						<div class="header" style="text-transform: none;font-size:16px;">{{.i18n.Tr "repo.issues.new.add_assignees_title"}}</div>
						<div class="ui icon search input">
							<i class="search icon"></i>
							<input type="text" placeholder="{{.i18n.Tr "repo.issues.filter_assignees"}}">
						</div>
						<div class="no-select item">{{.i18n.Tr "repo.issues.new.clear_assignees"}}</div>
						{{range .Assignees}}
							<a class="item" href="#" data-id="{{.ID}}" data-id-selector="#assignee_{{.ID}}">
								<span class="octicon-check invisible">{{svg "octicon-check" 16}}</span>
								<span class="text">
									<img class="ui avatar image" src="{{.RelAvatarLink}}"> {{.GetDisplayName}}
								</span>
							</a>
						{{end}}
					</div>
				</div>
				<div class="ui assignees list">
					<span class="no-select item {{if .HasSelectedLabel}}hide{{end}}">
						{{.i18n.Tr "repo.issues.new.no_assignees"}}
					</span>
					{{range .Assignees}}
						<a style="padding: 5px;color:rgba(0, 0, 0, 0.87);" class="hide item" id="assignee_{{.ID}}" href="{{$.RepoLink}}/issues?assignee={{.ID}}">
							<img class="ui avatar image" src="{{.RelAvatarLink}}" style="vertical-align: middle;">&nbsp;{{.GetDisplayName}}
						</a>
					{{end}}
				</div>
		</div>
	</div>
</form>