tidying up the cart detail page - still nowhere near good enough

5 files changed, 31 insertions, 39 deletions

diff --git a/alphabetlearning/payments/views.py b/alphabetlearning/payments/views.py
index f7ab583..cf77e5b 100644
--- a/alphabetlearning/payments/views.py
+++ b/alphabetlearning/payments/views.py
@@ -40,14 +40,15 @@ from .models import ShoppingCart
 stripe.api_key = settings.STRIPE_SECRET_KEY
 
 def create_line_items(resources):
-   price_objs = [r.price_obj.first() for r in resources]
-   stripe_price_ids = [p.stripe_price_id for p in price_objs]
-   return [{"quantity": 1, "price": s} for s in stripe_price_ids]
-   pass
+    price_objs = [r.price_obj.first() for r in resources]
+    stripe_price_ids = [p.stripe_price_id for p in price_objs]
+    return [{"quantity": 1, "price": s} for s in stripe_price_ids]
+    pass
+
 
 class CreateCheckoutSessionView(View):
     def post(self, request, *args, **kwargs):
-        #price = Price.objects.get(id=self.kwargs["pk"])
+        # price = Price.objects.get(id=self.kwargs["pk"])
         cart = ShoppingCart.objects.get(id=self.kwargs["pk"])
         resources = [i.resource for i in cart.items.all()]
         total = sum([r.price_obj.first().price for r in resources])
@@ -86,7 +87,9 @@ class ProductLandingPageView(TemplateView):
 def add_to_cart(request, resource_id):
     resource = get_object_or_404(Resource, id=resource_id)
     if not resource.price_obj.first():
-        return HttpResponseBadRequest(f"There is no price assigned to this resource. Please contact Alphabet Learning Support.")
+        return HttpResponseBadRequest(
+            f"There is no price assigned to this resource. Please contact Alphabet Learning Support."
+        )
     cart, created = ShoppingCart.objects.get_or_create(user=request.user)
     cart_item, created = CartItem.objects.get_or_create(cart=cart, resource=resource)
     # cart_item.quantity += 1
@@ -98,12 +101,8 @@ def add_to_cart(request, resource_id):
 def cart_detail(request):
     cart, created = ShoppingCart.objects.get_or_create(user=request.user)
     resources = [i.resource for i in cart.items.all()]
-    total = sum([r.price_obj.first().price for r in resources])
-    context = {
-            "cart": cart,
-            "resources": resources,
-            "total": total
-    }
+    total = sum([r.price_obj.first().price for r in resources]) / 1000
+    context = {"cart": cart, "resources": resources, "total": total}
     return render(request, "payments/cart_detail.html", context)
 
 
@@ -160,15 +159,13 @@ def stripe_webhook(request):
 
         # TODO add the transaction to our local history? Or just use Stripe?
 
-
         # TODO send an email to the customer
         send_mail(
-                "Thank you for your purchase",
-                "You have bought something nice - enjoy it",
-                settings.DEFAULT_FROM_EMAIL,
-                [customer_email],
-                fail_silently=False,
+            "Thank you for your purchase",
+            "You have bought something nice - enjoy it",
+            settings.DEFAULT_FROM_EMAIL,
+            [customer_email],
+            fail_silently=False,
         )
 
-
     return HttpResponse(status=200)
diff --git a/alphabetlearning/templates/base.html b/alphabetlearning/templates/base.html
index 1bb67d4..257a439 100644
--- a/alphabetlearning/templates/base.html
+++ b/alphabetlearning/templates/base.html
@@ -113,6 +113,7 @@
 
                         {% if request.user.shoppingcart %}
 
+                        <!- TODO - fix this, the logic should be different button if no cart ->
                         <div class="mx-2 gray-icon">
                             <a href="{% url "payments:cart_detail" %}" class="full-basket-button">
                                 <span class="fw-bold px-1">
diff --git a/alphabetlearning/templates/payments/cart_detail.html b/alphabetlearning/templates/payments/cart_detail.html
index 46117d1..641c9c5 100644
--- a/alphabetlearning/templates/payments/cart_detail.html
+++ b/alphabetlearning/templates/payments/cart_detail.html
@@ -7,7 +7,7 @@
     <p class="text-body-secondary">{% lorem %}</p>
     {% if cart %}
     <div class="row">
-        <div class="col-8 my-5 bg-secondary-subtle border border-1 rounded border-dark">
+        <div class="col-8 my-4">
             <div class="my-4 bg-white rounded">
     
                 <div>
diff --git a/alphabetlearning/templates/payments/cart_lineitem.html b/alphabetlearning/templates/payments/cart_lineitem.html
index 0ef8a97..79899df 100644
--- a/alphabetlearning/templates/payments/cart_lineitem.html
+++ b/alphabetlearning/templates/payments/cart_lineitem.html
@@ -1,17 +1,19 @@
 <div class="container my-2">
     <div class="col">
-        <div class="p-2 border border-1 border-success">
-            {{ item.resource.name }}
+        <div class="p-1 bg bg-success-subtle">
+            <p class="fs-3 text fw-bold">{{ item.resource.name }}</p>
         </div>
-        <div class="p-2 border border-1 border-success">
-            {{ item.resource.card_description }} 
-        </div>
-        <div class="d-flex flex-row border border-2 border-danger p-1">
+        <div class="d-flex flex-row p-1">
             {% for tn_url in item.resource.thumbnail_urls  %}
-            <div class="flex-shrink border border-2 border-alert p-1">
-                <img class="img-fluid rounded" src="{{ tn_url }}" alt="unknown"/> 
+            <div class="flex-shrink p-1">
+                <img class="img-thumbnail rounded w-50" src="{{ tn_url }}" alt="unknown"/>
             </div>
             {% endfor %}
         </div>
+        <div class="p-2">
+            <p>{{ item.resource.card_description }}</p>
+            <p><a class="btn btn-danger btn-sm fs-6 text" href="#">Remove from basket</a></p>
+        </div>
     </div>
 </div>
+<hr>
diff --git a/alphabetlearning/templates/payments/cart_sidepanel.html b/alphabetlearning/templates/payments/cart_sidepanel.html
index b788d24..b844495 100644
--- a/alphabetlearning/templates/payments/cart_sidepanel.html
+++ b/alphabetlearning/templates/payments/cart_sidepanel.html
@@ -3,16 +3,8 @@
        <div>
            <strong>Subtotal:</strong>
        </div> 
-       <div>
-          &#163;{{ cart_total }} 10.24
-       </div>
-    </div>
-    <div class="p-1 d-flex justify-content-between">
-       <div>
-           <strong>Shipping and handling:</strong>
-       </div> 
-       <div>
-           <p class="text-end">There is nothing to say here</p>
+       <div class="fw-bold">
+          &#163;{{ total|floatformat:2 }}
        </div>
     </div>
     <hr>
@@ -25,7 +17,7 @@
     <div class="d-grid gap-2 mx-auto col-11">
         <form action="{% url 'payments:create-checkout-session' cart.id %}" method="POST">
             {% csrf_token %}
-            <button class="btn btn-primary btn-lg">Checkout now</button>
+            <button class="btn btn-primary btn-lg w-100">Checkout now</button>
         </form>
     </div>
 </div>