checkout.html 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. {% extends "base.html" %}
  2. {% block content %}
  3. <main class="x xdc md-xdr md-xw">
  4. <header class="w100 copy-h tac">
  5. <h1>Cart</h1>
  6. </header>
  7. {% if not data.checkout_items %}
  8. <section class="w100 pt4-25 pr0-85 pb4-25 pl0-85 copy">
  9. <div class="mw-680px mla mra">
  10. <p>Your cart is empty.</p>
  11. </div>
  12. </section>
  13. {% else %}
  14. <section class="checkout-table-header w100 pt4-25">
  15. {% for item in data.checkout_items %}
  16. {% include "partials/checkout-item.html" %}
  17. {% endfor %}
  18. </section>
  19. {% if data.show_checkout %}
  20. <form class="checkout-shipping-info w100 pt4-25" method="POST">
  21. <input type="hidden" id="order_id" name="order_id" value="{{ cart.meta.order_id }}">
  22. <input type="hidden" id="weight" name="weight" value="{{ cart.meta.total_weight }}">
  23. <section class="w100 bdb-dark-red pr0-85 pb4-25 pl0-85">
  24. {% include "partials/form-subtotal.html" %}
  25. </section>
  26. <section class="w100 pt4-25 pr0-85 pb4-25 pl0-85 bdb-dark-red">
  27. <div class="mw-680px mla mra">
  28. <h4 class="ff-sans fs-huge ttu pb4-75">Shipping Information</h4>
  29. {% include "partials/form-shipping-info.html" %}
  30. </div>
  31. </section>
  32. <section class="w100 pt4-25 pr0-85 pb5-5 pl0-85 bdb-dark-red">
  33. {% include "partials/form-total.html" %}
  34. </section>
  35. <section class="x xdr xw xjsb xaic w100 pt4-25 pr0-85 pb4-25 pl0-85 bdb-gray">
  36. <div class="mw-680px mla mra">
  37. <div class="w100 x xdc tn-xdr xjsb sm-xaic pt1 pb1">
  38. <h4 class="ff-sans fs-large sm-fs-huge ttu pb2">Checkout</h4>
  39. {% include "partials/form-payment-options.html" %}
  40. </div>
  41. <div class="copy-checkout-disclaimer w100 pt3-5">
  42. {% for block in data.doc.blocks %}
  43. {% if block.type == 'text' %}
  44. {{ block.value | md | safe }}
  45. {% endif %}
  46. {% endfor %}
  47. </div>
  48. </div>
  49. </section>
  50. <input type="hidden" name="csrftoken" value="{{ request.scope.csrftoken() }}">
  51. </form>
  52. {% else %}
  53. <form class="w100 pt4-25 pr0-85 pb4-25 pl0-85 bdb-dark-red" action="/cart/clear" method="POST">
  54. <div class="mw-680px mla mra">
  55. <h4 class="ff-sans fs-large sm-fs-huge pb2">Do you want to clear you cart?</h4>
  56. <button type="submit" class="fs-small btn-checkout-remove bd-deep-brown fgc-terre bgc-gaow">Clear Cart</button>
  57. <input type="hidden" name="csrftoken" value="{{ request.scope.csrftoken() }}">
  58. </div>
  59. </form>
  60. {% endif %}
  61. <div class="checkout-empty-message dn w100 bdb-dark-red pt4-25 pr0-85 pb4-25 pl0-85 copy">
  62. <div class="mw-680px mla mra">
  63. <p>Your cart is empty.</p>
  64. </div>
  65. </div>
  66. {% endif %}
  67. <div id="loader">
  68. <div class="spinner"></div>
  69. </div>
  70. </main>
  71. {% with hide_menu=True, custom_border=not data.checkout_items %}
  72. {% include "partials/footer.html" %}
  73. {% endwith %}
  74. {% endblock %}