list view: issue, label, milestone

conf/locale/locale_en-US.ini

@@ -369,6 +369,7 @@ commits.newer = Newer
 issues.new = New Issue
 issues.new_label = New Label
 issues.new_label_placeholder = Label name...
+issues.create_label = Create Label
 issues.open_tab = %d Open
 issues.close_tab = %d Closed
 issues.filter_label = Label

models/issue.go

@@ -658,6 +658,14 @@ type Milestone struct {
 	ClosedDate      time.Time
 }
 
+func (m *Milestone) BeforeUpdate() {
+	if m.NumIssues > 0 {
+		m.Completeness = m.NumClosedIssues * 100 / m.NumIssues
+	} else {
+		m.Completeness = 0
+	}
+}
+
 func (m *Milestone) AfterSet(colName string, _ xorm.Cell) {
 	if colName == "deadline" {
 		if m.Deadline.Year() == 9999 {
@@ -804,8 +812,6 @@ func ChangeMilestoneIssueStats(issue *Issue) error {
 		m.NumClosedIssues--
 	}
 
-	m.Completeness = m.NumClosedIssues * 100 / m.NumIssues
-
 	return UpdateMilestone(m)
 }
 
@@ -827,13 +833,8 @@ func ChangeMilestoneAssign(oldMid, mid int64, issue *Issue) (err error) {
 		if issue.IsClosed {
 			m.NumClosedIssues--
 		}
-		if m.NumIssues > 0 {
-			m.Completeness = m.NumClosedIssues * 100 / m.NumIssues
-		} else {
-			m.Completeness = 0
-		}
 
-		if _, err = sess.Id(m.ID).Cols("num_issues,num_completeness,num_closed_issues").Update(m); err != nil {
+		if _, err = sess.Id(m.ID).AllCols().Update(m); err != nil {
 			sess.Rollback()
 			return err
 		}
@@ -860,8 +861,7 @@ func ChangeMilestoneAssign(oldMid, mid int64, issue *Issue) (err error) {
 			return ErrWrongIssueCounter
 		}
 
-		m.Completeness = m.NumClosedIssues * 100 / m.NumIssues
-		if _, err = sess.Id(m.ID).Cols("num_issues,num_completeness,num_closed_issues").Update(m); err != nil {
+		if _, err = sess.Id(m.ID).AllCols().Update(m); err != nil {
 			sess.Rollback()
 			return err
 		}

modules/git/repo_tag.go

@@ -20,12 +20,8 @@ func (repo *Repository) IsTagExist(tagName string) bool {
 	return IsTagExist(repo.Path, tagName)
 }
 
-// GetTags returns all tags of given repository.
-func (repo *Repository) GetTags() ([]string, error) {
-	if gitVer.AtLeast(MustParseVersion("2.0.0")) {
-		return repo.getTagsReversed()
-	}
-	stdout, stderr, err := com.ExecCmdDir(repo.Path, "git", "tag", "-l")
+func (repo *Repository) getTagsReversed() ([]string, error) {
+	stdout, stderr, err := com.ExecCmdDir(repo.Path, "git", "tag", "-l", "--sort=-v:refname")
 	if err != nil {
 		return nil, concatenateError(err, stderr)
 	}
@@ -33,10 +29,14 @@ func (repo *Repository) GetTags() ([]string, error) {
 	return tags[:len(tags)-1], nil
 }
 
-func (repo *Repository) getTagsReversed() ([]string, error) {
-	stdout, stderr, err := com.ExecCmdDir(repo.Path, "git", "tag", "-l", "--sort=-v:refname")
+// GetTags returns all tags of given repository.
+func (repo *Repository) GetTags() ([]string, error) {
+	if gitVer.AtLeast(MustParseVersion("2.0.0")) {
+		return repo.getTagsReversed()
+	}
+	stdout, stderr, err := com.ExecCmdDir(repo.Path, "git", "tag", "-l")
 	if err != nil {
-		return nil, errors.New(stderr)
+		return nil, concatenateError(err, stderr)
 	}
 	tags := strings.Split(stdout, "\n")
 	return tags[:len(tags)-1], nil

public/js/gogs.js

@@ -43,6 +43,15 @@ function initRepository() {
 
     // Labels
     if ($('.repository.labels').length > 0) {
+        // Create label
+        var $new_label_panel = $('.new-label.segment');
+        $('.new-label.button').click(function () {
+            $new_label_panel.show();
+        });
+        $('.new-label.segment .cancel').click(function () {
+            $new_label_panel.hide();
+        });
+
         $('.color-picker').each(function () {
             $(this).minicolors();
         });
@@ -53,8 +62,7 @@ function initRepository() {
         });
         $('.edit-label-button').click(function () {
             $('#label-modal-id').val($(this).data('id'));
-            $('#label-modal-title').val($(this).data('title'));
-            $('#label-modal-color').val($(this).data('color'))
+            $('.edit-label .new-label-input').val($(this).data('title'));
             $('.minicolors-swatch-color').css("background-color", $(this).data('color'));
             $('.edit-label.modal').modal({
                 onApprove: function () {

public/less/_base.less

@@ -9,27 +9,25 @@ img {
 }
 .full.height {
 	padding: 0;
-  margin: 0 0 -87px 0;
+  margin: 0 0 -@footer-margin*2 0;
   min-height: 100%;
 }
 .following.bar {
 	z-index: 900;
 	left: 0;
 	width: 100%;
-	padding: 0.7em 0;
+	padding: 5px 0;
 	&.light {
 		background-color: white;
 		border-bottom: 1px solid #DDDDDD;
 		box-shadow: 0 2px 3px rgba(0, 0, 0, 0.04);
 	}
-	.ui.secondary.menu {
-		height: 30px;
-	}
 	.column .menu {
 		margin-top: 0;
 	}
 	.brand {
 		float: left;
+		margin-top: 5px;
 		margin-right: 5px;
 	}
 	.head.link.item {
@@ -41,7 +39,6 @@ img {
 	}
 	.user.avatar {
 		padding: 0;
-		margin-top: 1px;
 	}
 	.searchbox {
   	background-color: rgb(244, 244, 244)!important;
@@ -51,7 +48,6 @@ img {
 	}
 	.octicon {
     width: 16px;
-    opacity: 1!important;
     text-align: center;
   }
 }
@@ -68,28 +64,36 @@ img {
 			color: #d95c5c!important;
 		}
 	}
+
+	.message {
+		text-align: center;
+	}
 }
 footer {
 	margin-top: @footer-margin!important;
+	height: @footer-margin;
 	background-color: white;
 	border-top: 1px solid #d6d6d6;
 	clear: both;
 	width: 100%;
 	color: #888888;
-	.fa {
-		width: 16px;
-  	text-align: center;
-  	color: #428bca;
-	}
-	.ui.language.dropdown {
-		z-index: 10000;
-	}
-	.links >* {
-		border-left: 1px solid #d6d6d6;
-		padding-left: 8px;
-		margin-left: 5px;
-		&:first-child {
-			border-left: none;
+	.container {
+		padding-top: 10px;
+		.fa {
+			width: 16px;
+	  	text-align: center;
+	  	color: #428bca;
+		}
+		.ui.language.dropdown {
+			z-index: 10000;
+		}
+		.links >* {
+			border-left: 1px solid #d6d6d6;
+			padding-left: 8px;
+			margin-left: 5px;
+			&:first-child {
+				border-left: none;
+			}
 		}
 	}
 }
@@ -108,8 +112,8 @@ footer {
 .generate-img(16);
 .generate-img(@n, @i: 1) when (@i =< @n) {
   .img-@{i} {
-    width: (2px * @i);
-    height: (2px * @i);
+    width: (2px * @i)!important;
+    height: (2px * @i)!important;
   }
   .generate-img(@n, (@i + 1));
 }

public/less/_repository.less

@@ -4,11 +4,11 @@
 	padding-top: 15px;
 	padding-bottom: @footer-margin * 3;
 	.head {
-		height: 75px;
-		padding-top: 20px;
+		height: 40px;
 		background-color: #FCFCFC;
 		.mega-octicon {
 			width: @mega-octicon-width;
+			font-size: 30px;
 		}
 		a,
 		.fork-flag {
@@ -25,65 +25,13 @@
 			line-height: 10px;
 			white-space: nowrap;
 		}
-		.button {
-			margin-left: 10px;
-			i {
-				margin-right: 5px;
-			}
-		}
 		.num {
 			font-weight: bold;
 		}
-		.octicon {
-			height: 5px;
-		}
-	}
-	.navbar {
-		height: 60px;
-		padding-top: 20px;
-		.ui.secondary.menu .item {
-			margin-left: -10px;
-			margin-top: -7px;
-			&>.input {
-				.new-label-input,
-				.color-picker {
-					background-color: white;
-					border: 1px solid rgba(0,0,0,.15);
-				}
-			}
-			&.input {
-				margin-right: -7px;
-			}
-			.new-label-input {
-				width: 150px;
-			}
-			.color-picker {
-				height: 35px;
-				width: auto;
-				padding-left: 30px;
-			}
-			.minicolors-swatch.minicolors-sprite {
-				top: 10px;
-				left: 10px;
-				width: 15px;
-				height: 15px;
-			}
-			&.precolors {
-				padding-left: 0;
-				padding-right: 0;
-				margin-right: 10px;
-				width: 120px;
-				.color {
-					float: left;
-					width: 15px;
-					height: 15px;
-				}
-			}
-		}
 	}
 	.filter.menu {
 		.label.color {
-			margin-left: 17px;
+			margin-left: 15px;
 			padding: 0 8px;
 		}
 		.octicon {
@@ -99,15 +47,15 @@
   		.clickable .name {
   			padding-left: 15px!important;
   		}
-		}
+	 	}
 	}
 
 	.page.buttons {
 		padding-top: 15px;
 	}
 	.issue.list {
-		clear: both;
 		list-style: none;
+		padding-top: 15px;
 		>.item {
 			padding-top: 15px;
 			padding-bottom: 10px;
@@ -140,8 +88,8 @@
 	}
 
 	.label.list {
-		clear: both;
 		list-style: none;
+		padding-top: 15px;
 		.item {
 			padding-top: 10px;
 			padding-bottom: 10px;
@@ -162,8 +110,8 @@
 	}
 
 	.milestone.list {
-		clear: both;
 		list-style: none;
+		padding-top: 15px;
 		> .item {
 			padding-top: 10px;
 			padding-bottom: 10px;
@@ -212,67 +160,77 @@
 			}
 		}
 	}
-	&.new.milestone {
-		textarea {
-			height: 200px;
-		}
-	}
+	// &.new.milestone {
+	// 	textarea {
+	// 		height: 200px;
+	// 	}
+	// }
 
-	&.settings {
-		.content {
-			padding-left: 20px!important;
-		}
-	}
+	// &.settings {
+	// 	.content {
+	// 		padding-left: 20px!important;
+	// 	}
+	// }
 }
 
-.settings .key.list {
-	.item:not(:first-child) {
-		border-top: 1px solid #eaeaea;
-	}
-	.ssh-key-state-indicator {
-		float: left;
-		color: gray;
-		padding-left: 10px;
-    padding-top: 10px;
-    &.active {
-    	color: #6cc644;
-    }
-	}
-	.meta {
-		padding-top: 5px;
-	}
-	.print {
-		color: #767676;
-	}
-	.activity {
-		color: #666;
-	}
-}
+// .settings .key.list {
+// 	.item:not(:first-child) {
+// 		border-top: 1px solid #eaeaea;
+// 	}
+// 	.ssh-key-state-indicator {
+// 		float: left;
+// 		color: gray;
+// 		padding-left: 10px;
+//     padding-top: 10px;
+//     &.active {
+//     	color: #6cc644;
+//     }
+// 	}
+// 	.meta {
+// 		padding-top: 5px;
+// 	}
+// 	.print {
+// 		color: #767676;
+// 	}
+// 	.activity {
+// 		color: #666;
+// 	}
+// }
 
-.edit-label.modal {
-	.color-picker {
-		margin-top: -8px!important;
-		height: 35px;
-		width: auto!important;
-		padding-left: 30px!important;
-	}
-	.minicolors-swatch.minicolors-sprite {
-		top: 1px;
-		left: 10px;
-		width: 15px;
-		height: 15px;
-	}
-	.precolors {
-		margin-bottom: -11px!important;
-		padding-left: 0!important;
-		padding-right: 0!important;
-		margin-right: 10px!important;
-		width: 120px!important;
-		.color {
-			float: left;
-			margin: 0!important;
+.edit-label.modal,
+.new-label.segment {
+	.form {
+		.column {
+			padding-right: 0;
+		}
+		.buttons {
+			margin-left: auto;
+			padding-top: 15px;
+		}
+		.color.picker.column {
+			width: auto;
+			.color-picker {
+				height: 35px;
+				width: auto;
+				padding-left: 30px;
+			}
+		}
+		.minicolors-swatch.minicolors-sprite {
+			top: 10px;
+			left: 10px;
 			width: 15px;
 			height: 15px;
 		}
+		.precolors {
+			padding-left: 0;
+			padding-right: 0;
+			margin: 3px 10px auto 10px;
+			width: 120px;
+			.color {
+				float: left;
+				width: 15px;
+				height: 15px;
+			}
+		}
 	}
 }

templates/base/footer.tmpl

@@ -1,6 +1,6 @@
 	</div>
-	<footer class="ui page grid">
-		<div class="sixteen wide column">
+	<footer>
+		<div class="ui container">
 			<div class="ui left">
 				© 2015 Gogs · {{.i18n.Tr "version"}}: {{AppVer}} · {{.i18n.Tr "page"}}: <strong>{{LoadTimes .PageStartTime}}</strong> · {{.i18n.Tr "template"}}: <strong>{{call .TmplLoadTimes}}</strong>
 			</div>

templates/base/head.tmpl

@@ -46,39 +46,8 @@
 		<noscript>Please enable JavaScript in your browser!</noscript>
 		{{if not .PageIsInstall}}
 		<div class="following bar light">
-		  <div class="ui page grid">
+		  <div class="ui container">
 		    <div class="column">
-	      	{{if .IsSigned}}
-		      <div class="ui right floated secondary menu">
-		      	<a class="view-ui item user avatar poping up" href="{{AppSubUrl}}/{{.SignedUser.Name}}" data-content="{{.SignedUser.Name}}" data-variation="inverted">
-		      		<img class="img-15" src="{{.SignedUser.AvatarLink}}"/>
-		      		<span class="sr-only">{{.SignedUser.Name}}</span>
-		      	</a>
-						<div class="ui pointing dropdown head link jump item">
-							<span class="text">
-								<i class="octicon octicon-plus"></i>
-								<i class="dropdown icon"></i>
-							</span>
-			        <div class="menu">
-			          <a class="item" href="{{AppSubUrl}}/repo/create"><i class="octicon octicon-repo-create"></i> {{.i18n.Tr "new_repo"}}</a>
-			          <a class="item" href="{{AppSubUrl}}/repo/migrate"><i class="octicon octicon-repo-clone"></i> {{.i18n.Tr "new_migrate"}}</a>
-			          <a class="item" href="{{AppSubUrl}}/org/create"><i class="octicon octicon-organization"></i> {{.i18n.Tr "new_org"}}</a>
-							</div>
-						</div>
-						{{if .IsAdmin}}
-						<a class="view-ui item poping up {{if .PageIsAdmin}}active{{end}}" href="{{AppSubUrl}}/admin" data-content="{{.i18n.Tr "admin_panel"}}" data-variation="inverted"><i class="octicon icon settings"></i><span class="sr-only">{{.i18n.Tr "admin_panel"}}</span></a>
-						{{end}}
-						<a class="view-ui item poping up {{if .PageIsSettings}}active{{end}}" href="{{AppSubUrl}}/user/settings" data-content="{{.i18n.Tr "account_settings"}}" data-variation="inverted"><i class="octicon octicon-settings"></i><span class="sr-only">{{.i18n.Tr "account_settings"}}</span></a>
-						<a class="view-ui item poping up" href="{{AppSubUrl}}/user/logout" data-content="{{.i18n.Tr "sign_out"}}" data-variation="inverted"><i class="octicon octicon-sign-out"></i><span class="sr-only">{{.i18n.Tr "sign_out"}}</span></a>
-		      </div>
-	      	{{else}}
-		      <div class="ui right floated secondary menu">
-		      	{{if .ShowRegistrationButton}}
-		      	<a class="view-ui item {{if .PageIsSignUp}}active{{end}}" href="{{AppSubUrl}}/user/sign_up"><i class="octicon octicon-person-add"></i> {{.i18n.Tr "register"}}</a>
-		      	{{end}}
-		      	<a class="view-ui item {{if .PageIsSignIn}}active{{end}}" href="{{AppSubUrl}}/user/login"><i class="octicon octicon-sign-in"></i> {{.i18n.Tr "sign_in"}}</a>
-		      </div>
-		      {{end}}
 		      <div class="ui secondary menu">
 		      	<img class="img-15 ui image brand" src="{{AppSubUrl}}/img/favicon.png">
 		      	<a class="view-ui item {{if .PageIsHome}}active{{end}}" href="{{AppSubUrl}}/">{{if .IsSigned}}{{.i18n.Tr "dashboard"}}{{else}}{{.i18n.Tr "home"}}{{end}}</a>
@@ -90,6 +59,38 @@
 		      	    <i class="search icon"></i>
 		      	  </div>
 		      	</div> -->
+
+  	      	{{if .IsSigned}}
+  		      <div class="right menu">
+  		      	<a class="view-ui item user avatar poping up" href="{{AppSubUrl}}/{{.SignedUser.Name}}" data-content="{{.SignedUser.Name}}" data-variation="inverted">
+  		      		<img class="img-15" src="{{.SignedUser.AvatarLink}}"/>
+  		      		<span class="sr-only">{{.SignedUser.Name}}</span>
+  		      	</a>
+  						<div class="ui dropdown head link jump item">
+  							<span class="text">
+  								<i class="octicon octicon-plus"></i>
+  								<i class="dropdown icon"></i>
+  							</span>
+  			        <div class="menu">
+  			          <a class="item" href="{{AppSubUrl}}/repo/create"><i class="octicon octicon-repo-create"></i> {{.i18n.Tr "new_repo"}}</a>
+  			          <a class="item" href="{{AppSubUrl}}/repo/migrate"><i class="octicon octicon-repo-clone"></i> {{.i18n.Tr "new_migrate"}}</a>
+  			          <a class="item" href="{{AppSubUrl}}/org/create"><i class="octicon octicon-organization"></i> {{.i18n.Tr "new_org"}}</a>
+  							</div>
+  						</div>
+  						{{if .IsAdmin}}
+  						<a class="view-ui item poping up {{if .PageIsAdmin}}active{{end}}" href="{{AppSubUrl}}/admin" data-content="{{.i18n.Tr "admin_panel"}}" data-variation="inverted"><i class="octicon icon settings"></i><span class="sr-only">{{.i18n.Tr "admin_panel"}}</span></a>
+  						{{end}}
+  						<a class="view-ui item poping up {{if .PageIsSettings}}active{{end}}" href="{{AppSubUrl}}/user/settings" data-content="{{.i18n.Tr "account_settings"}}" data-variation="inverted"><i class="octicon octicon-settings"></i><span class="sr-only">{{.i18n.Tr "account_settings"}}</span></a>
+  						<a class="view-ui item poping up" href="{{AppSubUrl}}/user/logout" data-content="{{.i18n.Tr "sign_out"}}" data-variation="inverted"><i class="octicon octicon-sign-out"></i><span class="sr-only">{{.i18n.Tr "sign_out"}}</span></a>
+  		      </div>
+  	      	{{else}}
+  		      <div class="ui right floated secondary menu">
+  		      	{{if .ShowRegistrationButton}}
+  		      	<a class="view-ui item {{if .PageIsSignUp}}active{{end}}" href="{{AppSubUrl}}/user/sign_up"><i class="octicon octicon-person-add"></i> {{.i18n.Tr "register"}}</a>
+  		      	{{end}}
+  		      	<a class="view-ui item {{if .PageIsSignIn}}active{{end}}" href="{{AppSubUrl}}/user/login"><i class="octicon octicon-sign-in"></i> {{.i18n.Tr "sign_in"}}</a>
+  		      </div>
+  		      {{end}}
 		      </div>
 		    </div>
 		  </div>

templates/repo/header.tmpl

@@ -1,16 +1,14 @@
 {{with .Repository}}
-<div class="ui middle page head grid">
-	<h2 class="ui left">
-		<div class="ui breadcrumb">
-		<i class="mega-octicon octicon-{{if .IsPrivate}}lock{{else if .IsMirror}}repo-clone{{else if .IsFork}}repo-forked{{else}}repo{{end}}"></i>
-	  <a href="{{AppSubUrl}}/{{.Owner.Name}}">{{.Owner.Name}}</a>
-	  <div class="divider"> / </div>
-	  <a href="{{$.RepoLink}}">{{.Name}}</a>
-	  {{if .IsMirror}}<div class="ui label">{{$.i18n.Tr "mirror"}}</div>{{end}}
-	  {{if .IsFork}}<div class="fork-flag">{{$.i18n.Tr "repo.forked_from"}} <a href="{{.ForkRepo.RepoLink}}">{{SubStr .ForkRepo.RepoLink 1 -1}}</a></div>{{end}}
-		</div>
-	</h2>
-	<div class="ui right floated secondary menu">
+<div class="ui head container">
+	<div class="ui huge breadcrumb">
+	<i class="mega-octicon octicon-{{if .IsPrivate}}lock{{else if .IsMirror}}repo-clone{{else if .IsFork}}repo-forked{{else}}repo{{end}}"></i>
+  <a href="{{AppSubUrl}}/{{.Owner.Name}}">{{.Owner.Name}}</a>
+  <div class="divider"> / </div>
+  <a href="{{$.RepoLink}}">{{.Name}}</a>
+  {{if .IsMirror}}<div class="ui label">{{$.i18n.Tr "mirror"}}</div>{{end}}
+  {{if .IsFork}}<div class="fork-flag">{{$.i18n.Tr "repo.forked_from"}} <a href="{{.ForkRepo.RepoLink}}">{{SubStr .ForkRepo.RepoLink 1 -1}}</a></div>{{end}}
+	</div>
+	<div class="ui right">
 		<a class="ui black basic button" href="{{$.RepoLink}}/action/{{if $.IsWatchingRepo}}un{{end}}watch?redirect_to={{$.Link}}">
 		  <i class="fa fa-eye{{if not $.IsWatchingRepo}}-slash{{end}}"></i>
 		  {{if $.IsWatchingRepo}}{{$.i18n.Tr "repo.unwatch"}}{{else}}{{$.i18n.Tr "repo.watch"}}{{end}} <span class="num">{{.NumWatches}}</span>
@@ -19,7 +17,7 @@
 		  <i class="fa fa-star{{if not $.IsStaringRepo}}-o{{end}}"></i>
 		  {{if $.IsStaringRepo}}{{$.i18n.Tr "repo.unstar"}}{{else}}{{$.i18n.Tr "repo.star"}}{{end}} <span class="num">{{.NumStars}}</span>
 		</a>
-		<a class="ui black basic button {{if $.IsRepositoryOwner}}poping up{{end}}" {{if not $.IsRepositoryOwner}}href="{{AppSubUrl}}/repo/fork/{{.Id}}"{{end}} {{if $.IsRepositoryOwner}}data-content="{{$.i18n.Tr "repo.fork_from_self"}}"{{end}}>
+		<a class="ui black basic button {{if $.IsRepositoryOwner}}poping up{{end}}" {{if not $.IsRepositoryOwner}}href="{{AppSubUrl}}/repo/fork/{{.Id}}"{{end}} {{if $.IsRepositoryOwner}}data-content="{{$.i18n.Tr "repo.fork_from_self"}}" data-position="top right"{{end}}>
 		  <i class="octicon octicon-repo-forked"></i>
 		  {{$.i18n.Tr "repo.fork"}} <span class="num">{{.NumForks}}</span>
 		</a>

templates/repo/issue/alert.tmpl

@@ -1,5 +0,0 @@
-{{if .Flash}}
-<div class="sixteen wide center aligned centered column">
-	{{template "base/alert" .}}
-</div>
-{{end}}

templates/repo/issue/labels.tmpl

@@ -1,77 +1,73 @@
 {{template "base/head" .}}
 <div class="repository labels">
 	{{template "repo/header" .}}
-	<div class="ui middle page grid body">
+	<div class="ui container">
 		<div class="navbar">
 			{{template "repo/issue/navbar" .}}
 			{{if .IsRepositoryAdmin}}
-			<form class="ui right form" action="{{$.RepoLink}}/labels/new" method="post">
+			<div class="ui right">
+				<div class="ui green new-label button">{{.i18n.Tr "repo.issues.new_label"}}</div>
+			</div>
+			{{end}}
+		</div>
+		<div class="ui new-label segment hide">
+			<form class="ui form" action="{{$.RepoLink}}/labels/new" method="post">
 				{{.CsrfTokenHtml}}
-				<div class="ui right floated secondary menu">
-					<div class="input item">
-						<div class="ui large input">
-						  <input class="new-label-input" name="title" placeholder="{{.i18n.Tr "repo.issues.new_label_placeholder"}}" required>
+				<div class="ui grid">
+					<div class="five wide column">
+						<div class="ui small input">
+				  		<input class="new-label-input" name="title" placeholder="{{.i18n.Tr "repo.issues.new_label_placeholder"}}" autofocus required>
 						</div>
 					</div>
-					<div class="item">
-						<div class="ui large input">
-			        <input class="color-picker" name="color" value="#70c24a" required>
-			    	</div>
+					<div class="color picker column">
+		      	<input class="color-picker" name="color" value="#70c24a" required>
 					</div>
-					<div class="item precolors">
+					<div class="column precolors">
 						{{template "repo/issue/label_precolors"}}
 					</div>
-					<button class="ui green button">{{.i18n.Tr "repo.issues.new_label"}}</button>
+					<div class="buttons">
+						<div class="ui blue small basic cancel button">{{.i18n.Tr "repo.milestones.cancel"}}</div>
+						<button class="ui green small button">{{.i18n.Tr "repo.issues.create_label"}}</button>
+					</div>
 				</div>
 			</form>
-			{{end}}
 		</div>
 		<div class="ui divider"></div>
-		{{template "repo/issue/alert" .}}
-		<div class="ui left">
-			<div class="ui black label">{{.i18n.Tr "repo.issues.label_count" .NumLabels}}</div>
-		</div>
+		{{template "base/alert" .}}
+		<div class="ui black label">{{.i18n.Tr "repo.issues.label_count" .NumLabels}}</div>
 
-		<div class="sixteen wide column">
-			<div class="label list">
-				{{range .Labels}}
-				<li class="item">
-					<div class="ui label" style="background-color: {{.Color}}"><i class="octicon octicon-tag"></i> {{.Name}}</div>
-					{{if $.IsRepositoryAdmin}}
-					<a class="ui right delete-button" href="#" data-url="{{$.RepoLink}}/labels/delete" data-id="{{.ID}}"><i class="octicon octicon-trashcan"></i> {{$.i18n.Tr "repo.issues.label_delete"}}</a>
-					<a class="ui right edit-label-button" href="#" data-id={{.ID}} data-title={{.Name}} data-color={{.Color}}><i class="octicon octicon-pencil"></i> {{$.i18n.Tr "repo.issues.label_edit"}}</a>
-					{{end}}
-					<a class="ui right open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}"><i class="octicon octicon-issue-opened"></i> {{$.i18n.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
-				</li>
+		<div class="label list">
+			{{range .Labels}}
+			<li class="item">
+				<div class="ui label" style="background-color: {{.Color}}"><i class="octicon octicon-tag"></i> {{.Name}}</div>
+				{{if $.IsRepositoryAdmin}}
+				<a class="ui right delete-button" href="#" data-url="{{$.RepoLink}}/labels/delete" data-id="{{.ID}}"><i class="octicon octicon-trashcan"></i> {{$.i18n.Tr "repo.issues.label_delete"}}</a>
+				<a class="ui right edit-label-button" href="#" data-id={{.ID}} data-title={{.Name}} data-color={{.Color}}><i class="octicon octicon-pencil"></i> {{$.i18n.Tr "repo.issues.label_edit"}}</a>
 				{{end}}
-			</div>
+				<a class="ui right open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}"><i class="octicon octicon-issue-opened"></i> {{$.i18n.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
+			</li>
+			{{end}}
 		</div>
 	</div>
 </div>
 
 {{if .IsRepositoryAdmin}}
-<div class="ui basic delete modal">
-  <div class="header">
+<div class="ui small basic delete modal">
+  <div class="ui icon header">
+     <i class="trash icon"></i>
     {{.i18n.Tr "repo.issues.label_deletion"}}
   </div>
   <div class="content">
-    <div class="image">
-      <i class="trash icon"></i>
-    </div>
-    <div class="description">
-      <p>{{.i18n.Tr "repo.issues.label_deletion_desc"}}</p>
-    </div>
+    <p>{{.i18n.Tr "repo.issues.label_deletion_desc"}}</p>
   </div>
   <div class="actions">
-    <div class="two fluid ui inverted buttons">
-      <div class="ui red basic inverted button">
-        <i class="remove icon"></i>
-        {{.i18n.Tr "modal.no"}}
-      </div>
-      <div class="ui green basic inverted positive button">
-        <i class="checkmark icon"></i>
-        {{.i18n.Tr "modal.yes"}}
-      </div>
+    <div class="ui red basic inverted cancel button">
+      <i class="remove icon"></i>
+      {{.i18n.Tr "modal.no"}}
+    </div>
+    <div class="ui green basic inverted ok button">
+      <i class="checkmark icon"></i>
+      {{.i18n.Tr "modal.yes"}}
     </div>
   </div>
 </div>
@@ -84,14 +80,16 @@
 		<form class="ui edit-label form" action="{{$.RepoLink}}/labels/edit" method="post">
 			{{.CsrfTokenHtml}}
 			<input id="label-modal-id" name="id" type="hidden">
-			<div class="inline fields">
-				<div class="field">
-					<input id="label-modal-title" name="title" placeholder="{{.i18n.Tr "repo.issues.new_label_placeholder"}}" required>
+			<div class="ui grid">
+				<div class="five wide column">
+					<div class="ui small input">
+			  		<input class="new-label-input" name="title" placeholder="{{.i18n.Tr "repo.issues.new_label_placeholder"}}" autofocus required>
+					</div>
 				</div>
-				<div class="field">
-		      <input id="label-modal-color" class="color-picker" name="color" value="#70c24a" required>
+				<div class="color picker column">
+	      	<input class="color-picker" name="color" value="#70c24a" required>
 				</div>
-				<div class="field precolors">
+				<div class="column precolors">
 					{{template "repo/issue/label_precolors"}}
 				</div>
 			</div>

templates/repo/issue/list.tmpl

@@ -1,28 +1,26 @@
 {{template "base/head" .}}
 <div class="repository">
 	{{template "repo/header" .}}
-	<div class="ui middle page grid body">
+	<div class="ui container">
 		<div class="navbar">
 			{{template "repo/issue/navbar" .}}
-			<div class="ui right floated secondary menu">
+			<div class="ui right">
 				<a class="ui green button" href="{{$.RepoLink}}/issues/new">{{.i18n.Tr "repo.issues.new"}}</a>
 			</div>
 		</div>
 		<div class="ui divider"></div>
-		<div class="ui left">
-			<div class="ui tiny buttons">
-			  <a class="ui green basic button {{if not .IsShowClosed}}active{{end}}" href="{{.RepoLink}}/issues?type={{$.ViewType}}&state=open&labels={{.SelectLabels}}&milestone={{.MilestoneID}}">
-			  	<i class="octicon octicon-issue-opened"></i>
-			  	{{.i18n.Tr "repo.issues.open_tab" .IssueStats.OpenCount}}
-			  </a>
-			  <a class="ui red basic button {{if .IsShowClosed}}active{{end}}" href="{{.RepoLink}}/issues?type={{.ViewType}}&state=closed&labels={{.SelectLabels}}&milestone={{.MilestoneID}}">
-			  	<i class="octicon octicon-issue-closed"></i>
-			  	{{.i18n.Tr "repo.issues.close_tab" .IssueStats.ClosedCount}}
-			  </a>
-			</div>
+		<div class="ui tiny buttons">
+		  <a class="ui green basic button {{if not .IsShowClosed}}active{{end}}" href="{{.RepoLink}}/issues?type={{$.ViewType}}&state=open&labels={{.SelectLabels}}&milestone={{.MilestoneID}}">
+		  	<i class="octicon octicon-issue-opened"></i>
+		  	{{.i18n.Tr "repo.issues.open_tab" .IssueStats.OpenCount}}
+		  </a>
+		  <a class="ui red basic button {{if .IsShowClosed}}active{{end}}" href="{{.RepoLink}}/issues?type={{.ViewType}}&state=closed&labels={{.SelectLabels}}&milestone={{.MilestoneID}}">
+		  	<i class="octicon octicon-issue-closed"></i>
+		  	{{.i18n.Tr "repo.issues.close_tab" .IssueStats.ClosedCount}}
+		  </a>
 		</div>
 		<div class="ui right floated secondary filter menu">
-			<div class="ui {{if not .Labels}}disabled{{end}} pointing dropdown jump item">
+			<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item">
 				<span class="text">
 					{{.i18n.Tr "repo.issues.filter_label"}}
 					<i class="dropdown icon"></i>
@@ -34,7 +32,7 @@
           {{end}}
 				</div>
 			</div>
-			<div class="ui {{if not .Milestones}}disabled{{end}} pointing dropdown jump item">
+			<div class="ui {{if not .Milestones}}disabled{{end}} dropdown jump item">
 				<span class="text">
 					{{.i18n.Tr "repo.issues.filter_milestone"}}
 					<i class="dropdown icon"></i>
@@ -46,7 +44,7 @@
           {{end}}
 				</div>
 			</div>
-			<!-- <div class="ui {{if not .Assignees}}disabled{{end}} pointing dropdown jump item">
+			<!-- <div class="ui {{if not .Assignees}}disabled{{end}} dropdown jump item">
 				<span class="text">
 					{{.i18n.Tr "repo.issues.filter_assignee"}}
 					<i class="dropdown icon"></i>
@@ -57,7 +55,7 @@
           {{end}}
 				</div>
 			</div> -->
-			<div class="ui pointing dropdown type jump item">
+			<div class="ui dropdown type jump item">
 				<span class="text">
 					{{.i18n.Tr "repo.issues.filter_type"}}
 					<i class="dropdown icon"></i>
@@ -71,57 +69,55 @@
 			</div>
 		</div>
 
-		<div class="sixteen wide column">
-			<div class="issue list">
-				{{range .Issues}}
-				{{ $timeStr:= TimeSince .Created $.Lang }}
-	      <li class="item">
-	      	<div class="ui {{if .IsRead}}black{{else}}green{{end}} label">#{{.Index}}</div>
-	      	<a class="title" href="{{$.RepoLink}}/issues/{{.Index}}">{{.Name}}</a>
+		<div class="issue list">
+			{{range .Issues}}
+			{{ $timeStr:= TimeSince .Created $.Lang }}
+      <li class="item">
+      	<div class="ui {{if .IsRead}}black{{else}}green{{end}} label">#{{.Index}}</div>
+      	<a class="title" href="{{$.RepoLink}}/issues/{{.Index}}">{{.Name}}</a>
 
-	      	{{range .Labels}}
-					<a class="ui label" href="{{$.RepoLink}}/issues?type={{$.ViewType}}&state={{$.State}}&labels={{.ID}}&milestone={{$.MilestoneID}}" style="background-color: {{.Color}}">{{.Name}}</a>
-	      	{{end}}
+      	{{range .Labels}}
+				<a class="ui label" href="{{$.RepoLink}}/issues?type={{$.ViewType}}&state={{$.State}}&labels={{.ID}}&milestone={{$.MilestoneID}}" style="background-color: {{.Color}}">{{.Name}}</a>
+      	{{end}}
 
-	      	{{if .NumComments}}
-	      	<span class="comment ui right"><i class="octicon octicon-comment"></i> {{.NumComments}}</span>
-	      	{{end}}
+      	{{if .NumComments}}
+      	<span class="comment ui right"><i class="octicon octicon-comment"></i> {{.NumComments}}</span>
+      	{{end}}
 
-	        <p class="desc">
-	        	{{$.i18n.Tr "repo.issues.opened_by" $timeStr .Poster.Name|Str2html}}
-		        {{if .Milestone}}
-						{{with .Milestone}}
-						<a class="milestone" href="{{$.RepoLink}}/issues?type={{$.ViewType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{.ID}}">
-							<span class="octicon octicon-milestone"></span> {{.Name}}
-						</a>
-						{{end}}
-		        {{end}}
-	        </p>
-	      </li>
-	      {{end}}
-				
-				{{with .Page}}
-				{{if gt .TotalPages 1}}
-				<div class="center page buttons">
-					<div class="ui borderless pagination menu">
-					  <a class="{{if not .HasPrevious}}disabled{{end}} item" {{if .HasPrevious}}href="{{$.Link}}?type={{$.ViewType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&page={{.Previous}}"{{end}}>
-					    <i class="left arrow icon"></i> {{$.i18n.Tr "repo.issues.previous"}}
-					  </a>
-						{{range .Pages}}
-						{{if eq .Num -1}}
-						<a class="disabled item">...</a>
-						{{else}}
-						<a class="{{if .IsCurrent}}active{{end}} item" {{if not .IsCurrent}}href="{{$.Link}}?type={{$.ViewType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&page={{.Num}}"{{end}}>{{.Num}}</a>
-						{{end}}
-						{{end}}
-					  <a class="{{if not .HasNext}}disabled{{end}} item" {{if .HasNext}}href="{{$.Link}}?type={{$.ViewType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&page={{.Next}}"{{end}}>
-					    {{$.i18n.Tr "repo.issues.next"}} <i class="icon right arrow"></i>
-					  </a>
-					</div>
+        <p class="desc">
+        	{{$.i18n.Tr "repo.issues.opened_by" $timeStr .Poster.Name|Str2html}}
+	        {{if .Milestone}}
+					{{with .Milestone}}
+					<a class="milestone" href="{{$.RepoLink}}/issues?type={{$.ViewType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{.ID}}">
+						<span class="octicon octicon-milestone"></span> {{.Name}}
+					</a>
+					{{end}}
+	        {{end}}
+        </p>
+      </li>
+      {{end}}
+			
+			{{with .Page}}
+			{{if gt .TotalPages 1}}
+			<div class="center page buttons">
+				<div class="ui borderless pagination menu">
+				  <a class="{{if not .HasPrevious}}disabled{{end}} item" {{if .HasPrevious}}href="{{$.Link}}?type={{$.ViewType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&page={{.Previous}}"{{end}}>
+				    <i class="left arrow icon"></i> {{$.i18n.Tr "repo.issues.previous"}}
+				  </a>
+					{{range .Pages}}
+					{{if eq .Num -1}}
+					<a class="disabled item">...</a>
+					{{else}}
+					<a class="{{if .IsCurrent}}active{{end}} item" {{if not .IsCurrent}}href="{{$.Link}}?type={{$.ViewType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&page={{.Num}}"{{end}}>{{.Num}}</a>
+					{{end}}
+					{{end}}
+				  <a class="{{if not .HasNext}}disabled{{end}} item" {{if .HasNext}}href="{{$.Link}}?type={{$.ViewType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&page={{.Next}}"{{end}}>
+				    {{$.i18n.Tr "repo.issues.next"}} <i class="icon right arrow"></i>
+				  </a>
 				</div>
-				{{end}}
-				{{end}}
 			</div>
+			{{end}}
+			{{end}}
 		</div>
 	</div>
 </div>

templates/repo/issue/milestones.tmpl

@@ -1,125 +1,115 @@
 {{template "base/head" .}}
 <div class="repository milestones">
 	{{template "repo/header" .}}
-	<div class="ui middle page grid body">
+	<div class="ui container">
 		<div class="navbar">
 			{{template "repo/issue/navbar" .}}
 			{{if .IsRepositoryAdmin}}
-			<div class="ui right floated secondary menu">
+			<div class="ui right">
 				<a class="ui green button" href="{{$.Link}}/new">{{.i18n.Tr "repo.milestones.new"}}</a>
 			</div>
 			{{end}}
 		</div>
 		<div class="ui divider"></div>
-		{{template "repo/issue/alert" .}}
-		<div class="ui left">
-			<div class="ui tiny buttons">
-			  <a class="ui green basic button {{if not .IsShowClosed}}active{{end}}" href="{{.RepoLink}}/milestones?state=open">
-			  	<i class="octicon octicon-milestone"></i>
-			  	{{.i18n.Tr "repo.milestones.open_tab" .OpenCount}}
-			  </a>
-			  <a class="ui red basic button {{if .IsShowClosed}}active{{end}}" href="{{.RepoLink}}/milestones?state=closed">
-			  	<i class="octicon octicon-milestone"></i>
-			  	{{.i18n.Tr "repo.milestones.close_tab" .ClosedCount}}
-			  </a>
-			</div>
+		{{template "base/alert" .}}
+		<div class="ui tiny buttons">
+		  <a class="ui green basic button {{if not .IsShowClosed}}active{{end}}" href="{{.RepoLink}}/milestones?state=open">
+		  	<i class="octicon octicon-milestone"></i>
+		  	{{.i18n.Tr "repo.milestones.open_tab" .OpenCount}}
+		  </a>
+		  <a class="ui red basic button {{if .IsShowClosed}}active{{end}}" href="{{.RepoLink}}/milestones?state=closed">
+		  	<i class="octicon octicon-milestone"></i>
+		  	{{.i18n.Tr "repo.milestones.close_tab" .ClosedCount}}
+		  </a>
 		</div>
 		
-		<div class="sixteen wide column">
-			<div class="milestone list">
-				{{range .Milestones}}
-				<li class="item">
-					<i class="octicon octicon-milestone"></i> <a href="{{$.RepoLink}}/issues?state={{$.State}}&milestone={{.ID}}">{{.Name}}</a>
-					<div class="ui right blue progress" data-percent="{{.Completeness}}">
-				    <div class="bar" {{if not .Completeness}}style="background-color: transparent"{{end}}>
-				      <div class="progress"></div>
-				    </div>
-					</div>
-					<div class="meta">
-						{{ $closedDate:= TimeSince .ClosedDate $.Lang }}
-						{{if .IsClosed}}
-							<span class="octicon octicon-clock"></span> {{$.i18n.Tr "repo.milestones.closed" $closedDate|Str2html}}
-						{{else}}
-							<span class="octicon octicon-calendar"></span> 
-							{{if .DeadlineString}}
-							<span {{if .IsOverDue}}class="overdue"{{end}}>{{.DeadlineString}}</span>
-							{{else}}
-							{{$.i18n.Tr "repo.milestones.no_due_date"}}
-							{{end}}
-						{{end}}
-						<span class="issue-stats">
-							<i class="octicon octicon-issue-opened"></i> {{$.i18n.Tr "repo.issues.open_tab" .NumOpenIssues}}
-							<i class="octicon octicon-issue-closed"></i> {{$.i18n.Tr "repo.issues.close_tab" .NumClosedIssues}}
-						</span>
-					</div>
-					{{if $.IsRepositoryAdmin}}
-					<div class="ui right operate">
-						<a href="{{$.Link}}/{{.ID}}/edit" data-id={{.ID}} data-title={{.Name}}><i class="octicon octicon-pencil"></i> {{$.i18n.Tr "repo.issues.label_edit"}}</a>
-						{{if .IsClosed}}
-						<a href="{{$.Link}}/{{.ID}}/open" data-id={{.ID}} data-title={{.Name}}><i class="octicon octicon-check"></i> {{$.i18n.Tr "repo.milestones.open"}}</a>
+		<div class="milestone list">
+			{{range .Milestones}}
+			<li class="item">
+				<i class="octicon octicon-milestone"></i> <a href="{{$.RepoLink}}/issues?state={{$.State}}&milestone={{.ID}}">{{.Name}}</a>
+				<div class="ui right green progress" data-percent="{{.Completeness}}">
+			    <div class="bar" {{if not .Completeness}}style="background-color: transparent"{{end}}>
+			      <div class="progress"></div>
+			    </div>
+				</div>
+				<div class="meta">
+					{{ $closedDate:= TimeSince .ClosedDate $.Lang }}
+					{{if .IsClosed}}
+						<span class="octicon octicon-clock"></span> {{$.i18n.Tr "repo.milestones.closed" $closedDate|Str2html}}
+					{{else}}
+						<span class="octicon octicon-calendar"></span> 
+						{{if .DeadlineString}}
+						<span {{if .IsOverDue}}class="overdue"{{end}}>{{.DeadlineString}}</span>
 						{{else}}
-						<a href="{{$.Link}}/{{.ID}}/close" data-id={{.ID}} data-title={{.Name}}><i class="octicon octicon-x"></i> {{$.i18n.Tr "repo.milestones.close"}}</a>
+						{{$.i18n.Tr "repo.milestones.no_due_date"}}
 						{{end}}
-						<a class="delete-button" href="#" data-url="{{$.RepoLink}}/milestones/delete" data-id="{{.ID}}"><i class="octicon octicon-trashcan"></i> {{$.i18n.Tr "repo.issues.label_delete"}}</a>
-					</div>
-					{{if .Content}}
-					<div class="content">
-						{{.RenderedContent|Str2html}}
-					</div>
 					{{end}}
+					<span class="issue-stats">
+						<i class="octicon octicon-issue-opened"></i> {{$.i18n.Tr "repo.issues.open_tab" .NumOpenIssues}}
+						<i class="octicon octicon-issue-closed"></i> {{$.i18n.Tr "repo.issues.close_tab" .NumClosedIssues}}
+					</span>
+				</div>
+				{{if $.IsRepositoryAdmin}}
+				<div class="ui right operate">
+					<a href="{{$.Link}}/{{.ID}}/edit" data-id={{.ID}} data-title={{.Name}}><i class="octicon octicon-pencil"></i> {{$.i18n.Tr "repo.issues.label_edit"}}</a>
+					{{if .IsClosed}}
+					<a href="{{$.Link}}/{{.ID}}/open" data-id={{.ID}} data-title={{.Name}}><i class="octicon octicon-check"></i> {{$.i18n.Tr "repo.milestones.open"}}</a>
+					{{else}}
+					<a href="{{$.Link}}/{{.ID}}/close" data-id={{.ID}} data-title={{.Name}}><i class="octicon octicon-x"></i> {{$.i18n.Tr "repo.milestones.close"}}</a>
 					{{end}}
-				</li>
-				{{end}}
-				
-				{{with .Page}}
-				{{if gt .TotalPages 1}}
-				<div class="center page buttons">
-					<div class="ui borderless pagination menu">
-					  <a class="{{if not .HasPrevious}}disabled{{end}} item" {{if .HasPrevious}}href="{{$.Link}}?state={{$.State}}&page={{.Previous}}"{{end}}>
-					    <i class="left arrow icon"></i> {{$.i18n.Tr "repo.issues.previous"}}
-					  </a>
-						{{range .Pages}}
-						{{if eq .Num -1}}
-						<a class="disabled item">...</a>
-						{{else}}
-						<a class="{{if .IsCurrent}}active{{end}} item" {{if not .IsCurrent}}href="{{$.Link}}?state={{$.State}}&page={{.Num}}"{{end}}>{{.Num}}</a>
-						{{end}}
-						{{end}}
-					  <a class="{{if not .HasNext}}disabled{{end}} item" {{if .HasNext}}href="{{$.Link}}?state={{$.State}}&page={{.Next}}"{{end}}>
-					    {{$.i18n.Tr "repo.issues.next"}} <i class="icon right arrow"></i>
-					  </a>
-					</div>
+					<a class="delete-button" href="#" data-url="{{$.RepoLink}}/milestones/delete" data-id="{{.ID}}"><i class="octicon octicon-trashcan"></i> {{$.i18n.Tr "repo.issues.label_delete"}}</a>
+				</div>
+				{{if .Content}}
+				<div class="content">
+					{{.RenderedContent|Str2html}}
 				</div>
 				{{end}}
 				{{end}}
+			</li>
+			{{end}}
+			
+			{{with .Page}}
+			{{if gt .TotalPages 1}}
+			<div class="center page buttons">
+				<div class="ui borderless pagination menu">
+				  <a class="{{if not .HasPrevious}}disabled{{end}} item" {{if .HasPrevious}}href="{{$.Link}}?state={{$.State}}&page={{.Previous}}"{{end}}>
+				    <i class="left arrow icon"></i> {{$.i18n.Tr "repo.issues.previous"}}
+				  </a>
+					{{range .Pages}}
+					{{if eq .Num -1}}
+					<a class="disabled item">...</a>
+					{{else}}
+					<a class="{{if .IsCurrent}}active{{end}} item" {{if not .IsCurrent}}href="{{$.Link}}?state={{$.State}}&page={{.Num}}"{{end}}>{{.Num}}</a>
+					{{end}}
+					{{end}}
+				  <a class="{{if not .HasNext}}disabled{{end}} item" {{if .HasNext}}href="{{$.Link}}?state={{$.State}}&page={{.Next}}"{{end}}>
+				    {{$.i18n.Tr "repo.issues.next"}} <i class="icon right arrow"></i>
+				  </a>
+				</div>
 			</div>
+			{{end}}
+			{{end}}
 		</div>
 	</div>
 </div>
 
 {{if .IsRepositoryAdmin}}
-<div class="ui basic delete modal">
-  <div class="header">
+<div class="ui small basic delete modal">
+  <div class="ui icon header">
+     <i class="trash icon"></i>
     {{.i18n.Tr "repo.milestones.deletion"}}
   </div>
   <div class="content">
-    <div class="image">
-      <i class="trash icon"></i>
-    </div>
-    <div class="description">
-      <p>{{.i18n.Tr "repo.milestones.deletion_desc"}}</p>
-    </div>
+    <p>{{.i18n.Tr "repo.milestones.deletion_desc"}}</p>
   </div>
   <div class="actions">
-    <div class="two fluid ui inverted buttons">
-      <div class="ui red basic inverted button">
-        <i class="remove icon"></i>
-        {{.i18n.Tr "modal.no"}}
-      </div>
-      <div class="ui green basic inverted positive button">
-        <i class="checkmark icon"></i>
-        {{.i18n.Tr "modal.yes"}}
-      </div>
+    <div class="ui red basic inverted cancel button">
+      <i class="remove icon"></i>
+      {{.i18n.Tr "modal.no"}}
+    </div>
+    <div class="ui green basic inverted ok button">
+      <i class="checkmark icon"></i>
+      {{.i18n.Tr "modal.yes"}}
     </div>
   </div>
 </div>

templates/repo/issue/navbar.tmpl

@@ -1,7 +1,5 @@
-<div class="ui left">
-	<div class="ui compact menu">
-	  <a class="{{if .PageIsIssueList}}active{{end}} item" href="{{.RepoLink}}/issues">{{.i18n.Tr "repo.issues"}}</a>
-	  <a class="{{if .PageIsLabels}}active{{end}} item" href="{{.RepoLink}}/labels">{{.i18n.Tr "repo.labels"}}</a>
-	  <a class="{{if .PageIsMilestones}}active{{end}} item" href="{{.RepoLink}}/milestones">{{.i18n.Tr "repo.milestones"}}</a>
-	</div>
+<div class="ui compact small menu">
+  <a class="{{if .PageIsIssueList}}active{{end}} item" href="{{.RepoLink}}/issues">{{.i18n.Tr "repo.issues"}}</a>
+  <a class="{{if .PageIsLabels}}active{{end}} item" href="{{.RepoLink}}/labels">{{.i18n.Tr "repo.labels"}}</a>
+  <a class="{{if .PageIsMilestones}}active{{end}} item" href="{{.RepoLink}}/milestones">{{.i18n.Tr "repo.milestones"}}</a>
 </div>

templates/repo/issue/view.tmpl

@@ -253,7 +253,7 @@
                     <h4>Milestone</h4>
                     {{if .Milestone}}
                     <p class="completion{{if eq .Milestone.Completeness 0}} hidden{{end}}"><span style="width:{{.Milestone.Completeness}}%">&nbsp;</span></p>
-                    <p class="name"><strong><a href="{{$.RepoLink}}/issues?milestone={{.Milestone.Index}}{{if $.Issue.IsClosed}}&state=closed{{end}}">{{.Milestone.Name}}</a></strong></p>
+                    <p class="name"><strong><a href="{{$.RepoLink}}/issues?milestone={{.Milestone.ID}}{{if $.Issue.IsClosed}}&state=closed{{end}}">{{.Milestone.Name}}</a></strong></p>
                     {{else}}
                     <p class="name">No milestone</p>
                     {{end}}