m

haessr · Sep 23, 2020 · d2d6e9d · d2d6e9d
1 parent edd9475
commit d2d6e9d
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 13 deletions.
diff --git a/app/views/orders/show.html.erb b/app/views/orders/show.html.erb
@@ -30,11 +30,22 @@
   </div>
   <div>
     <div class="mb-4 mt-2">
+
       <h4>Shipping status</h4>
-      <div class="progress mt-3">
-        <div class="progress-bar" role="progressbar" style="width: 25%; background-color: #F38181" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">Request sent</div>
+      <% if @order.status == "pending" %>
+        <div class="progress mt-3">
+          <div class="progress-bar" role="progressbar" style="width: 25%; background-color: #ADC4F8" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">Request sent</div>
         </div>
-      </div>
+      <% elsif @order.status == "completed" %>
+        <div class="progress mt-3">
+          <div class="progress-bar" role="progressbar" style="width: 80%; background-color: #9ED4A3" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100">The product is on it´s way </div>
+        </div>
+      <% else %>
+        <div class="progress mt-3">
+          <div class="progress-bar" role="progressbar" style="width: 100%; background-color: #F38181" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100">The product was cancelled, no shipping available </div>
+        </div>
+      <% end %>
+
       <br>
     </div>
     <h4>Your order status:

diff --git a/app/views/payments/new.html.erb b/app/views/payments/new.html.erb
@@ -1,12 +1,20 @@
-<div class="container">
-  <div class="row py-4">
-    <div class="col-md-3">
-      <%= cl_image_tag @order.product.photos.first.key, aspect_ratio: 1.1, quality: 100, crop: :fill, gravity: :center, class: "d-block" %>
+
+<br>
+<div data-controller="product">
+  <div class="container">
+    <div class="mb-3 text-decoration-none">
+      <%= link_to "← Back", :back %>
     </div>
-    <div class="col">
-      <h1>Checkout summary</h1>
+    <div class="card mt-2" style='height:200;'>
+      <div class="card" style="border-radius: 15px; height:350px;" >
+        <%= cl_image_tag @order.product.photos.first.key, aspect_ratio: 1.1, quality: 100, crop: :fill, gravity: :center, class: "d-block" %>
+      </div>
+    </div>
+        <div class="container mb-4">
+          <br>
+          <h1>Checkout summary</h1>
       <p>Purchase of <strong><%= @order.product.title %></strong> for <strong><%= humanized_money_with_symbol @order.price %></strong></p>
-      <button id="pay" class="btn btn-primary">Pay</button>
+      <button id="pay" class="btn btn-handers">Pay</button>
       <!-- # Commented for the lecture, remove comments.-->
       <script src="https://js.stripe.com/v3/"></script>
       <script>
@@ -17,7 +25,14 @@
             sessionId: '<%= @order.checkout_session_id %>'
           });
         });
-      </script> 
-    </div>
+      </script>
+        <br>
+
+
+
   </div>
-</div>
+</div>
+
+
+
+