From 72ea9f09adc31ec54338718f5f4878fef4e52fca Mon Sep 17 00:00:00 2001
From: "fariz.tumbuan" <13515050@std.stei.itb.ac.id>
Date: Sat, 7 Oct 2017 22:50:46 +0800
Subject: [PATCH] Memperbaiki tata letak elemen: history, complete order
---
css/history.css | 21 +++++++++++++--
css/order.css | 28 ++++++++++++++++++--
history/driver_history.php | 27 +++++++++++--------
history/hide_history.js | 2 +-
history/transaction_history.php | 38 ++++++++++++++------------
order/complete_order.php | 47 ++++++++++++++-------------------
order/select_driver.php | 4 +--
7 files changed, 105 insertions(+), 62 deletions(-)
diff --git a/css/history.css b/css/history.css
index d3c75758..bd93167d 100755
--- a/css/history.css
+++ b/css/history.css
@@ -76,11 +76,11 @@ img.history_pict {
}
button.hide_hist_button {
+ margin-top: -7px;
margin: 0;
color: white;
background-color: red;
- font-size: 9px;
- margin-bottom: 45px;
+ font-size: 15px;
}
.checked {
@@ -99,4 +99,21 @@ ul#history_nav.nav_bar > li {
ul#history_nav {
margin-bottom: 7px;
+}
+
+div.left_data {
+ width: 75%;
+ float: left;
+ margin-bottom: 30px;
+}
+
+div.right_data {
+
+ width: 25%;
+ float: right;
+ position: relative;
+}
+
+td.img_col {
+ vertical-align: top;
}
\ No newline at end of file
diff --git a/css/order.css b/css/order.css
index 93f72436..9a30b6ca 100755
--- a/css/order.css
+++ b/css/order.css
@@ -87,6 +87,12 @@ div.step_name {
float: left;
}
+.content div.rating_bar {
+ display: inline-block;
+ width: 60%;
+ height: 45px;
+}
+
.content input[type=text] {
width: 63%;
height: 20px;
@@ -179,7 +185,18 @@ table.driver_table tr td.driver_column {
}
table.driver_table p.driver_username {
- font-size: 20px;
+ font-size: 25px;
+ font-weight: bold;
+}
+
+table.driver_table p > span {
+ color: orange;
+ font-weight: bold;
+}
+
+table.driver_table p.driver_username {`
+ font-size: 25px;
+ font-weight: bold;
}
div.choose_driver {
@@ -202,8 +219,10 @@ div#driver_profile p {
margin: 0;
}
-div#complete_order {
+div#complete_order.content {
text-align: center;
+ height: inherit;
+ overflow-y: scroll;
}
div#left_complete {
@@ -217,3 +236,8 @@ div#right_complete {
width: 60%;
float: right;
}
+
+#submit_cmplt_ordr {
+ overflow-x: hidden;
+ height: inherit;
+}
\ No newline at end of file
diff --git a/history/driver_history.php b/history/driver_history.php
index 2d757f5f..5a7dc72a 100644
--- a/history/driver_history.php
+++ b/history/driver_history.php
@@ -76,20 +76,25 @@
echo
"<tr>
- <td>
+ <td class='img_col'>
<img class='history_pict' src='../profile/getProfilePict.php?id=".$row['cust_id']."'>
- <button class='hide_hist_button' type='button' value='hide' onclick='hide_row(this)'>Hide</button>
</td>
<td class='order_data'>
- <p class='history_date' id='row".$i."'></p>
- <script>
- document.getElementById('row".$i."').innerHTML=format_date(order_date);
- </script>
- <p class='history_username'>".$driver_name."</p>
- <p class='history_loc'>".$row['pick_city']." - ".$row['dest_city']."</p>
- <p class='history_rating'>gave <span class='yellow_score'>  ".$given_score." </span> stars for this order</p>
- <p class='history_comment'>and left comment:</p>
- <p class='history_comment' style='margin-left: 30px;'>".$row['comment']."</p>
+ <div class='left_data'>
+ <p class='history_date' id='row".$i."'></p>
+ <script>
+ document.getElementById('row".$i."').innerHTML=format_date(order_date);
+ </script>
+ <p class='history_username'>".$driver_name."</p>
+ <p class='history_loc'>".$row['pick_city']." - ".$row['dest_city']."</p>
+ <p class='history_rating'>gave <span class='yellow_score'>  ".$given_score." </span> stars for this order</p>
+ <p class='history_comment'>and left comment:</p>
+ <p class='history_comment' style='margin-left: 30px;'>".$row['comment']."</p>
+ </div>
+
+ <div class'right_data'>
+ <button class='hide_hist_button' type='button' value='hide' onclick='hide_row(this)'>Hide</button>
+ </div>
</td>
</tr>";
diff --git a/history/hide_history.js b/history/hide_history.js
index 13ad2f0e..bfedcc6b 100644
--- a/history/hide_history.js
+++ b/history/hide_history.js
@@ -1,4 +1,4 @@
function hide_row(o) {
- var p = o.parentNode.parentNode;
+ var p = o.parentNode.parentNode.parentNode;
p.parentNode.removeChild(p);
}
\ No newline at end of file
diff --git a/history/transaction_history.php b/history/transaction_history.php
index ae701dd8..7774dd99 100644
--- a/history/transaction_history.php
+++ b/history/transaction_history.php
@@ -75,27 +75,31 @@
echo
"<tr>
- <td>
+ <td class='img_col'>
<img class='history_pict' src='../profile/getProfilePict.php?id=".$row['driver_id']."'>
- <button class='hide_hist_button' type='button' value='hide' onclick='hide_row(this)'>Hide</button>
</td>
<td class='order_data'>
- <p class='history_date' id='row".$i."'></p>
- <script>
- document.getElementById('row".$i."').innerHTML=format_date(order_date);
- </script>
- <p class='history_username'>".$driver_name."</p>
- <p class='history_loc'>".$row['pick_city']." - ".$row['dest_city']."</p>
- <p class='history_rating'>You rated: ";
-
- for ($i = 0; $i < $row['score']; $i++) {
- echo "<span style='color:orange'>★</span>";
- }
+ <div class='left_data'>
+ <p class='history_date' id='row".$i."'></p>
+ <script>
+ document.getElementById('row".$i."').innerHTML=format_date(order_date);
+ </script>
+ <p class='history_username'>".$driver_name."</p>
+ <p class='history_loc'>".$row['pick_city']." - ".$row['dest_city']."</p>
+ <p class='history_rating'>You rated: ";
+
+ for ($i = 0; $i < $row['score']; $i++) {
+ echo "<span style='color:orange'>★</span>";
+ }
- echo
- "</p>
- <p class='history_comment'>You commented:</p>
- <p class='history_comment' style='margin-left: 30px;'>".$row['comment']."</p>
+ echo
+ "</p>
+ <p class='history_comment'>You commented:</p>
+ <p class='history_comment' style='margin-left: 30px;'>".$row['comment']."</p>
+ </div>
+ <div class'right_data'>
+ <button class='hide_hist_button' type='button' value='hide' onclick='hide_row(this)'>Hide</button>
+ </div>
</td>
</tr>";
diff --git a/order/complete_order.php b/order/complete_order.php
index a51cce85..a2e7d268 100644
--- a/order/complete_order.php
+++ b/order/complete_order.php
@@ -80,37 +80,30 @@
<form id="submit_cmplt_ordr" method="post" action="order_handler.php">
<div class="content" id="complete_order">
<h2>How was it?</h2>
- <div id="left_complete">
- <div id="driver_profile">
- <?php echo "
- <img class='driver_pict' src='../profile/getProfilePict.php?id=".$seldrv."'>"
- ;?>
- <p> @<?php echo $driver_username;?></p>
- <p> <?php echo $driver_name;?></p>
- </div>
- <div class="rating_bar" style="background-color: rgba(0,255,0,0.2);">
- <span class="star" id="1-star" onclick="rate1()">★</span>
- <span class="star" id="2-star" onclick="rate2()">★</span>
- <span class="star" id="3-star" onclick="rate3()">★</span>
- <span class="star" id="4-star" onclick="rate4()">★</span>
- <span class="star" id="5-star" onclick="rate5()">★</span>
- <input type="hidden" name="rating" id="rating">
- </div>
+ <div id="driver_profile">
+ <?php echo "
+ <img class='driver_pict' src='../profile/getProfilePict.php?id=".$seldrv."'>"
+ ;?>
+ <p> @<?php echo $driver_username;?></p>
+ <p> <?php echo $driver_name;?></p>
</div>
+ <div class="rating_bar" style="background-color: rgba(0,255,0,0.2);">
+ <span class="star" id="1-star" onclick="rate1()">★</span>
+ <span class="star" id="2-star" onclick="rate2()">★</span>
+ <span class="star" id="3-star" onclick="rate3()">★</span>
+ <span class="star" id="4-star" onclick="rate4()">★</span>
+ <span class="star" id="5-star" onclick="rate5()">★</span>
+ <input type="hidden" name="rating" id="rating">
+ </div>
+ <textarea id="comment" name="comment" form="submit_cmplt_ordr" rows="8" cols="35" placeholder="Your comment..."></textarea>
- <div id="right_complete">
- <div>
- <textarea id="comment" name="comment" form="submit_cmplt_ordr" rows="8" cols="27" placeholder="Your comment...">
- </textarea>
- </div>
+ <input type="hidden" name="picking_point" value=<?php echo $ppoint ?>>
+ <input type="hidden" name="destination" value=<?php echo $dest ?>>
+ <input type="hidden" name="selected_driver" value=<?php echo $seldrv ?>>
+ <input type="hidden" name="customer" value=<?php echo $user_id ?>>
- <input type="hidden" name="picking_point" value=<?php echo $ppoint ?>>
- <input type="hidden" name="destination" value=<?php echo $dest ?>>
- <input type="hidden" name="selected_driver" value=<?php echo $seldrv ?>>
- <input type="hidden" name="customer" value=<?php echo $user_id ?>>
+ <input class="button green" type="submit" name="submit" value="Complete Order">
- <input class="button green" type="submit" name="submit" value="Complete Order">
- </div>
</div>
</form>
<?php mysqli_close($con); ?>
diff --git a/order/select_driver.php b/order/select_driver.php
index 85e7d94b..c4a92141 100644
--- a/order/select_driver.php
+++ b/order/select_driver.php
@@ -51,7 +51,7 @@
</td>
<td class='driver_column'>
<p class='driver_username'>".$driver_name."</p>
- <p class='driver_rating'>★".$driver_rating." (".$driver_votes." votes)</p>
+ <p class='driver_rating'><span style='color: orange'>★".$driver_rating."</span> (".$driver_votes." votes)</p>
<div class='choose_driver green' onclick='chooseDriver(".$driver_id.")'>
I CHOOSE YOU
</div>
@@ -98,7 +98,7 @@
</td>
<td class='driver_column'>
<p class='driver_username'>".$driver_name."</p>
- <p class='driver_rating'>★".$driver_rating." (".$driver_votes." votes)</p>
+ <p class='driver_rating'><span>★".$driver_rating."</span> (".$driver_votes." votes)</p>
<div class='choose_driver green' onclick='chooseDriver(".$driver_id.")'>
I CHOOSE YOU
</div>
--
GitLab