@@ -930,6 +930,33 @@ button.close {

   background-color: #408140 \9;

 }

+.btn-danger {

+  color: #ffffff;

+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);

+  background-color: #da4f49;

+  background-image: linear-gradient(to bottom, #ee5f5b, #bd362f);

+  background-repeat: repeat-x;

+  border-color: #bd362f #bd362f #802420;

+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);

+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0);

+  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);

+}

+

+.btn-danger:hover,

+.btn-danger:focus,

+.btn-danger:active,

+.btn-danger.active,

+.btn-danger.disabled,

+.btn-danger[disabled] {

+  color: #ffffff;

+  background-color: #bd362f;

+}

+

+.btn-danger:active,

+.btn-danger.active {

+  background-color: #942a25 \9;

+}

+

 /* alert */

 .alert {

   padding: 8px 35px 8px 14px;

@@ -2056,4 +2083,88 @@ button.close {

 .header-bottom {

   margin-bottom:15px;

   min-height:1px;

-}

+}

+

+.project-settings {

+  overflow:hidden;

+}

+

+.project-settings .left {

+  float:left;

+  width:15%;

+  padding-right:10px;

+}

+

+.project-settings .left li {

+  border:1px solid #d8d8d8;

+  border-top:none;

+  padding:5px 10px;

+}

+

+.project-settings .left li:first-child {

+  border-top:1px solid #d8d8d8;

+}

+

+.project-settings .right {

+  float:left;

+  width:85%;

+}

+

+.project-settings-main {

+  margin-bottom:20px;

+}

+

+.project-settings-main li {

+  border:1px solid #d8d8d8;

+  border-top:none;

+  padding:10px 10px;

+}

+

+.project-settings-main li:first-child {

+  border-top:1px solid #d8d8d8;

+  background: #eee;

+  border-radius:3px 3px 0 0;

+  font-size:17px;

+}

+

+.project-settings-main input[type=text] {

+    border:1px solid #d8d8d8;

+    border-radius: 3px;

+    padding:6px 5px;

+    width:100%;

+    margin:5px 0;

+}

+

+.project-settings-main input[type=checkbox] {

+  margin:0 5px;

+}

+

+.project-settings-main select {

+    border:1px solid #d8d8d8;

+    border-radius: 3px;

+    padding:6px 5px;

+    width:30%;

+    margin:5px 0;

+}

+

+.project-settings-danger li {

+  border:1px solid #d8d8d8;

+  border-top:none;

+  padding:10px 10px;

+}

+

+.project-settings-danger li:first-child {

+  border-top:1px solid #d8d8d8;

+  background: #eee;

+  border-radius:3px 3px 0 0;

+  font-size:17px;

+  background:red;

+}

+

+#delete-confirm input {

+  border:1px solid #d8d8d8;

+  border-radius: 3px;

+  padding:6px 5px;

+  margin:5px 0;

+  width:70%;

+}

@@ -172,71 +172,73 @@

     %= include '/include/errors', errors => $errors;

     %= include '/include/message', message => flash('message');

-    <div class="row">

-      <div class="span2">

-        <ul class="unstyled" style="font-size:13px;">

-          <li class="border-gray" style="padding:5px;"><b>Options</b></li>

-          <li class="border-gray" style="border-top:none;padding:6px;"><a href="<%= url_for("/$user/$project/settings/collaboration") %>">Collaborators</a></li>

+    <div class="project-settings">

+      <div class="left">

+        <ul>

+          <li><b>Options</b></li>

+          <li><a href="<%= url_for("/$user/$project/settings/collaboration") %>">Collaborators</a></li>

         </ul>

       </div>

-      <div class="span10">

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

-          <div class="border-gray bk-gray-light radius-top" style="padding-left:5px">

+      <div class="right">

+        <ul class="project-settings-main">

+          <li>

             <h4>

               Settings

             </h4>

-          </div>

-          <div class="border-gray" style="padding:5px 10px;border-top:none">

-            <form id="form-rename-project" action="<%= url_for->query(op => 'rename-project') %>" method="post" style="margin-bottom:0px">

+          </li>

+          <li>

+            <form id="form-rename-project" action="<%= url_for->query(op => 'rename-project') %>" method="post">

               <div >Repository Name</div>

               <div>

-                %= text_field 'to-project' => $project, style => 'margin-top:9px';

+                %= text_field 'to-project' => $project;

                 <a href="#rename-confirm" role="button" class="btn" data-toggle="modal">

                   Rename

                 </a>

               </div>

             </form>

-          </div>

-          <div class="border-gray" style="padding:5px 10px;border-top:none">

-            <form action="<%= url_for->query(op => 'change-description') %>" method="post" style="margin-bottom:0px">

+          </li>

+          <li>

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

               <div >Description</div>

               <div>

                 % my $description = $git->description($user, $project);

                 % $description = '' unless defined $description;

-                %= text_field 'description' => $description, class => 'span8', style => 'margin-top:9px';

+                %= text_field 'description' => $description;

                 <input type="submit" class="btn" value="Save">

               </div>

             </form>

-          </div>

-          <div class="border-gray radius-bottom" style="padding:5px 10px;border-top:none;">

-            <form id="form-default-branch" action="<%= url_for->query(op => 'default-branch') %>" method="post" style="margin-bottom:0px">

+          </li>

+          <li>

+            <form id="form-default-branch" action="<%= url_for->query(op => 'default-branch') %>" method="post">

               Default Branch

-              % my $branches = $git->branches($user, $project);

-              % my $branch_names = [map { $_->{name} } @$branches];

-              % my $default_branch = app->manager->default_branch($user, $project);

-              % push @$branch_names, $default_branch unless @$branch_names;

-              % param('default-branch', $default_branch);

-              %= select_field 'default-branch' => $branch_names, style => 'margin-top:5px';

+              <%

+                my $branches = $git->branches($user, $project);

+                my $branch_names = [map { $_->{name} } @$branches];

+                my $default_branch = app->manager->default_branch($user, $project);

+                push @$branch_names, $default_branch unless @$branch_names;

+                param('default-branch', $default_branch);

+              %>

+              %= select_field 'default-branch' => $branch_names;

             </form>

-          </div>

-          <div class="border-gray radius-bottom" style="padding:5px 10px;border-top:none;">

-            <form id="form-default-branch" action="<%= url_for->query(op => 'private') %>" method="post" style="margin-bottom:0px">

+          </li>

+          <li>

+            <form id="form-default-branch" action="<%= url_for->query(op => 'private') %>" method="post">

               <span>Make this repository private</span>

               % my $private = app->manager->is_private_project($user, $project);

               % if ($private) {

                 % param('private', 1);

               % }

-              %= check_box 'private' => 1, style => 'margin-top:0px;margin-left:5px;margin-right:10px';

+              %= check_box 'private' => 1;

               <input type="submit" class="btn" value="Save">

             </form>

-          </div>

-        </div>

+          </li>

+        </ul>

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

-          <div class="border-gray bk-gray-light radius-top" style="background:red;padding-left:5px">

+        <ul class="project-settings-danger">

+          <li style="background:red;padding-left:5px">

             <h4 style="color:white">Danger Zone</h4>

-          </div>

-          <div class="border-gray radius-bottom" style="padding:5px 10px;border-top:none">

+          </li>

+          <li class="border-gray radius-bottom" style="padding:5px 10px;border-top:none">

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

               <div><b>Delete this repository</b></div>

               <span class="muted">

@@ -248,8 +250,8 @@

               %= hidden_field user => $user;

               %= hidden_field project => $project;

             </form>

-          </div>

-        </div>

+          </li>

+        </ul>

       </div>

     </div>

   </div>

@@ -266,7 +268,7 @@

   <div id="rename-confirm" class="modal hide" tabindex="-1" role="dialog" aria-labelledby="rename-confirm-label" aria-hidden="true">

     <div class="modal-header">

       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>

-      <div style="font-weight:bold">Are you sure you want to rename?</div>

+      <div style="font-weight:bold;">Are you sure you want to rename?</div>

     </div>

     <div class="modal-body">

       <p>

@@ -304,7 +306,7 @@

       <p>

         Please type in the name of the repository(<b><%= $project %></b>) to confirm.

       </p>

-      %= text_field 'deleted-project', class => 'span5';

+      %= text_field 'deleted-project';

     </div>

     <div class="modal-footer">

       <button id="delete" class="btn btn-danger disabled" disabled data-dismiss="modal" aria-hidden="true">