issue create page ui

public/css/gogs.css

@@ -512,6 +512,14 @@ html, body {
     height: 39px;
 }
 
+#repo-toolbar .nav .tmp a:hover {
+    text-decoration: none;
+}
+
+#repo-toolbar .nav .tmp .btn {
+    margin-top: -2px;
+}
+
 #repo-toolbar .nav .active {
     color: #F6F6F6;
 }
@@ -602,7 +610,7 @@ html, body {
 }
 
 /* #source */
-#source {
+#source, #commits {
     margin-top: -20px;
 }
 
@@ -857,7 +865,7 @@ html, body {
 }
 
 .guide-box, .diff-head-box {
-    margin-top: 20px;
+    margin-top: 4px;
 }
 
 .diff-head-box h4 {
@@ -991,6 +999,24 @@ html, body {
     color: #AAA;
 }
 
+/* issue */
+
+#issue-create-form .panel-body {
+    padding: 15px 0 0 0;
+}
+
+#issue-create-form .panel-body.form-group, #issue-create-form .tab-pane .form-group {
+    margin-bottom: 0;
+}
+
+#issue-create-form .nav-tabs {
+    margin-bottom: 10px;
+}
+
+#issue-create-form .md-help{
+    margin-top: 6px;
+}
+
 /* wrapper and footer */
 
 #wrapper {

public/js/app.js

@@ -111,6 +111,7 @@ var Gogits = {
     };
     Gogits.initTabs = function () {
         var $tabs = $('[data-init=tabs]');
+        $tabs.tab("show");
         $tabs.find("li:eq(0) a").tab("show");
     };
     // fix dropdown inside click

templates/issue/create.tmpl

@@ -3,8 +3,40 @@
 {{template "repo/nav" .}}
 {{template "repo/toolbar" .}}
 <div id="body" class="container">
-    <div id="source">
-        new-issues
+    <div id="issue">
+        <form class="form" action="#" method="post" id="issue-create-form">
+            <div class="col-md-1">
+                <img class="avatar" src="http://tp2.sinaimg.cn/5068084885/50/40050297589/1" alt=""/>
+            </div>
+            <div class="col-md-8 panel panel-default">
+                <div class="form-group panel-body">
+                    <input class="form-control input-lg" type="text" name="title" required="required" placeholder="Title"/>
+                </div>
+                <div class="form-group panel-body">
+                    <div class="md-help pull-right"><!-- todo help link -->
+                        Content with <a href="#">Markdown</a>
+                    </div>
+                    <ul class="nav nav-tabs" data-init="tabs">
+                        <li class="active"><a href="#issue-textarea" data-toggle="tab">Write</a></li>
+                        <li><a href="#issue-preview" data-toggle="tab">Preview</a></li>
+                    </ul>
+                    <div class="tab-content">
+                        <div class="tab-pane" id="issue-textarea">
+                            <div class="form-group">
+                                <textarea class="form-control" name="content" id="issue-content" rows="10" placeholder="Write some content"></textarea>
+                            </div>
+                        </div>
+                        <div class="tab-pane" id="issue-preview">preview</div>
+                    </div>
+                </div>
+                <div class="text-right panel-body">
+                    <div class="form-group">
+                        <input type="hidden" value="id" name="repo-id"/>
+                        <button class="btn-success btn">Create new issue</button>
+                    </div>
+                </div>
+            </div>
+        </form>
     </div>
 </div>
 {{template "base/footer" .}}

templates/repo/toolbar.tmpl

@@ -9,6 +9,11 @@
                     <!-- <li class="{{if .IsRepoToolbarBranches}}active{{end}}"><a href="/{{.RepositoryLink}}/branches">Branches</a></li> -->
                     <!-- <li class="{{if .IsRepoToolbarPulls}}active{{end}}"><a href="/{{.RepositoryLink}}/pulls">Pull Requests</a></li> -->
                     <li class="{{if .IsRepoToolbarIssues}}active{{end}}"><a href="/{{.RepositoryLink}}/issues">Issues <!--<span class="badge">42</span>--></a></li>
+                    {{if .IsRepoToolbarIssues}}
+                    <li class="tmp"><a href="/{{.RepositoryLink}}/issues/new">
+                        <button class="btn btn-primary btn-sm">New Issue</button>
+                    </a></li>
+                    {{end}}
                     <!-- <li class="dropdown">
                         <a href="#" class="dropdown-toggle" data-toggle="dropdown">More <b class="caret"></b></a>
                         <ul class="dropdown-menu">