From 85902f6777c565b3c79cf81653858bfaeba6bd2c Mon Sep 17 00:00:00 2001
From: abhisheks <abhisheks@consultbop.com>
Date: Fri, 3 Nov 2023 19:29:48 +0530
Subject: [PATCH] refactor: update product add to cart

---
 .../catalog/_partials/product-add-to-cart.tpl | 35 +++++++++++++++----
 1 file changed, 28 insertions(+), 7 deletions(-)

diff --git a/templates/catalog/_partials/product-add-to-cart.tpl b/templates/catalog/_partials/product-add-to-cart.tpl
index a86cef7..f12da72 100644
--- a/templates/catalog/_partials/product-add-to-cart.tpl
+++ b/templates/catalog/_partials/product-add-to-cart.tpl
@@ -22,14 +22,14 @@
  * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
  * International Registered Trademark & Property of PrestaShop SA
  *}
-<div class="product-add-to-cart">
+<div class="product-add-to-cart flex flex-col gap-8 my-12">
   {if !$configuration.is_catalog}
 
     {block name='product_quantity'}
-      <div class="flex flex-col gap-4 my-12">
+      <div class="flex w-full flex-col gap-4">
         <div class="add">
           <button
-            class="add-to-cart w-full h-12 bg-blue-950 text-white text-base font-light"
+            class="add-to-cart w-full h-12 bg-blue-950 disabled:bg-gray-700 text-white text-base font-light"
             data-button-action="add-to-cart"
             type="submit"
             {if !$product.add_to_cart_url}
@@ -55,14 +55,35 @@
     {/block}
 
     {block name='product_availability'}
-      <span id="product-availability">
+      <span id="product-availability" class='flex w-full justify-center items-center gap-1 text-xl'>
         {if $product.show_availability && $product.availability_message}
           {if $product.availability == 'available'}
-            <i class="material-icons rtl-no-flip product-available">&#xE5CA;</i>
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-box-seam" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+              <path d="M12 3l8 4.5v9l-8 4.5l-8 -4.5v-9l8 -4.5"></path>
+              <path d="M12 12l8 -4.5"></path>
+              <path d="M8.2 9.8l7.6 -4.6"></path>
+              <path d="M12 12v9"></path>
+              <path d="M12 12l-8 -4.5"></path>
+            </svg>
           {elseif $product.availability == 'last_remaining_items'}
-            <i class="material-icons product-last-items">&#xE002;</i>
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-hourglass" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+              <path d="M6.5 7h11"></path>
+              <path d="M6.5 17h11"></path>
+              <path d="M6 20v-2a6 6 0 1 1 12 0v2a1 1 0 0 1 -1 1h-10a1 1 0 0 1 -1 -1z"></path>
+              <path d="M6 4v2a6 6 0 1 0 12 0v-2a1 1 0 0 0 -1 -1h-10a1 1 0 0 0 -1 1z"></path>
+            </svg>
           {else}
-            <i class="material-icons product-unavailable">&#xE14B;</i>
+            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-package-off" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+              <path d="M8.812 4.793l3.188 -1.793l8 4.5v8.5m-2.282 1.784l-5.718 3.216l-8 -4.5v-9l2.223 -1.25"></path>
+              <path d="M14.543 10.57l5.457 -3.07"></path>
+              <path d="M12 12v9"></path>
+              <path d="M12 12l-8 -4.5"></path>
+              <path d="M16 5.25l-4.35 2.447m-2.564 1.442l-1.086 .611"></path>
+              <path d="M3 3l18 18"></path>
+            </svg>
           {/if}
           {$product.availability_message}
         {/if}