@@ -17,7 +17,6 @@

     border:1px solid #d8d8d8;

     border-radius: 3px;

     padding:6px 5px;

-    width:100%;

     margin:5px 0;

@@ -36,6 +35,108 @@

   box-sizing: border-box;

 }

+.container {

+  width: 980px;

+  margin:0 auto;

+}

+

+.new-container {

+  width: 800px;

+  margin:0 auto;

+}

+

+.new-title-container {

+  border-bottom:1px solid #e5e5e5;

+  margin-top:40px;

+  margin-bottom:15px;

+}

+

+.new-readme {

+  border-bottom:1px solid #e5e5e5;

+  margin-bottom:16px;

+}

+

+.new-readme div:first-child {

+  font-weight:bold;

+}

+

+.new-readme div:first-child span {

+  padding-left:5px;

+}

+

+.new-readme > .last-child {

+  padding:0px 0px 15px 17px;

+  color:#767676;

+}

+

+.new-title {

+  font-weight:bold;

+  font-size:19px;

+  color:#333;

+  margin-bottom:5px;

+}

+

+.new-description {

+  color:#666;

+  margin-bottom:8px;

+}

+

+.new-private {

+  border-bottom:1px solid #e5e5e5;

+  margin-bottom:16px;

+}

+

+.new-private li {

+  padding:5px 0;

+}

+

+.new-private span {

+  font-weight:bold;

+  padding-left:5px;

+}

+

+.new-private .last-child {

+  color:#767676;

+  padding-left:17px;

+}

+

+.new-repository {

+  border-bottom:1px solid #e5e5e5;

+  margin-bottom:5px;

+}

+

+.new-repository .2th-child {

+

+}

+

+.new-repository .last-child {

+  margin-bottom:10px;

+}

+

+.new-repository .last-child input[type=text] {

+  border:1px solid #d8d8d8;

+  border-radius: 3px;

+  padding:6px 5px;

+  margin:5px 0;

+  width:100%;

+}

+

+.new-repository table {

+  margin-bottom:10px;

+}

+

+.new-repository td {

+  padding:0px 0;

+}

+

+.new-repository input[type=text] {

+  border:1px solid #d8d8d8;

+  border-radius: 3px;

+  padding:6px 5px;

+  margin:5px 0;

+  width:350px;

+}

+

 body {

   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

   font-size: 14px;

@@ -98,11 +199,6 @@ body {

 /* Markdown */

 .markdown-body{padding:40px 40px;font-family:"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";font-size:16px;line-height:1.6;word-wrap:break-word}.markdown-body:before{display:table;content:""}.markdown-body:after{display:table;clear:both;content:""}.markdown-body>*:first-child{margin-top:0 !important}.markdown-body>*:last-child{margin-bottom:0 !important}.markdown-body a:not([href]){color:inherit;text-decoration:none}.markdown-body .absent{color:#c00}.markdown-body .anchor{display:inline-block;padding-right:2px;margin-left:-18px}.markdown-body .anchor:focus{outline:none}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5,.markdown-body h6{margin-top:1em;margin-bottom:16px;font-weight:bold;line-height:1.4}.markdown-body h1 .octicon-link,.markdown-body h2 .octicon-link,.markdown-body h3 .octicon-link,.markdown-body h4 .octicon-link,.markdown-body h5 .octicon-link,.markdown-body h6 .octicon-link{color:#000;vertical-align:middle;visibility:hidden}.markdown-body h1:hover .anchor,.markdown-body h2:hover .anchor,.markdown-body h3:hover .anchor,.markdown-body h4:hover .anchor,.markdown-body h5:hover .anchor,.markdown-body h6:hover .anchor{text-decoration:none}.markdown-body h1:hover .anchor .octicon-link,.markdown-body h2:hover .anchor .octicon-link,.markdown-body h3:hover .anchor .octicon-link,.markdown-body h4:hover .anchor .octicon-link,.markdown-body h5:hover .anchor .octicon-link,.markdown-body h6:hover .anchor .octicon-link{visibility:visible}.markdown-body h1 tt,.markdown-body h1 code,.markdown-body h2 tt,.markdown-body h2 code,.markdown-body h3 tt,.markdown-body h3 code,.markdown-body h4 tt,.markdown-body h4 code,.markdown-body h5 tt,.markdown-body h5 code,.markdown-body h6 tt,.markdown-body h6 code{font-size:inherit}.markdown-body h1{padding-bottom:0.3em;font-size:2.25em;line-height:1.2;border-bottom:1px solid #eee}.markdown-body h1 .anchor{line-height:1}.markdown-body h2{padding-bottom:0.3em;font-size:1.75em;line-height:1.225;border-bottom:1px solid #eee}.markdown-body h2 .anchor{line-height:1}.markdown-body h3{font-size:1.5em;line-height:1.43}.markdown-body h3 .anchor{line-height:1.2}.markdown-body h4{font-size:1.25em}.markdown-body h4 .anchor{line-height:1.2}.markdown-body h5{font-size:1em}.markdown-body h5 .anchor{line-height:1.1}.markdown-body h6{font-size:1em;color:#777}.markdown-body h6 .anchor{line-height:1.1}.markdown-body p,.markdown-body blockquote,.markdown-body ul,.markdown-body ol,.markdown-body dl,.markdown-body table,.markdown-body pre{margin-top:0;margin-bottom:16px}.markdown-body hr{height:4px;padding:0;margin:16px 0;background-color:#e7e7e7;border:0 none}.markdown-body ul,.markdown-body ol{padding-left:2em}.markdown-body ul.no-list,.markdown-body ol.no-list{padding:0;list-style-type:none}.markdown-body ul ul,.markdown-body ul ol,.markdown-body ol ol,.markdown-body ol ul{margin-top:0;margin-bottom:0}.markdown-body li>p{margin-top:16px}.markdown-body dl{padding:0}.markdown-body dl dt{padding:0;margin-top:16px;font-size:1em;font-style:italic;font-weight:bold}.markdown-body dl dd{padding:0 16px;margin-bottom:16px}.markdown-body blockquote{padding:0 15px;color:#777;border-left:4px solid #ddd}.markdown-body blockquote>:first-child{margin-top:0}.markdown-body blockquote>:last-child{margin-bottom:0}.markdown-body table{display:block;width:100%;overflow:auto;word-break:normal;word-break:keep-all}.markdown-body table th{font-weight:bold}.markdown-body table th,.markdown-body table td{padding:6px 13px;border:1px solid #ddd}.markdown-body table tr{background-color:#fff;border-top:1px solid #ccc}.markdown-body table tr:nth-child(2n){background-color:#f8f8f8}.markdown-body img{max-width:100%;box-sizing:content-box;background-color:#fff}.markdown-body img[align=right]{padding-left:20px}.markdown-body img[align=left]{padding-right:20px}.markdown-body .emoji{max-width:none}.markdown-body span.frame{display:block;overflow:hidden}.markdown-body span.frame>span{display:block;float:left;width:auto;padding:7px;margin:13px 0 0;overflow:hidden;border:1px solid #ddd}.markdown-body span.frame span img{display:block;float:left}.markdown-body span.frame span span{display:block;padding:5px 0 0;clear:both;color:#333}.markdown-body span.align-center{display:block;overflow:hidden;clear:both}.markdown-body span.align-center>span{display:block;margin:13px auto 0;overflow:hidden;text-align:center}.markdown-body span.align-center span img{margin:0 auto;text-align:center}.markdown-body span.align-right{display:block;overflow:hidden;clear:both}.markdown-body span.align-right>span{display:block;margin:13px 0 0;overflow:hidden;text-align:right}.markdown-body span.align-right span img{margin:0;text-align:right}.markdown-body span.float-left{display:block;float:left;margin-right:13px;overflow:hidden}.markdown-body span.float-left span{margin:13px 0 0}.markdown-body span.float-right{display:block;float:right;margin-left:13px;overflow:hidden}.markdown-body span.float-right>span{display:block;margin:13px auto 0;overflow:hidden;text-align:right}.markdown-body code,.markdown-body tt{padding:0;padding-top:0.2em;padding-bottom:0.2em;margin:0;font-size:85%;background-color:rgba(0,0,0,0.04);border-radius:3px}.markdown-body code:before,.markdown-body code:after,.markdown-body tt:before,.markdown-body tt:after{letter-spacing:-0.2em;content:"\00a0"}.markdown-body code br,.markdown-body tt br{display:none}.markdown-body del code{text-decoration:inherit}.markdown-body pre>code{padding:0;margin:0;font-size:100%;word-break:normal;white-space:pre;background:transparent;border:0}.markdown-body .highlight{margin-bottom:16px}.markdown-body .highlight pre,.markdown-body pre{padding:16px;overflow:auto;font-size:85%;line-height:1.45;background-color:#f7f7f7;border-radius:3px}.markdown-body .highlight pre{margin-bottom:0;word-break:normal}.markdown-body pre{word-wrap:normal}.markdown-body pre code,.markdown-body pre tt{display:inline;max-width:initial;padding:0;margin:0;overflow:initial;line-height:inherit;word-wrap:normal;background-color:transparent;border:0}.markdown-body pre code:before,.markdown-body pre code:after,.markdown-body pre tt:before,.markdown-body pre tt:after{content:normal}.markdown-body kbd{display:inline-block;padding:3px 5px;font-size:11px;line-height:10px;color:#555;vertical-align:middle;background-color:#fcfcfc;border:solid 1px #ccc;border-bottom-color:#bbb;border-radius:3px;box-shadow:inset 0 -1px 0 #bbb}.markdown-body blockquote{padding:0 0 0 40px;border:0 none}

-.container {

-  width: 980px;

-  margin:0 auto;

-}

-

 ul {

   padding: 0;

   margin: 0;;

@@ -50,6 +50,7 @@

       $description = '' unless defined $description;

       my $readme = $data->{readme};

       my $private = $data->{private};

+      $private ||= 0;

       my $manager = app->manager;

       if ($manager->exists_project($session_user, $project)) {

@@ -83,7 +84,7 @@

   %= include '/include/header', no_project_header => 1;

-  <div class="container">

+  <div class="new-container">

     % if ($errors) {

       <div class="alert alert-error">

         <button type="button" class="close" data-dismiss="alert">&times;</button>

@@ -92,60 +93,76 @@

         % }

       </div>

     % }

-    <div style="border-bottom:1px solid #e5e5e5;margin-top:40px;margin-bottom:20px;">

-      <div style="font-weight:bold;font-size:18px;color:#333;margin-bottom:3px;">

+    <div class="new-title-container">

+      <div class="new-title">

         Create a new repository

       </div>

-      <div style="color:#666;margin-bottom:5px;">

+      <div class="new-description">

         A repository contains all the files for your project, including the revision history.

       </div>

     </div>

     <form action="<%= url_for->query(op => 'create') %>" method="post">

-      <table>

-        <tr>

-          <td>

-            <b>Owner</b>

-          </td>

-          <td>

-          

-          </td>

-          <td>

-            <b>Repository name</b>

-          </td>

-        </tr>

-        <tr>

-          <td>

-            <i class="icon-user"></i><%= $session_user %>

-          </td>

-          <td style="padding:0 10px">

-            /

-          </td>

-          <td>

-            <%= input_tag 'project', type => 'text', style => 'width:300px' %>

-          </td>

-        </tr>

-      </table>

-      <div style="margin-bottom:20px">

-        Great repository names are short and memorable.

+      <div class="new-repository">

+        <table>

+          <tr>

+            <td>

+              <b>Owner</b>

+            </td>

+            <td>

+            

+            </td>

+            <td>

+              <b>Repository name</b>

+            </td>

+          </tr>

+          <tr>

+            <td>

+              <i class="icon-user"></i><%= $session_user %>

+            </td>

+            <td style="padding:0 10px">

+              /

+            </td>

+            <td>

+              <%= text_field 'project'%>

+            </td>

+          </tr>

+        </table>

+        <div class="2th-child">

+          <b>Description</b> <span style="color:#767676">(optional)</span>

+        </div>

+        <div class="last-child">

+          <%= text_field 'description' %>

+        </div>

       </div>

-

-      <div><b>Description</b> (optional)</div>

-      <div><%= input_tag 'description', type => 'text', style => 'width:600px' %></div>

+      <ul class="new-private">

+        <li>

+          <div>

+            <%= radio_button private => 0, checked => undef %><span>Public</span>

+          </div>

+          <div class="last-child">

+            Anyone can see this repository. You choose who can commit.

+          </div>

+        </li>

+        <li>

+          <div>

+            <%= radio_button private => 1 %><span>Private</span>

+          </div>

+          <div class="last-child">

+            You choose who can see and commit to this repository.

+          </div>

+        </li>

+      </ul>

-      <div>

-        <label class="checkbox" style="margin-bottom:0">

-          <%= check_box readme => 1 %><b>Initialize this $session_usertory with a README</b>

-        </label>

-      </div>

-      <div class="muted" style="margin-left:20px">This will allow you to git clone the repository immediately.</div>

-

-      <div>

-        <label class="checkbox" style="margin-bottom:0">

-          <%= check_box private => 1 %><b>Make this repository private </b>

-        </label>

+      <div class="new-readme">

+        <div>

+          <%= check_box readme => 1 %><span>Initialize this this repository with a README<span>

+        </div>

+        <div class="last-child">

+          This will let you immediately clone the repository to your computer. Skip this step if you’re importing an existing repository.

+        </div>

       </div>

-            

-      <input style="margin-top:10px" type="submit" class="btn" value="Create repository">

+      

+      <input type="submit" class="btn btn-success" value="Create repository">

     </form>

   </div>

   %= include '/include/footer';