some mods by ika

app/assets/stylesheets/client_management/backend.css

@@ -8,8 +8,9 @@ h1, h2, h3, h4, h5, h6, label, legend {
   background: #fff;
   padding: 20px;
   border: 1px solid #ddd;
-  margin: 30px;
+  margin: 30px 0 30px 15px;
   max-width: 1000px;
+  position: relative;
 }
 .sub-title {
   color: #337ab7;
@@ -18,9 +19,36 @@ h1, h2, h3, h4, h5, h6, label, legend {
   margin: 50px 0 5px;
   padding: 0 0 0 8px;
 }
+.sub-title .label {
+  padding: 4px 10px 5px;
+  font-size: 12px;
+  margin: 0 0 0 10px;
+  vertical-align: text-top;
+}
 .page-client > div:first-child .sub-title {
   margin: 20px 0 5px;
 }
+.page-client > * {
+  margin: 0 0 30px;
+}
+.page-receipts .info-receipts {
+  overflow-x: auto;
+}
+.page-receipts table {
+  margin: 0 0 10px;
+}
+.page-receipts table .btn {
+  width: auto;
+  margin: 0;
+}
+.page-receipts table th {
+  width: 15%;
+  white-space: normal;
+  vertical-align: top;
+}
+.page-client > *:last-child {
+  margin: 0;
+}
 .line-content {
   width: 100%;
   margin: 0 0 15px;
@@ -52,6 +80,7 @@ div .line-content:nth-child(1) {
 }
 .line-content .header-line label {
   color: #000;
+  font-size: 15px;
   font-weight: 500;
   float: left;
   width: 200px;
@@ -82,6 +111,12 @@ div .line-content:nth-child(1) {
   margin: 10px 0;
   border-radius: 4px;
 }
+.line-content.qt div.requirement-text {
+  background: rgba(0,0,0,0.04);
+  padding: 10px;
+  margin: 10px 0;
+  border-radius: 4px;
+}
 .line-content.qt ol.custom-module li {
   margin: 5px 0;
 }

app/views/admin/client_managements/_purchase_form.html.erb

@@ -52,4 +52,9 @@
 <% if @receipt.new_record? %>
 	<%= f.hidden_field :contract_purchase_id, :value => @purchase.id.to_s %>
 <% end %>
+
+<div class="line-content">
+	<span class="header-line">
 		<%= f.submit "Submit", :class => "btn btn-primary" %>
+	</span>
+</div>

app/views/admin/client_managements/add_receipt.html.erb

@@ -5,6 +5,8 @@
   <%= javascript_include_tag "lib/bootstrap-datetimepicker" %>
   <%= javascript_include_tag "lib/datetimepicker/datetimepicker.js" %>
 <% end %>
+
+<div class="page-contract page-client">
 	<div class="info-detail">
 		<div class="info-spec">
 			<%= form_for @receipt, :url => {:action => :create_receipt}, :html => {:class => "form-horizontal contract-form"} do |f| %>
@@ -13,3 +15,4 @@
 			<% end %>
 		</div>
 	</div>
+</div>

app/views/admin/client_managements/edit_receipt.html.erb

@@ -5,6 +5,7 @@
   <%= javascript_include_tag "lib/bootstrap-datetimepicker" %>
   <%= javascript_include_tag "lib/datetimepicker/datetimepicker.js" %>
 <% end %>
+<div class="page-contract page-client">
 	<div class="info-detail">
 		<div class="info-spec">
 			<%= form_for @receipt, :url => {:action => :update_receipt}, :html => {:class => "form-horizontal contract-form"} do |f| %>
@@ -13,3 +14,4 @@
 			<% end %>
 		</div>
 	</div>
+</div>

app/views/admin/client_managements/receipts.html.erb

@@ -2,15 +2,15 @@
   <%= stylesheet_link_tag "client_management/backend" %>
 <% end %>
 
-<div class="page-contract page-client">
+<div class="page-receipts page-client">
 	<div class="info-contract">
 		<h3 class="sub-title">
-			<% if @purchase.total_amount == (@total_received_amount + @total_adjustable_amount) %>
-				<span class="label label-success pull-right">Received</span>
-			<% else %>
-				<span class="label label-important pull-right">Pending</span>
-			<% end %>
 			Purchase Info
+			<% if @purchase.total_amount == (@total_received_amount + @total_adjustable_amount) %>
+				<span class="label label-success">Received</span>
+			<% else %>
+				<span class="label label-important">Pending</span>
+			<% end %>
 		</h3>
 		<div class="line-content">
 			<span class="header-line">Contract Id :</span>
@@ -37,7 +37,7 @@
 			<span class="content-line" style="color: red;"><%= @purchase.total_amount - (@total_received_amount + @total_adjustable_amount) %> NTD.</span>
 		</div>
 	</div>
-</div>
+	<div class="info-receipts">
 		<table class="table main-list">
 	  <thead>
 	    <tr class="sort-header">
@@ -71,6 +71,7 @@
 			<% end %>
 	  </tbody>
 	 </table>
+	</div>
 	<div class="info-contract-buttons">
 		<div class="line-content button">
 		<% if @purchase.total_amount > (@total_received_amount + @total_adjustable_amount) %>
@@ -79,3 +80,4 @@
 			<a class="btn" href="<%= see_contract_admin_client_management_path(@contract.id) %>">Back to Contract</a>
 		</div>
 	</div>
+</div>

app/views/admin/client_managements/see_contract.html.erb

@@ -108,8 +108,10 @@
 	 	<% if !@contract.other.nil? || @contract.other_cost > 0 %>
 	 		<div class="line-content qt">
 					<span class="header-line">
-						Other Requirements : <br>
+						Other Requirements
+						<div class="requirement-text">
 							<%= nl2br(@contract.other) %>
+						</div>
 					</span>
 					<span class="content-line"><%= @contract.other_cost %></span>
 			</div>

app/views/client_managements/_user_site.html.erb

@@ -5,13 +5,13 @@
   	<span class="regdate-server"><i class="fa fa-calendar" aria-hidden="true"></i></i><%= user_site.created_at.strftime("%d %B %Y") %></span>
 	</div>
 	<% if !user_site.site_confirmed %>
-		<span class="status-server offline"><%= t("registered_sites.site_inactive") %></span><br />
+		<span class="status-server offline"><%= t("registered_sites.site_inactive") %></span>
 		<%= t("registered_sites.email_not_confirmed") %> 
 	<% elsif !user_site.access_granted %>
-		<span class="status-server offline"><%= t("registered_sites.site_inactive") %></span><br />
+		<span class="status-server offline"><%= t("registered_sites.site_inactive") %></span>
 		<%= t("registered_sites.site_permission_revoked") %>
 	<% else %>
-		<span class="status-server online"><%= t("registered_sites.site_active") %></span><br />
+		<span class="status-server online"><%= t("registered_sites.site_active") %></span>
 	<% end %>
 	<span class="action-server">
   	<a href="/cpanel/site/<%= user_site.uid %>" class="btn btn-info">Manage</a>

app/views/client_managements/addnewsite.html.erb

@@ -37,12 +37,12 @@
             <%= f.select :site_id, @user_sites, {:prompt => "------Select or Create------"}, {:class => "form-control select-site"} %>
             <div class="box-check-host" id="maintenance-box">
               <div class="line-check-host">
-                <%= f.label :maintenance, "Renew my maintenance" %>
                 <%= f.check_box :maintenance %>
+                <%= f.label :maintenance, "Renew my maintenance" %>
               </div>
               <div class="line-check-host">
-                <%= f.label :maintenance_years, "Year(s): " %>
-                <%= f.select :maintenance_years, options_for_select((1..5).collect{|i|[i,i]}), :class=>"form-control" %>
+                <%= f.label :maintenance_years, "Year(s): ", :class=>"left" %>
+                <%= f.select :maintenance_years, options_for_select((1..5).collect{|i|[i,i]}),{},  {class: "form-control left"} %>
               </div>
             </div>
             <div class="box-check-host" id="new-site-box">

app/views/client_managements/see_contract.html.erb

@@ -103,8 +103,10 @@
 		<% if !@contract.other.nil? || @contract.other_cost > 0 %>
 	 		<div class="line-contract qt">
 					<span class="header-detail">
-						Other Requirements : <br>
+						Other Requirements
+						<div class="requirement-text">
 							<%= nl2br(@contract.other) %>
+						</div>
 					</span>
 					<span class="content-detail"><%= @contract.other_cost %></span>
 			</div>