From 8e2f0fe43e671deb5d8d35f25112bebd20e77a54 Mon Sep 17 00:00:00 2001
From: Nathan Chapman <contact@nathanjchapman.com>
Date: Sat, 21 Jan 2023 18:53:07 -0700
Subject: [PATCH] Remove canceled button on when order status is canceled

---
 .../templates/dashboard/order/detail.html     |  2 +-
 dashboard/templates/dashboard/order/list.html | 24 ++++++++++---------
 static/styles/dashboard.css                   | 11 +++++++++
 3 files changed, 25 insertions(+), 12 deletions(-)

diff --git a/dashboard/templates/dashboard/order/detail.html b/dashboard/templates/dashboard/order/detail.html
index acd1667..acfe5eb 100644
--- a/dashboard/templates/dashboard/order/detail.html
+++ b/dashboard/templates/dashboard/order/detail.html
@@ -10,7 +10,7 @@
     </p>
     <header class="object-header">
         <h1><img src="{% static 'images/box.png' %}"> Order No. {{order.pk}}</h1>
-        {% if perms.core.cancel_order %}
+        {% if perms.core.cancel_order and order.status != 'canceled' %}
         <a class="btn btn-warning" href="{% url 'dashboard:order-cancel' order.pk %}">Cancel order</a>
         {% endif %}
     </header>
diff --git a/dashboard/templates/dashboard/order/list.html b/dashboard/templates/dashboard/order/list.html
index 1f5c0e9..b9bd21d 100644
--- a/dashboard/templates/dashboard/order/list.html
+++ b/dashboard/templates/dashboard/order/list.html
@@ -17,19 +17,21 @@
             <tfoot>
                 <tr>
                     <td>
-                    {% if page_obj.has_previous %}
-                        <a href="?page=1">&laquo; first</a>
-                        <a href="?page={{ page_obj.previous_page_number }}">previous</a>
-                    {% endif %}
+                        <div class="pagination">
+                        {% if page_obj.has_previous %}
+                            <a href="?page=1">&laquo; first</a>
+                            <a href="?page={{ page_obj.previous_page_number }}">‹ previous</a>
+                        {% endif %}
 
-                        <span class="current">
-                            Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}.
-                        </span>
+                            <span class="current">
+                                Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}.
+                            </span>
 
-                    {% if page_obj.has_next %}
-                        <a href="?page={{ page_obj.next_page_number }}">next</a>
-                        <a href="?page={{ page_obj.paginator.num_pages }}">last &raquo;</a>
-                    {% endif %}
+                        {% if page_obj.has_next %}
+                            <a href="?page={{ page_obj.next_page_number }}">next ›</a>
+                            <a href="?page={{ page_obj.paginator.num_pages }}">last &raquo;</a>
+                        {% endif %}
+                        </div>
                     </td>
                 </tr>
             </tfoot>
diff --git a/static/styles/dashboard.css b/static/styles/dashboard.css
index 4e0a976..5b931c5 100644
--- a/static/styles/dashboard.css
+++ b/static/styles/dashboard.css
@@ -460,6 +460,7 @@ main > article > header {
 }
 
 .product-figure img {
+    background-color: white;
     max-height: 6rem;
     max-width: 6rem;
     border: var(--default-border);
@@ -617,6 +618,16 @@ main > article > header {
 }
 
 
+/* ==========================================================================
+   Pagination
+   ========================================================================== */
+
+.pagination {
+    display: flex;
+    gap: 1rem;
+}
+
+
 /* ==========================================================================
    Utils
    ========================================================================== */