Skip to content

Commit

Permalink
Add some HTML formatting and comments
Browse files Browse the repository at this point in the history
  • Loading branch information
Edb83 committed Jun 3, 2021
1 parent 83781c9 commit 44c6536
Show file tree
Hide file tree
Showing 9 changed files with 91 additions and 73 deletions.
18 changes: 14 additions & 4 deletions cart/templates/cart/cart.html
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@ <h2 class="text-center mb-5">Cart</h2>
<div class="cart-contents border-accent-primary">
{% for item in cart_items %}
<div class="row pb-5">

<!-- SVG -->
<div class="col-2 align-self-center text-center">
<svg xmlns="http://www.w3.org/2000/svg" width="25px" viewBox="0 0 154 339">
Expand All @@ -61,6 +62,7 @@ <h2 class="text-center mb-5">Cart</h2>
{{ item.product.name }} <span class="text-muted">({{ item.nic.strength }}-{{ item.size.label }})</span>
</div>
</div>

<!-- Remove from cart -->
<div class="col text-center">
<a class="remove-item text-danger" id="remove_{{ item.item_id }}">
Expand All @@ -71,10 +73,12 @@ <h2 class="text-center mb-5">Cart</h2>
</div>
</div>
<div class="row text-center align-items-center flex-nowrap overflow-hidden">

<!-- Price per unit -->
<div class="col text-left">
£{{ item.size.price }}
</div>

<!-- Quantity input -->
<div class="col">
<form action="{% url 'update_cart' item.item_id %}" method="POST" class="form update-form">
Expand Down Expand Up @@ -120,7 +124,8 @@ <h2 class="text-center mb-5">Cart</h2>
</div>

<div class="cart-summary-container mt-5 text-right">


<!-- Cart total -->
<div class="row">
<div class="col-auto ml-auto">
Cart Total:
Expand All @@ -130,6 +135,7 @@ <h2 class="text-center mb-5">Cart</h2>
</div>
</div>

<!-- Points used and discount -->
{% if discount_applied %}
<div class="row text-secondary">
<div class="col-auto ml-auto">
Expand Down Expand Up @@ -162,6 +168,7 @@ <h2 class="text-center mb-5">Cart</h2>
</div>
{% endif %}

<!-- Delivery -->
<div class="row">
<div class="col-auto ml-auto">
Delivery:
Expand All @@ -170,7 +177,8 @@ <h2 class="text-center mb-5">Cart</h2>
<strong>£{{ delivery|floatformat:2 }}</strong>
</div>
</div>


<!-- Grand total -->
<div class="row mt-1">
<div class="col-auto ml-auto">
<h5><strong>Grand Total:</strong></h5>
Expand All @@ -181,7 +189,8 @@ <h5><strong>£{{ grand_total|floatformat:2 }}</strong></h5>
</div>

</div>


<!-- Points and free delivery delta -->
<div class="row pt-5">
<div class="col-12 col-md-6 offset-md-6">
{% if not user.is_authenticated and total >= 1 %}
Expand Down Expand Up @@ -216,6 +225,7 @@ <h5><strong>£{{ grand_total|floatformat:2 }}</strong></h5>
</div>
</div>
</div>

<!-- If no cart items -->
{% else %}
<p class="text-center"><strong>There's nothing here!</strong></p>
Expand All @@ -230,8 +240,8 @@ <h5><strong>£{{ grand_total|floatformat:2 }}</strong></h5>
{% endblock %}

{% block extra_js %}

{{ block.super }}
<script src="{% static 'js/quantity-input.js' %}"></script>
<script src="{% static 'cart/js/remove-item.js' %}"></script>

{% endblock %}
54 changes: 24 additions & 30 deletions checkout/templates/checkout/checkout_success.html
Original file line number Diff line number Diff line change
Expand Up @@ -102,37 +102,35 @@ <h6><strong>£{{ order.grand_total|floatformat:2 }}</strong></h6>
<!-- Button to repeat order -->
<div class="row mt-5">
<div class="col text-right order-summary-buttons-container">
{% if request.user.is_authenticated %}
<a href="{% url 'profile' %}" class="btn btn-outline-dark">
{% if request.user.is_authenticated %}
<a href="{% url 'profile' %}" class="btn btn-outline-dark">
<span class="icon">
<i class="fas fa-user"></i>
</span>
Dashboard
</a>
{% if not on_checkout_success_page %}
<a href="{% url 'replicate_cart' order.order_number %}" class="btn btn-dark">
<span class="icon">
<i class="fas fa-user"></i>
<i class="fas fa-shopping-cart"></i>
</span>
Dashboard
</a>
{% if not on_checkout_success_page %}
<a href="{% url 'replicate_cart' order.order_number %}" class="btn btn-dark">
<span class="icon">
<i class="fas fa-shopping-cart"></i>
</span>
Order again
</a>
{% endif %}

{% else %}
<a href="{% url 'products' %}" class="btn btn-outline-dark mt-5">
<span class="icon">
<i class="fas fa-chevron-left"></i>
</span>
Juices
Order again
</a>
{% endif %}
</div>
</div>



{% else %}
<a href="{% url 'products' %}" class="btn btn-outline-dark mt-5">
<span class="icon">
<i class="fas fa-chevron-left"></i>
</span>
Juices
</a>
{% endif %}
</div>
</div>
</section>
</div>

<div class="col-12 col-lg-6 mb-5">
<section class="order-details-container">
<div class="border-accent-dark">
Expand All @@ -154,6 +152,7 @@ <h5>Order Details</h5>
</div>
</div>
</div>

<div class="receipt-details mt-4">
<h5>Delivery Details</h5>
<div class="row">
Expand Down Expand Up @@ -188,14 +187,9 @@ <h5>Delivery Details</h5>
</div>
</div>
</section>

</div>
</div>





</div>

{% endblock %}
{% endblock %}
4 changes: 2 additions & 2 deletions home/templates/home/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,7 @@ <h2 class="mb-3 text-center heading-accent-light">Brands</h2>
</p>
</div>
</div>

<!-- Mobile horizontal pills display -->
<div class="row d-block d-md-none px-3">
<ul class="nav nav-pills mb-3 flex-nowrap justify-content-center text-center" id="h-pills-tab" role="tablist">
Expand Down Expand Up @@ -143,7 +144,6 @@ <h2 class="mb-5 text-center heading-accent-dark">Flavour Profiles</h2>

{% block extra_js %}

{{ block.super }}
{{ block.super }}
<script src="{% static 'home/js/hero-blur.js' %}"></script>

{% endblock %}
4 changes: 4 additions & 0 deletions products/templates/products/add-product.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ <h2 class="text-center mb-4">Add New Juice</h2>

<div class="row pb-5">
<div class="col-12 col-lg-7">

<!-- Add Juice form -->
<form method="POST" action="{% url 'add_product' %}" class="form mb-2" enctype="multipart/form-data">
{% csrf_token %}
{{ form | crispy }}
Expand All @@ -25,6 +27,7 @@ <h2 class="text-center mb-4">Add New Juice</h2>

<div class="product-img-container">

<!-- Big bottle -->
<div class="add-product-svg-container mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 154 339">
{% include 'products/includes/product-svg.html' %}
Expand All @@ -47,6 +50,7 @@ <h3 class="h5 card-title">?</h3>
{% endblock %}

{% block extra_js %}

{{ block.super }}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jscolor/2.4.5/jscolor.min.js"></script>
<script src="{% static 'products/js/change-color.js' %}"></script>
Expand Down
7 changes: 6 additions & 1 deletion products/templates/products/edit-product.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,8 @@ <h2 class="text-center mb4">Edit Juice</h2>

<div class="row pb-5">
<div class="col-12 col-md-7">

<!-- Update Juice form -->
<form method="POST" action="{% url 'edit_product' product.id %}" class="form mb-2" enctype="multipart/form-data">
{% csrf_token %}
{{ form | crispy }}
Expand All @@ -22,7 +24,8 @@ <h2 class="text-center mb4">Edit Juice</h2>
</div>

<div class="d-none d-md-block col-lg-4 mx-auto card card-products text-center edit-product-image-container">


<!-- Big bottle -->
<div class="product-img-container">
<div class="add-product-svg-container mx-auto">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 154 339">
Expand Down Expand Up @@ -59,6 +62,8 @@ <h5 class="card-title">{{ product.name }}</h5>
{% endblock %}

{% block extra_js %}

{{ block.super }}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jscolor/2.4.5/jscolor.min.js"></script>
<script src="{% static 'products/js/star-display.js' %}"></script>
<script src="{% static 'products/js/change-color.js' %}"></script>
Expand Down
5 changes: 2 additions & 3 deletions products/templates/products/favourites.html
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,6 @@ <h5 class="card-title">{{ product.name }}</h5>
{% block extra_js %}

{{ block.super }}
<script src="{% static 'products/js/star-display.js' %}"></script>
<script src="{% static 'products/js/favourites-toggle.js' %}"></script>

<script src="{% static 'products/js/star-display.js' %}"></script>
<script src="{% static 'products/js/favourites-toggle.js' %}"></script>
{% endblock %}
21 changes: 14 additions & 7 deletions products/templates/products/product-detail.html
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,8 @@ <h2 class="card-title">{{ product.name }}</h2>

<section class="container product-options my-5 pb-5 border-accent-primary">
<div class="row">

<!-- Nic info -->
<div class="d-none d-md-block col-md-4 pl-5 my-auto">
<div class="card-nic-info">
<h5>
Expand All @@ -70,6 +72,8 @@ <h5>
</div>
</div>
<div class="col-sm-12 col-md-8">

<!-- Product choice form -->
<form class="form my-3 text-center" action="{% url 'add_to_cart' product.id %}" method="POST">
{% csrf_token %}
<div class="form-row">
Expand Down Expand Up @@ -190,9 +194,12 @@ <h2 class="text-center">Reviews</h2>
<div class="card-header border-accent-primary">
<h5 class="card-title">{{ review.title }}</h5>
<div class="row">

<!-- Stars -->
<div class="col-7">
<div class="product-stars" data-value="{{ review.rating }}"></div>
</div>

<div class="col-auto ml-auto d-flex">
<!-- User/admin edit button -->
{% if review.user == request.user or request.user.is_superuser %}
Expand Down Expand Up @@ -247,15 +254,16 @@ <h5 class="modal-title" id="reviewDeleteModalLabel-{{ forloop.counter }}">Confir
</div>

{% empty %}
<div class="col-12 col-md-8 mx-auto">
<div class="card card-product-review my-5 shadow">
<div class="card-header border-accent-primary">
<h5 class="card-title text-center">This is where the reviews should be!</h5>
<div class="col-12 col-md-8 mx-auto">
<div class="card card-product-review my-5 shadow">
<div class="card-header border-accent-primary">
<h5 class="card-title text-center">This is where the reviews should be!</h5>
</div>
</div>
</div>
</div>
{% endfor %}
</div>

</div>

</section>
Expand All @@ -264,10 +272,9 @@ <h5 class="card-title text-center">This is where the reviews should be!</h5>

{% block extra_js %}

{{ block.super }}
{{ block.super }}
<script src="{% static 'js/quantity-input.js' %}"></script>
<script src="{% static 'products/js/favourites-toggle.js' %}"></script>
<script src="{% static 'products/js/star-display.js' %}"></script>
<script src="{% static 'products/js/delete-modal.js' %}"></script>

{% endblock %}
Loading

0 comments on commit 44c6536

Please sign in to comment.