From a7c14f4a0614e57d3723449bc6dee0e933e6011c Mon Sep 17 00:00:00 2001
From: Ramon Gutierrez <arcticzero@gmail.com>
Date: Tue, 30 Jan 2018 13:32:13 +0800
Subject: [PATCH] Change rider form to vertical layout

---
 templates/rider/form.html.twig | 43 ++++++++++++++--------------------
 1 file changed, 18 insertions(+), 25 deletions(-)

diff --git a/templates/rider/form.html.twig b/templates/rider/form.html.twig
index ce95687b..2d236c56 100644
--- a/templates/rider/form.html.twig
+++ b/templates/rider/form.html.twig
@@ -35,33 +35,25 @@
                     <form id="row-form" class="m-form m-form--fit m-form--label-align-right m-form--group-seperator-dashed" method="post" action="{{ mode == 'update' ? url('rider_update_submit', {'id': obj.getId()}) : url('rider_create_submit') }}">
 						<div class="m-portlet__body">
 							<div class="form-group m-form__group row no-border">
-								<label class="col-lg-2 col-form-label" data-field="first_name">
-									First Name:
-								</label>
-								<div class="col-lg-4">
+								<div class="col-lg-6">
+									<label data-field="first_name">First Name:</label>
 									<input type="text" name="first_name" class="form-control m-input" value="{{ obj.getFirstName() }}">
 									<div class="form-control-feedback hide" data-field="first_name"></div>
 								</div>
-								<label class="col-lg-2 col-form-label" data-field="last_name">
-									Last Name:
-								</label>
-								<div class="col-lg-4">
+								<div class="col-lg-6">
+									<label data-field="last_name">Last Name:</label>
 									<input type="text" name="last_name" class="form-control m-input" value="{{ obj.getLastName() }}">
 									<div class="form-control-feedback hide" data-field="last_name"></div>
 								</div>
 							</div>
-							<div class="form-group m-form__group row">
-								<label class="col-lg-2 col-form-label" data-field="contact_no">
-									Contact Number:
-								</label>
-								<div class="col-lg-4">
+							<div class="form-group m-form__group row no-border">
+								<div class="col-lg-6">
+									<label data-field="contact_no">Contact Number:</label>
 									<input type="text" name="contact_no" class="form-control m-input" value="{{ obj.getContactNumber() }}">
 									<div class="form-control-feedback hide" data-field="contact_no"></div>
 								</div>
-								<label class="col-lg-2 col-form-label" data-field="hub">
-									Hub:
-								</label>
-								<div class="col-lg-4">
+								<div class="col-lg-6">
+									<label data-field="hub">Hub:</label>
 									<select class="form-control m-input" id="hub" name="hub">
 										<option value=""></option>
 										{% for hub in hubs %}
@@ -72,14 +64,14 @@
 								</div>
 							</div>
 							<div class="form-group m-form__group row">
-								<label class="col-lg-2 col-form-label" data-field="image_file">
-									{% if mode == 'update' %}
-										Replace Picture:
-									{% else %}
-										Picture:
-									{% endif %}
-								</label>
 								<div class="col-lg-6">
+									<label data-field="image_file">
+										{% if mode == 'update' %}
+											Replace Picture:
+										{% else %}
+											Picture:
+										{% endif %}
+									</label>
 									<div class="m-dropzone dropzone m-dropzone--primary" action="{{ url('rider_upload_image') }}" id="image-file">
 										<div class="m-dropzone__msg dz-message needsclick">
 											<h3 class="m-dropzone__msg-title">
@@ -96,7 +88,8 @@
 									<div class="form-control-feedback hide" data-field="image_file"></div>
 								</div>
 								{% if mode == 'update' %}
-									<div class="col-lg-4">
+									<div class="col-lg-6">
+										<label>&nbsp;</label>
 										<div class="portrait-box" style="background-image: url('{{ obj.getImageFile() ? '/uploads/' ~ obj.getImageFile() : '/assets/images/user.gif' }}');"></div>
 									</div>
 								{% endif %}