From e4992bbd171cd600cf2dbf2fbadc738021a90917 Mon Sep 17 00:00:00 2001
From: Naoki Takezoe <takezoe@gmail.com>
Date: Mon, 7 Dec 2015 16:53:11 +0900
Subject: [PATCH] Fix styles of repository setting pages

---
 .../gitbucket/core/account/menu.scala.html    |  3 -
 .../gitbucket/core/admin/menu.scala.html      |  3 -
 .../core/settings/collaborators.scala.html    |  2 +-
 .../gitbucket/core/settings/danger.scala.html |  8 +--
 .../core/settings/edithooks.scala.html        | 58 ++++++++++---------
 .../gitbucket/core/settings/hooks.scala.html  |  4 +-
 .../gitbucket/core/settings/menu.scala.html   |  6 +-
 .../core/settings/options.scala.html          | 26 ++++-----
 .../webapp/assets/common/css/gitbucket.css    |  4 +-
 9 files changed, 54 insertions(+), 60 deletions(-)

diff --git a/src/main/twirl/gitbucket/core/account/menu.scala.html b/src/main/twirl/gitbucket/core/account/menu.scala.html
index 930a304ac..47734f949 100644
--- a/src/main/twirl/gitbucket/core/account/menu.scala.html
+++ b/src/main/twirl/gitbucket/core/account/menu.scala.html
@@ -2,9 +2,6 @@
 @import context._
 <div class="box">
   <ul class="nav nav-tabs nav-stacked side-menu">
-    <li>
-      <span class="header strong">Personal settings</span>
-    </li>
     <li@if(active=="profile"){ class="active"}>
       <a href="@path/@loginAccount.get.userName/_edit">Profile</a>
     </li>
diff --git a/src/main/twirl/gitbucket/core/admin/menu.scala.html b/src/main/twirl/gitbucket/core/admin/menu.scala.html
index d85292927..9237aa017 100644
--- a/src/main/twirl/gitbucket/core/admin/menu.scala.html
+++ b/src/main/twirl/gitbucket/core/admin/menu.scala.html
@@ -4,9 +4,6 @@
   <div class="row">
     <div class="col-md-3">
       <ul class="nav nav-tabs nav-stacked side-menu" id="system-admin-menu-container">
-        <li>
-          <span class="header strong">System administration</span>
-        </li>
         <li@if(active=="users"){ class="active"}>
           <a href="@path/admin/users">User Management</a>
         </li>
diff --git a/src/main/twirl/gitbucket/core/settings/collaborators.scala.html b/src/main/twirl/gitbucket/core/settings/collaborators.scala.html
index 9eb291571..5bfc32bcb 100644
--- a/src/main/twirl/gitbucket/core/settings/collaborators.scala.html
+++ b/src/main/twirl/gitbucket/core/settings/collaborators.scala.html
@@ -27,7 +27,7 @@
             <span class="error" id="error-userName"></span>
           </div>
           @helper.html.account("userName", 300)
-          <input type="submit" class="btn" value="Add"/>
+          <input type="submit" class="btn btn-default" value="Add"/>
         </form>
       }
     }
diff --git a/src/main/twirl/gitbucket/core/settings/danger.scala.html b/src/main/twirl/gitbucket/core/settings/danger.scala.html
index 260bb0630..9aa69f563 100644
--- a/src/main/twirl/gitbucket/core/settings/danger.scala.html
+++ b/src/main/twirl/gitbucket/core/settings/danger.scala.html
@@ -5,15 +5,15 @@
   @html.menu("settings", repository){
     @menu("danger", repository){
       <div class="box">
-        <div class="box-header">Danger Zone</div>
+        <div class="box-header"><span class="strong">Danger Zone</span></div>
         <div class="box-content-bottom">
           <form id="transfer-form" method="post" action="@url(repository)/settings/transfer" validate="true" autocomplete="off">
-            <fieldset>
+            <fieldset class="form-group">
               <label class="strong">Transfer Ownership</label>
               <div>
                 Transfer this repo to another user or to group.
                 <div class="pull-right">
-                  @helper.html.account("newOwner", 150)
+                  @helper.html.account("newOwner", 200)
                   <input type="submit" class="btn btn-danger" value="Transfer"/>
                   <div>
                     <span id="error-newOwner" class="error"></span>
@@ -23,7 +23,7 @@
             </fieldset>
           </form>
           <form id="delete-form" method="post" action="@url(repository)/settings/delete">
-            <fieldset class="margin">
+            <fieldset class="margin form-group">
               <label class="strong">Delete repository</label>
               <div>
                 Once you delete a repository, there is no going back.
diff --git a/src/main/twirl/gitbucket/core/settings/edithooks.scala.html b/src/main/twirl/gitbucket/core/settings/edithooks.scala.html
index 7e76d4312..a99846f7e 100644
--- a/src/main/twirl/gitbucket/core/settings/edithooks.scala.html
+++ b/src/main/twirl/gitbucket/core/settings/edithooks.scala.html
@@ -16,27 +16,28 @@
 
       <div class="box">
         <div class="box-header">
-          Webhook / Manage webhook
+          <span class="strong">Webhook / Manage webhook</span>
         </div>
         <div class="box-content-bottom">
           <form method="POST" validate="true">
-            <div>
-              <span class="error" id="error-url"></span>
-            </div>
-            <label class="strong">Payload URL</label>
-            @if(create){
-              <input type="text" name="url" id="url" value="@webHook.url" class="input-xxlarge" style="margin-bottom: 0px;" required />
-            } else {
-              <input type="text" value="@webHook.url" style="margin-bottom: 0px;" class="input-xxlarge" disabled />
-              <input type="hidden" value="@webHook.url" name="url" />
-            }
-            <button class="btn" id="test">Test Hook</button>
-
+            <fieldset class="form-group">
+              <label class="strong">Payload URL</label>
+              <div>
+                <span class="error" id="error-url"></span>
+              </div>
+              @if(create){
+                <input type="text" name="url" id="url" value="@webHook.url" class="form-control" style="display: inline; width: 500px; vertical-align: middle;" required />
+              } else {
+                <input type="text" value="@webHook.url" class="form-control" style="display: inline; width: 500px; vertical-align: middle;" disabled />
+                <input type="hidden" value="@webHook.url" name="url" />
+              }
+              <button class="btn btn-default" id="test">Test Hook</button>
+            </fieldset>
             <hr />
+            <label class="strong">Which events would you like to trigger this webhook?</label>
             <div>
               <span class="error" id="error-events"></span>
             </div>
-            <label class="strong">Which events would you like to trigger this webhook?</label>
             <!--
             <label class="checkbox"><input type="checkbox" @check("events",CommitComment) />Commit comment <small class="help-block">Commit or diff commented on. </small> </label>
             <label class="checkbox"><input type="checkbox" @check("events",Create) />Create <small class="help-block">Branch, or tag created. </small> </label>
@@ -53,20 +54,21 @@
             <label class="checkbox"><input type="checkbox" @check("events",Watch) />Watch <small class="help-block">User stars a repository.</small></label>
             <label class="checkbox"><input type="checkbox" @check("events",Status) />Status <small class="help-block">Commit status updated from the API. </small> </label>
             -->
-            <label class="checkbox"><input type="checkbox" @check("events",IssueComment) />Issue comment <small class="help-block">Issue commented on. </small> </label>
-            <label class="checkbox"><input type="checkbox" @check("events",Issues) />Issues <small class="help-block">Issue opened, closed<!-- , assigned, or labeled -->. </small> </label>
-            <label class="checkbox"><input type="checkbox" @check("events",PullRequest) />Pull Request <small class="help-block">Pull Request opened, closed<!-- , assigned, labeled -->, or synchronized. </small> </label>
-            <label class="checkbox"><input type="checkbox" @check("events",PullRequestReviewComment) />Pull Request review comment <small class="help-block">Pull Request diff commented on. </small> </label>
-            <label class="checkbox"><input type="checkbox" @check("events",Push) />Push <small class="help-block">Git push to a repository. </small> </label>
-            <hr />
-            @if(!create){
-              <input type="submit" class="btn btn-success" value="Update webhook" formaction="@url(repository)/settings/hooks/edit/@urlEncode(webHook.url)" />
-              <a href="@url(repository)/settings/hooks/delete?url=@urlEncode(webHook.url)" class="btn text-error" onclick="return confirm('delete webhook for @webHook.url ?')">
-                Delete webhook
-              </a>
-            } else {
-              <input type="submit" class="btn" value="Add webhook" formaction="@url(repository)/settings/hooks/new" />
-            }
+            <label class="checkbox"><input type="checkbox" @check("events",IssueComment) />Issue comment <span class="help-block normal">Issue commented on. </span> </label>
+            <label class="checkbox"><input type="checkbox" @check("events",Issues) />Issues <span class="help-block normal">Issue opened, closed<!-- , assigned, or labeled -->. </span> </label>
+            <label class="checkbox"><input type="checkbox" @check("events",PullRequest) />Pull Request <span class="help-block normal">Pull Request opened, closed<!-- , assigned, labeled -->, or synchronized. </span> </label>
+            <label class="checkbox"><input type="checkbox" @check("events",PullRequestReviewComment) />Pull Request review comment <span class="help-block normal">Pull Request diff commented on. </span> </label>
+            <label class="checkbox"><input type="checkbox" @check("events",Push) />Push <span class="help-block normal">Git push to a repository. </span> </label>
+            <div class="text-right">
+              @if(!create){
+                <input type="submit" class="btn btn-success" value="Update webhook" formaction="@url(repository)/settings/hooks/edit/@urlEncode(webHook.url)" />
+                <a href="@url(repository)/settings/hooks/delete?url=@urlEncode(webHook.url)" class="btn btn-danger" onclick="return confirm('delete webhook for @webHook.url ?')">
+                  Delete webhook
+                </a>
+              } else {
+                <input type="submit" class="btn btn-success" value="Add webhook" formaction="@url(repository)/settings/hooks/new" />
+              }
+            </div>
           </form>
         </div>
       </div>
diff --git a/src/main/twirl/gitbucket/core/settings/hooks.scala.html b/src/main/twirl/gitbucket/core/settings/hooks.scala.html
index 1ddcf935c..2184c7321 100644
--- a/src/main/twirl/gitbucket/core/settings/hooks.scala.html
+++ b/src/main/twirl/gitbucket/core/settings/hooks.scala.html
@@ -10,8 +10,8 @@
 
 <div class="box">
   <div class="box-header">
-    <a href="@url(repository)/settings/hooks/new" class="btn btn-mini pull-right">Add webhook</a>
-    Webhooks
+    <a href="@url(repository)/settings/hooks/new" class="btn btn-success btn-sm pull-right">Add webhook</a>
+    <span class="strong">Webhooks</span>
   </div>
   <div class="box-content-bottom">
     <p>
diff --git a/src/main/twirl/gitbucket/core/settings/menu.scala.html b/src/main/twirl/gitbucket/core/settings/menu.scala.html
index 94f7f811e..13fd262fc 100644
--- a/src/main/twirl/gitbucket/core/settings/menu.scala.html
+++ b/src/main/twirl/gitbucket/core/settings/menu.scala.html
@@ -1,8 +1,8 @@
 @(active: String, repository: gitbucket.core.service.RepositoryService.RepositoryInfo)(body: Html)(implicit context: gitbucket.core.controller.Context)
 @import context._
 @import gitbucket.core.view.helpers._
-<div class="row-fluid">
-  <div class="span3">
+<div class="row">
+  <div class="col-md-3">
     <div class="box">
       <ul class="nav nav-tabs nav-stacked side-menu">
         <li@if(active=="options"){ class="active"}>
@@ -20,7 +20,7 @@
       </ul>
     </div>
   </div>
-  <div class="span9">
+  <div class="col-md-9">
     @body
   </div>
 </div>
diff --git a/src/main/twirl/gitbucket/core/settings/options.scala.html b/src/main/twirl/gitbucket/core/settings/options.scala.html
index 5287cb6ee..1c55ab9b8 100644
--- a/src/main/twirl/gitbucket/core/settings/options.scala.html
+++ b/src/main/twirl/gitbucket/core/settings/options.scala.html
@@ -7,18 +7,18 @@
       @helper.html.information(info)
       <form id="form" method="post" action="@url(repository)/settings/options" validate="true">
         <div class="box">
-          <div class="box-header">Settings</div>
+          <div class="box-header"><span class="strong">Settings</span></div>
           <div class="box-content-bottom">
-            <fieldset>
+            <fieldset class="form-group">
               <label for="repositoryName" class="strong">Repository Name:</label>
-              <input type="text" name="repositoryName" id="repositoryName" value="@repository.name"/>
+              <input type="text" name="repositoryName" id="repositoryName" class="form-control" value="@repository.name"/>
               <span id="error-repositoryName" class="error"></span>
             </fieldset>
-            <fieldset class="margin">
+            <fieldset class="margin form-group">
               <label for="description" class="strong">Description:</label>
-              <input type="text" name="description" id="description" style="width: 600px;" value="@repository.repository.description"/>
+              <input type="text" name="description" id="description" class="form-control" value="@repository.repository.description"/>
             </fieldset>
-            <fieldset class="margin">
+            <fieldset class="margin form-group">
               <label for="defaultBranch" class="strong">Default Branch:</label>
               <select name="defaultBranch" id="defaultBranch"@if(repository.branchList.isEmpty){ disabled}>
                 @if(repository.branchList.isEmpty){
@@ -40,21 +40,19 @@
                   @if(!repository.repository.isPrivate              ){ checked  }
                   @if(repository.repository.parentUserName.isDefined){ disabled }
                 >
-                <span class="strong">Public</span><br>
-                <div>
-                  <span>All users and guests can read this repository.</span>
+                <span class="strong"><i class="octicon octicon-repo"></i> Public</span><br>
+                <div class="normal muted">
+                  Anyone can see this repository. You choose who can commit.
                 </div>
               </label>
-            </fieldset>
-            <fieldset>
               <label class="radio">
                 <input type="radio" name="isPrivate" value="true"
                   @if(repository.repository.isPrivate               ){ checked  }
                   @if(repository.repository.parentUserName.isDefined){ disabled }
                 >
-                <span class="strong">Private</span><br>
-                <div>
-                  <span>Only collaborators can read this repository.</span>
+                <span class="strong"><i class="octicon octicon-lock"></i> Private</span><br>
+                <div class="normal muted">
+                  You choose who can see and commit to this repository.
                 </div>
               </label>
             </fieldset>
diff --git a/src/main/webapp/assets/common/css/gitbucket.css b/src/main/webapp/assets/common/css/gitbucket.css
index 87dedf0fd..a3cd9b0da 100644
--- a/src/main/webapp/assets/common/css/gitbucket.css
+++ b/src/main/webapp/assets/common/css/gitbucket.css
@@ -547,6 +547,7 @@ ul.nav-stacked.side-menu li {
   margin-bottom: -3px;
 }
 
+/*
 ul.nav-stacked.side-menu li span.header {
   border-top-right-radius: 3px;
   border-top-left-radius: 3px;
@@ -556,6 +557,7 @@ ul.nav-stacked.side-menu li span.header {
   margin-right: 2px;
   background-color: #f5f5f5;
 }
+*/
 
 ul.nav-stacked.side-menu li a:hover {
   background-color: transparent;
@@ -583,12 +585,10 @@ ul.nav-stacked.side-menu li.active a:hover {
   padding: 8px 15px 9px;
 }
 
-/*
 .nav-tabs.nav-stacked.side-menu > li:first-child > a {
   border-top-right-radius: 3px;
   border-top-left-radius: 3px;
 }
-*/
 
 .nav-tabs.nav-stacked.side-menu > li:last-child > a {
   border-bottom-right-radius: 3px;