diff --git a/routers/web/repo/issue.go b/routers/web/repo/issue.go
index 1bb9d9fc7f..8d1f4986d6 100644
--- a/routers/web/repo/issue.go
+++ b/routers/web/repo/issue.go
@@ -429,7 +429,7 @@ func IssuesTree(ctx *context.Context) {
 			return
 		}
 		ctx.Data["Title"] = ctx.Tr("repo.issues_tree")
-		ctx.Data["PageIsIssuesTree"] = true
+		ctx.Data["PageIsIssueList"] = true
 		ctx.Data["NewIssueChooseTemplate"] = len(ctx.IssueTemplatesFromDefaultBranch()) > 0
 	}
 
diff --git a/templates/repo/issue/issue_actions.tmpl b/templates/repo/issue/issue_actions.tmpl
new file mode 100644
index 0000000000..4e1f6bc978
--- /dev/null
+++ b/templates/repo/issue/issue_actions.tmpl
@@ -0,0 +1,89 @@
+		<div id="issue-actions" class="ui stackable grid hide">
+			<div class="six wide column">
+				{{template "repo/issue/openclose" .}}
+			</div>
+			{{/* Ten wide does not cope well and makes the columns stack.
+			This seems to be related to jQuery's hide/show: in fact, switching
+			issue-actions and issue-filters and having this ten wide will show
+			this one correctly, but not the other one. */}}
+			<div class="nine wide right aligned right floated column">
+				<div class="ui secondary filter stackable menu">
+					{{if not .Repository.IsArchived}}
+					<!-- Action Button -->
+					{{if .IsShowClosed}}
+						<div class="ui green active basic button issue-action" data-action="open" data-url="{{$.RepoLink}}/issues/status" style="margin-left: auto">{{.i18n.Tr "repo.issues.action_open"}}</div>
+					{{else}}
+						<div class="ui red active basic button issue-action" data-action="close" data-url="{{$.RepoLink}}/issues/status" style="margin-left: auto">{{.i18n.Tr "repo.issues.action_close"}}</div>
+					{{end}}
+					<!-- Labels -->
+					<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item">
+						<span class="text">
+							{{.i18n.Tr "repo.issues.action_label"}}
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+						</span>
+						<div class="menu">
+							{{range .Labels}}
+								<div class="item issue-action" data-action="toggle" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/labels">
+									{{if contain $.SelLabelIDs .ID}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
+								</div>
+							{{end}}
+						</div>
+					</div>
+
+					<!-- Milestone -->
+					<div class="ui {{if not .Milestones}}disabled{{end}} dropdown jump item">
+						<span class="text">
+							{{.i18n.Tr "repo.issues.action_milestone"}}
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+						</span>
+						<div class="menu">
+							<div class="item issue-action" data-element-id="0" data-url="{{$.Link}}/milestone">
+							{{.i18n.Tr "repo.issues.action_milestone_no_select"}}
+							</div>
+							{{range .Milestones}}
+								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/milestone">
+									{{.Name}}
+								</div>
+							{{end}}
+						</div>
+					</div>
+
+					<!-- Projects -->
+					<div class="ui {{if not .Projects}}disabled{{end}} dropdown jump item">
+						<span class="text">
+							{{.i18n.Tr "repo.project_board"}}
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+						</span>
+						<div class="menu">
+							<div class="item issue-action" data-element-id="0" data-url="{{$.Link}}/projects">
+							{{.i18n.Tr "repo.issues.new.no_projects"}}
+							</div>
+							{{range .Projects}}
+								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/projects">
+									{{.Title}}
+								</div>
+							{{end}}
+						</div>
+					</div>
+
+					<!-- Assignees -->
+					<div class="ui {{if not .Assignees}}disabled{{end}} dropdown jump item">
+						<span class="text">
+							{{.i18n.Tr "repo.issues.action_assignee"}}
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+						</span>
+						<div class="menu">
+							<div class="item issue-action" data-element-id="0" data-url="{{$.Link}}/assignee">
+								{{.i18n.Tr "repo.issues.action_assignee_no_select"}}
+							</div>
+							{{range .Assignees}}
+								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/assignee">
+									{{avatar .}} {{.GetDisplayName}}
+								</div>
+							{{end}}
+						</div>
+					</div>
+					{{end}}
+				</div>
+			</div>
+		</div>		
diff --git a/templates/repo/issue/issue_filters.tmpl b/templates/repo/issue/issue_filters.tmpl
new file mode 100644
index 0000000000..a3296f2df5
--- /dev/null
+++ b/templates/repo/issue/issue_filters.tmpl
@@ -0,0 +1,90 @@
+		<div id="issue-filters" class="ui stackable grid">
+			<div class="six wide column">
+				{{template "repo/issue/openclose" .}}
+			</div>
+			<div class="ten wide right aligned column">
+				<div class="ui secondary filter stackable menu labels">
+					<!-- Label -->
+					<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item label-filter" style="margin-left: auto">
+						<span class="text">
+							{{.i18n.Tr "repo.issues.filter_label"}}
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+						</span>
+						<div class="menu">
+							<span class="info">{{.i18n.Tr "repo.issues.filter_label_exclude" | Safe}}</span>
+							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_label_no_select"}}</a>
+							{{range .Labels}}
+								<a class="item label-filter-item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.QueryString}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if .IsSelected}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}</a>
+							{{end}}
+						</div>
+					</div>
+
+					<!-- Milestone -->
+					<div class="ui {{if not .Milestones}}disabled{{end}} dropdown jump item">
+						<span class="text">
+							{{.i18n.Tr "repo.issues.filter_milestone"}}
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+						</span>
+						<div class="menu">
+							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_milestone_no_select"}}</a>
+							{{range .Milestones}}
+								<a class="{{if $.MilestoneID}}{{if eq $.MilestoneID .ID}}active selected{{end}}{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{.ID}}&assignee={{$.AssigneeID}}">{{.Name}}</a>
+							{{end}}
+						</div>
+					</div>
+
+					<!-- Assignee -->
+					<div class="ui {{if not .Assignees}}disabled{{end}} dropdown jump item">
+						<span class="text">
+							{{.i18n.Tr "repo.issues.filter_assignee"}}
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+						</span>
+						<div class="menu">
+							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}">{{.i18n.Tr "repo.issues.filter_assginee_no_select"}}</a>
+							{{range .Assignees}}
+								<a class="{{if eq $.AssigneeID .ID}}active selected{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{.ID}}">
+									{{avatar .}} {{.GetDisplayName}}
+								</a>
+							{{end}}
+						</div>
+					</div>
+
+					{{if .IsSigned}}
+						<!-- Type -->
+						<div class="ui dropdown type jump item">
+							<span class="text">
+								{{.i18n.Tr "repo.issues.filter_type"}}
+								{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+							</span>
+							<div class="menu">
+								<a class="{{if eq .ViewType "all"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=all&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.all_issues"}}</a>
+								<a class="{{if eq .ViewType "assigned"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=assigned&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.assigned_to_you"}}</a>
+								<a class="{{if eq .ViewType "created_by"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=created_by&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.created_by_you"}}</a>
+								<a class="{{if eq .ViewType "mentioned"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=mentioned&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.mentioning_you"}}</a>
+								{{if .PageIsPullList}}
+									<a class="{{if eq .ViewType "review_requested"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=review_requested&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.review_requested"}}</a>
+								{{end}}
+							</div>
+						</div>
+					{{end}}
+
+					<!-- Sort -->
+					<div class="ui dropdown type jump item">
+						<span class="text">
+							{{.i18n.Tr "repo.issues.filter_sort"}}
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+						</span>
+						<div class="menu">
+							<a class="{{if or (eq .SortType "latest") (not .SortType)}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=latest&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.latest"}}</a>
+							<a class="{{if eq .SortType "oldest"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=oldest&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.oldest"}}</a>
+							<a class="{{if eq .SortType "recentupdate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=recentupdate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.recentupdate"}}</a>
+							<a class="{{if eq .SortType "leastupdate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=leastupdate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.leastupdate"}}</a>
+							<a class="{{if eq .SortType "mostcomment"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=mostcomment&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.mostcomment"}}</a>
+							<a class="{{if eq .SortType "leastcomment"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=leastcomment&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.leastcomment"}}</a>
+							<a class="{{if eq .SortType "nearduedate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=nearduedate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.nearduedate"}}</a>
+							<a class="{{if eq .SortType "farduedate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=farduedate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.farduedate"}}</a>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
diff --git a/templates/repo/issue/list.tmpl b/templates/repo/issue/list.tmpl
index 63d746f570..9cf9c6f679 100644
--- a/templates/repo/issue/list.tmpl
+++ b/templates/repo/issue/list.tmpl
@@ -2,209 +2,11 @@
 <div class="page-content repository">
 	{{template "repo/header" .}}
 	<div class="ui container">
-		<div class="ui three column stackable grid">
-			<div class="column">
-				{{template "repo/issue/navbar" .}}
-			</div>
-			<div class="column center aligned">
-				{{template "repo/issue/search" .}}
-			</div>
-			{{if not .Repository.IsArchived}}
-				<div class="column right aligned">
-					{{if .PageIsIssueList}}
-						<a class="ui green button" href="{{.RepoLink}}/issues/new{{if .NewIssueChooseTemplate}}/choose{{end}}">{{.i18n.Tr "repo.issues.new"}}</a>
-					{{else}}
-						<a class="ui green button {{if not .PullRequestCtx.Allowed}}disabled{{end}}" href="{{if .PullRequestCtx.Allowed}}{{.Repository.Link}}/compare/{{.Repository.DefaultBranch | PathEscapeSegments}}...{{if ne .Repository.Owner.Name .PullRequestCtx.BaseRepo.Owner.Name}}{{PathEscape .Repository.Owner.Name}}:{{end}}{{.Repository.DefaultBranch | PathEscapeSegments}}{{end}}">{{.i18n.Tr "repo.pulls.new"}}</a>
-					{{end}}
-				</div>
-			{{else}}
-				{{if not .PageIsIssueList}}
-					<div class="column right aligned">
-						<a class="ui green button {{if not .PullRequestCtx.Allowed}}disabled{{end}}" href="{{if .PullRequestCtx.Allowed}}{{.PullRequestCtx.BaseRepo.Link}}/compare/{{.PullRequestCtx.BaseRepo.DefaultBranch | PathEscapeSegments}}...{{if ne .Repository.Owner.Name .PullRequestCtx.BaseRepo.Owner.Name}}{{PathEscape .Repository.Owner.Name}}:{{end}}{{.Repository.DefaultBranch | PathEscapeSegments}}{{end}}">{{$.i18n.Tr "action.compare_commits_general"}}</a>
-					</div>
-				{{end}}
-			{{end}}
-		</div>
+		{{template "repo/issue/nav_search_and_new" .}}
 		<div class="ui divider"></div>
-		<div id="issue-filters" class="ui stackable grid">
-			<div class="six wide column">
-				{{template "repo/issue/openclose" .}}
-			</div>
-			<div class="ten wide right aligned column">
-				<div class="ui secondary filter stackable menu labels">
-					<!-- Label -->
-					<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item label-filter" style="margin-left: auto">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.filter_label"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<span class="info">{{.i18n.Tr "repo.issues.filter_label_exclude" | Safe}}</span>
-							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_label_no_select"}}</a>
-							{{range .Labels}}
-								<a class="item label-filter-item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.QueryString}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if .IsSelected}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}</a>
-							{{end}}
-						</div>
-					</div>
+		{{template "repo/issue/issue_filters" .}}
+		{{template "repo/issue/issue_actions" .}}
 
-					<!-- Milestone -->
-					<div class="ui {{if not .Milestones}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.filter_milestone"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_milestone_no_select"}}</a>
-							{{range .Milestones}}
-								<a class="{{if $.MilestoneID}}{{if eq $.MilestoneID .ID}}active selected{{end}}{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{.ID}}&assignee={{$.AssigneeID}}">{{.Name}}</a>
-							{{end}}
-						</div>
-					</div>
-
-					<!-- Assignee -->
-					<div class="ui {{if not .Assignees}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.filter_assignee"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}">{{.i18n.Tr "repo.issues.filter_assginee_no_select"}}</a>
-							{{range .Assignees}}
-								<a class="{{if eq $.AssigneeID .ID}}active selected{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{.ID}}">
-									{{avatar .}} {{.GetDisplayName}}
-								</a>
-							{{end}}
-						</div>
-					</div>
-
-					{{if .IsSigned}}
-						<!-- Type -->
-						<div class="ui dropdown type jump item">
-							<span class="text">
-								{{.i18n.Tr "repo.issues.filter_type"}}
-								{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-							</span>
-							<div class="menu">
-								<a class="{{if eq .ViewType "all"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=all&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.all_issues"}}</a>
-								<a class="{{if eq .ViewType "assigned"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=assigned&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.assigned_to_you"}}</a>
-								<a class="{{if eq .ViewType "created_by"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=created_by&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.created_by_you"}}</a>
-								<a class="{{if eq .ViewType "mentioned"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=mentioned&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.mentioning_you"}}</a>
-								{{if .PageIsPullList}}
-									<a class="{{if eq .ViewType "review_requested"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=review_requested&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.review_requested"}}</a>
-								{{end}}
-							</div>
-						</div>
-					{{end}}
-
-					<!-- Sort -->
-					<div class="ui dropdown type jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.filter_sort"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<a class="{{if or (eq .SortType "latest") (not .SortType)}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=latest&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.latest"}}</a>
-							<a class="{{if eq .SortType "oldest"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=oldest&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.oldest"}}</a>
-							<a class="{{if eq .SortType "recentupdate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=recentupdate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.recentupdate"}}</a>
-							<a class="{{if eq .SortType "leastupdate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=leastupdate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.leastupdate"}}</a>
-							<a class="{{if eq .SortType "mostcomment"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=mostcomment&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.mostcomment"}}</a>
-							<a class="{{if eq .SortType "leastcomment"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=leastcomment&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.leastcomment"}}</a>
-							<a class="{{if eq .SortType "nearduedate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=nearduedate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.nearduedate"}}</a>
-							<a class="{{if eq .SortType "farduedate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=farduedate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.farduedate"}}</a>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-		<div id="issue-actions" class="ui stackable grid hide">
-			<div class="six wide column">
-				{{template "repo/issue/openclose" .}}
-			</div>
-			{{/* Ten wide does not cope well and makes the columns stack.
-			This seems to be related to jQuery's hide/show: in fact, switching
-			issue-actions and issue-filters and having this ten wide will show
-			this one correctly, but not the other one. */}}
-			<div class="nine wide right aligned right floated column">
-				<div class="ui secondary filter stackable menu">
-					{{if not .Repository.IsArchived}}
-					<!-- Action Button -->
-					{{if .IsShowClosed}}
-						<div class="ui green active basic button issue-action" data-action="open" data-url="{{$.RepoLink}}/issues/status" style="margin-left: auto">{{.i18n.Tr "repo.issues.action_open"}}</div>
-					{{else}}
-						<div class="ui red active basic button issue-action" data-action="close" data-url="{{$.RepoLink}}/issues/status" style="margin-left: auto">{{.i18n.Tr "repo.issues.action_close"}}</div>
-					{{end}}
-					<!-- Labels -->
-					<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.action_label"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							{{range .Labels}}
-								<div class="item issue-action" data-action="toggle" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/labels">
-									{{if contain $.SelLabelIDs .ID}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
-								</div>
-							{{end}}
-						</div>
-					</div>
-
-					<!-- Milestone -->
-					<div class="ui {{if not .Milestones}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.action_milestone"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<div class="item issue-action" data-element-id="0" data-url="{{$.Link}}/milestone">
-							{{.i18n.Tr "repo.issues.action_milestone_no_select"}}
-							</div>
-							{{range .Milestones}}
-								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/milestone">
-									{{.Name}}
-								</div>
-							{{end}}
-						</div>
-					</div>
-
-					<!-- Projects -->
-					<div class="ui {{if not .Projects}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.project_board"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<div class="item issue-action" data-element-id="0" data-url="{{$.Link}}/projects">
-							{{.i18n.Tr "repo.issues.new.no_projects"}}
-							</div>
-							{{range .Projects}}
-								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/projects">
-									{{.Title}}
-								</div>
-							{{end}}
-						</div>
-					</div>
-
-					<!-- Assignees -->
-					<div class="ui {{if not .Assignees}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.action_assignee"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<div class="item issue-action" data-element-id="0" data-url="{{$.Link}}/assignee">
-								{{.i18n.Tr "repo.issues.action_assignee_no_select"}}
-							</div>
-							{{range .Assignees}}
-								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/assignee">
-									{{avatar .}} {{.GetDisplayName}}
-								</div>
-							{{end}}
-						</div>
-					</div>
-					{{end}}
-				</div>
-			</div>
-		</div>
 		{{template "shared/issuelist" mergeinto . "listType" "repo"}}
 	</div>
 </div>
diff --git a/templates/repo/issue/nav_search_and_new.tmpl b/templates/repo/issue/nav_search_and_new.tmpl
new file mode 100644
index 0000000000..92f433284d
--- /dev/null
+++ b/templates/repo/issue/nav_search_and_new.tmpl
@@ -0,0 +1,23 @@
+		<div class="ui three column stackable grid">
+			<div class="column">
+				{{template "repo/issue/navbar" .}}
+			</div>
+			<div class="column center aligned">
+				{{template "repo/issue/search" .}}
+			</div>
+			{{if not .Repository.IsArchived}}
+				<div class="column right aligned">
+					{{if .PageIsIssueList}}
+						<a class="ui green button" href="{{.RepoLink}}/issues/new{{if .NewIssueChooseTemplate}}/choose{{end}}">{{.i18n.Tr "repo.issues.new"}}</a>
+					{{else}}
+						<a class="ui green button {{if not .PullRequestCtx.Allowed}}disabled{{end}}" href="{{if .PullRequestCtx.Allowed}}{{.Repository.Link}}/compare/{{.Repository.DefaultBranch | PathEscapeSegments}}...{{if ne .Repository.Owner.Name .PullRequestCtx.BaseRepo.Owner.Name}}{{PathEscape .Repository.Owner.Name}}:{{end}}{{.Repository.DefaultBranch | PathEscapeSegments}}{{end}}">{{.i18n.Tr "repo.pulls.new"}}</a>
+					{{end}}
+				</div>
+			{{else}}
+				{{if not .PageIsIssueList}}
+					<div class="column right aligned">
+						<a class="ui green button {{if not .PullRequestCtx.Allowed}}disabled{{end}}" href="{{if .PullRequestCtx.Allowed}}{{.PullRequestCtx.BaseRepo.Link}}/compare/{{.PullRequestCtx.BaseRepo.DefaultBranch | PathEscapeSegments}}...{{if ne .Repository.Owner.Name .PullRequestCtx.BaseRepo.Owner.Name}}{{PathEscape .Repository.Owner.Name}}:{{end}}{{.Repository.DefaultBranch | PathEscapeSegments}}{{end}}">{{$.i18n.Tr "action.compare_commits_general"}}</a>
+					</div>
+				{{end}}
+			{{end}}
+		</div>
diff --git a/templates/repo/issue/treant_config.tmpl b/templates/repo/issue/treant_config.tmpl
new file mode 100644
index 0000000000..d6d3b04b55
--- /dev/null
+++ b/templates/repo/issue/treant_config.tmpl
@@ -0,0 +1,20 @@
+		<style>
+		.chart { 
+			height: 600px;
+			width: 100%;
+			border: 3px solid #DDD;
+			border-radius: 3px;
+		}
+
+		.comment {
+			display: inline-block;
+			width: 360px;
+		}
+
+		.comment { padding: 3px; border: 1px solid #ddd; border-radius: 3px; }
+		</style>
+		
+		<link rel="stylesheet" href="https://fperucic.github.io/treant-js/Treant.css">
+		<script src="https://fperucic.github.io/treant-js/vendor/raphael.js"></script>
+		<script src="https://fperucic.github.io/treant-js/Treant.js"></script>
+	
diff --git a/templates/repo/issue/tree.tmpl b/templates/repo/issue/tree.tmpl
index 8423795391..ef6f8d4a34 100644
--- a/templates/repo/issue/tree.tmpl
+++ b/templates/repo/issue/tree.tmpl
@@ -2,209 +2,11 @@
 <div class="page-content repository">
 	{{template "repo/header" .}}
 	<div class="ui container">
-		<div class="ui three column stackable grid">
-			<div class="column">
-				{{template "repo/issue/navbar" .}}
-			</div>
-			<div class="column center aligned">
-				{{template "repo/issue/search" .}}
-			</div>
-			{{if not .Repository.IsArchived}}
-				<div class="column right aligned">
-					{{if .PageIsIssuesTree}}
-						<a class="ui green button" href="{{.RepoLink}}/issues/new{{if .NewIssueChooseTemplate}}/choose{{end}}">{{.i18n.Tr "repo.issues.new"}}</a>
-					{{else}}
-						<a class="ui green button {{if not .PullRequestCtx.Allowed}}disabled{{end}}" href="{{if .PullRequestCtx.Allowed}}{{.Repository.Link}}/compare/{{.Repository.DefaultBranch | PathEscapeSegments}}...{{if ne .Repository.Owner.Name .PullRequestCtx.BaseRepo.Owner.Name}}{{PathEscape .Repository.Owner.Name}}:{{end}}{{.Repository.DefaultBranch | PathEscapeSegments}}{{end}}">{{.i18n.Tr "repo.pulls.new"}}</a>
-					{{end}}
-				</div>
-			{{else}}
-				{{if not .PageIsIssuesTree}}
-					<div class="column right aligned">
-						<a class="ui green button {{if not .PullRequestCtx.Allowed}}disabled{{end}}" href="{{if .PullRequestCtx.Allowed}}{{.PullRequestCtx.BaseRepo.Link}}/compare/{{.PullRequestCtx.BaseRepo.DefaultBranch | PathEscapeSegments}}...{{if ne .Repository.Owner.Name .PullRequestCtx.BaseRepo.Owner.Name}}{{PathEscape .Repository.Owner.Name}}:{{end}}{{.Repository.DefaultBranch | PathEscapeSegments}}{{end}}">{{$.i18n.Tr "action.compare_commits_general"}}</a>
-					</div>
-				{{end}}
-			{{end}}
-		</div>
+		{{template "repo/issue/nav_search_and_new" .}}
 		<div class="ui divider"></div>
-		<div id="issue-filters" class="ui stackable grid">
-			<div class="six wide column">
-				{{template "repo/issue/openclose" .}}
-			</div>
-			<div class="ten wide right aligned column">
-				<div class="ui secondary filter stackable menu labels">
-					<!-- Label -->
-					<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item label-filter" style="margin-left: auto">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.filter_label"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<span class="info">{{.i18n.Tr "repo.issues.filter_label_exclude" | Safe}}</span>
-							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_label_no_select"}}</a>
-							{{range .Labels}}
-								<a class="item label-filter-item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.QueryString}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if .IsSelected}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}</a>
-							{{end}}
-						</div>
-					</div>
-
-					<!-- Milestone -->
-					<div class="ui {{if not .Milestones}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.filter_milestone"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_milestone_no_select"}}</a>
-							{{range .Milestones}}
-								<a class="{{if $.MilestoneID}}{{if eq $.MilestoneID .ID}}active selected{{end}}{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{.ID}}&assignee={{$.AssigneeID}}">{{.Name}}</a>
-							{{end}}
-						</div>
-					</div>
-
-					<!-- Assignee -->
-					<div class="ui {{if not .Assignees}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.filter_assignee"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}">{{.i18n.Tr "repo.issues.filter_assginee_no_select"}}</a>
-							{{range .Assignees}}
-								<a class="{{if eq $.AssigneeID .ID}}active selected{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{.ID}}">
-									{{avatar .}} {{.GetDisplayName}}
-								</a>
-							{{end}}
-						</div>
-					</div>
-
-					{{if .IsSigned}}
-						<!-- Type -->
-						<div class="ui dropdown type jump item">
-							<span class="text">
-								{{.i18n.Tr "repo.issues.filter_type"}}
-								{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-							</span>
-							<div class="menu">
-								<a class="{{if eq .ViewType "all"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=all&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.all_issues"}}</a>
-								<a class="{{if eq .ViewType "assigned"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=assigned&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.assigned_to_you"}}</a>
-								<a class="{{if eq .ViewType "created_by"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=created_by&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.created_by_you"}}</a>
-								<a class="{{if eq .ViewType "mentioned"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=mentioned&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.mentioning_you"}}</a>
-								{{if .PageIsPullList}}
-									<a class="{{if eq .ViewType "review_requested"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type=review_requested&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_type.review_requested"}}</a>
-								{{end}}
-							</div>
-						</div>
-					{{end}}
-
-					<!-- Sort -->
-					<div class="ui dropdown type jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.filter_sort"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<a class="{{if or (eq .SortType "latest") (not .SortType)}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=latest&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.latest"}}</a>
-							<a class="{{if eq .SortType "oldest"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=oldest&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.oldest"}}</a>
-							<a class="{{if eq .SortType "recentupdate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=recentupdate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.recentupdate"}}</a>
-							<a class="{{if eq .SortType "leastupdate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=leastupdate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.leastupdate"}}</a>
-							<a class="{{if eq .SortType "mostcomment"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=mostcomment&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.mostcomment"}}</a>
-							<a class="{{if eq .SortType "leastcomment"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=leastcomment&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.leastcomment"}}</a>
-							<a class="{{if eq .SortType "nearduedate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=nearduedate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.nearduedate"}}</a>
-							<a class="{{if eq .SortType "farduedate"}}active{{end}} item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort=farduedate&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&assignee={{$.AssigneeID}}">{{.i18n.Tr "repo.issues.filter_sort.farduedate"}}</a>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-		<div id="issue-actions" class="ui stackable grid hide">
-			<div class="six wide column">
-				{{template "repo/issue/openclose" .}}
-			</div>
-			{{/* Ten wide does not cope well and makes the columns stack.
-			This seems to be related to jQuery's hide/show: in fact, switching
-			issue-actions and issue-filters and having this ten wide will show
-			this one correctly, but not the other one. */}}
-			<div class="nine wide right aligned right floated column">
-				<div class="ui secondary filter stackable menu">
-					{{if not .Repository.IsArchived}}
-					<!-- Action Button -->
-					{{if .IsShowClosed}}
-						<div class="ui green active basic button issue-action" data-action="open" data-url="{{$.RepoLink}}/issues/status" style="margin-left: auto">{{.i18n.Tr "repo.issues.action_open"}}</div>
-					{{else}}
-						<div class="ui red active basic button issue-action" data-action="close" data-url="{{$.RepoLink}}/issues/status" style="margin-left: auto">{{.i18n.Tr "repo.issues.action_close"}}</div>
-					{{end}}
-					<!-- Labels -->
-					<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.action_label"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							{{range .Labels}}
-								<div class="item issue-action" data-action="toggle" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/labels">
-									{{if contain $.SelLabelIDs .ID}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
-								</div>
-							{{end}}
-						</div>
-					</div>
-
-					<!-- Milestone -->
-					<div class="ui {{if not .Milestones}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.action_milestone"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<div class="item issue-action" data-element-id="0" data-url="{{$.Link}}/milestone">
-							{{.i18n.Tr "repo.issues.action_milestone_no_select"}}
-							</div>
-							{{range .Milestones}}
-								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/milestone">
-									{{.Name}}
-								</div>
-							{{end}}
-						</div>
-					</div>
-
-					<!-- Projects -->
-					<div class="ui {{if not .Projects}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.project_board"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<div class="item issue-action" data-element-id="0" data-url="{{$.Link}}/projects">
-							{{.i18n.Tr "repo.issues.new.no_projects"}}
-							</div>
-							{{range .Projects}}
-								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/projects">
-									{{.Title}}
-								</div>
-							{{end}}
-						</div>
-					</div>
-
-					<!-- Assignees -->
-					<div class="ui {{if not .Assignees}}disabled{{end}} dropdown jump item">
-						<span class="text">
-							{{.i18n.Tr "repo.issues.action_assignee"}}
-							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
-						</span>
-						<div class="menu">
-							<div class="item issue-action" data-element-id="0" data-url="{{$.Link}}/assignee">
-								{{.i18n.Tr "repo.issues.action_assignee_no_select"}}
-							</div>
-							{{range .Assignees}}
-								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/assignee">
-									{{avatar .}} {{.GetDisplayName}}
-								</div>
-							{{end}}
-						</div>
-					</div>
-					{{end}}
-				</div>
-			</div>
-		</div>
+		{{template "repo/issue/issue_filters" .}}
+		{{template "repo/issue/issue_actions" .}}
+		
 		<div hidden>
 			{{template "shared/issuelistfortree" mergeinto . "listType" "repo"}}
 			<div id="repo_title" class="comment"></div>
@@ -219,7 +21,7 @@
 		var task_post = [];
 
 		var config = {
-        container: "#TaskChart",
+        container: "#TaskTreeChart",
         levelSeparation:    60,
         siblingSeparation:  60,
         nodeAlign: "BOTTOM",
@@ -242,19 +44,24 @@
 			task_post[{{.ID}}] = {
 				parent: task_post0,
 				innerHTML: "#task{{.ID}}"
-			},
+			};
 		{{end}}
 
 		{{range .Issues}}
 			{{if .BlockedByParents}}
-				task_post[{{.ID}}].parent =
+				{{ $cur_id := .ID}}
+				{{ $cur_repo_id := .RepoID}}
 				{{range .BlockedByParents}}
-					task_post[{{.Issue.ID}}];
+					{{if eq $cur_repo_id .Issue.RepoID}}
+						if( task_post[{{.Issue.ID}}] )
+						{
+							task_post[{{$cur_id}}].parent = task_post[{{.Issue.ID}}];
+						}
+					{{end}}
 				{{end}}
 			{{end}}
 		{{end}}
 
-
 		tree_structure = [
 			config, task_post0,
 			{{range .Issues}}
@@ -262,27 +69,11 @@
 			{{end}}
 		];
 		</script>
-		<div class="chart Treant loaded" id="TaskChart"></div>
+		
+		<div class="chart Treant loaded" id="TaskTreeChart"></div>
     
-		<style>
-	.chart { 
-		height: 600px;
-		width: 100%;
-		border: 3px solid #DDD;
-		border-radius: 3px;
-	}
-
-	.comment {
-		display: inline-block;
-		width: 360px;
-	}
-
-	.comment { padding: 3px; border: 1px solid #ddd; border-radius: 3px; }
-		</style>
+		{{template "repo/issue/treant_config" .}}
 		
-		<link rel="stylesheet" href="https://fperucic.github.io/treant-js/Treant.css">
-		<script src="https://fperucic.github.io/treant-js/vendor/raphael.js"></script>
-		<script src="https://fperucic.github.io/treant-js/Treant.js"></script>
 		<script>
         new Treant( tree_structure );
 		</script>