refactor: update cart product line styles

templates/checkout/_partials/cart-detailed-product-line.tpl

@@ -23,13 +23,13 @@
  * International Registered Trademark & Property of PrestaShop SA
  *}
 
-<div class="flex flex-1">
+<div class="flex flex-1 gap-4 items-center">
   <div class="w-40 h-40">
     <img class="object-cover w-full h-full" src="{$product.cover.bySize.cart_default.url}" alt="{$product.name|escape:'quotes'}">
   </div>
-  <div class="flex flex-1 flex-col gap-4">
+  <div class="flex flex-1 flex-col gap-2">
     <div class="product-line-info">
-      <a class="label" href="{$product.url}" data-id_customization="{$product.id_customization|intval}">{$product.name}</a>
+      <a class="label text-lg font-semibold" href="{$product.url}" data-id_customization="{$product.id_customization|intval}">{$product.name}</a>
     </div>
     <div class="flex gap-4 product-line-info product-price h5 {if $product.has_discount}has-discount{/if}">
       {if $product.has_discount}
@@ -42,28 +42,21 @@
         {/if}
       </div>
     </div>
-    <div class="flex items-center">
-      <span class="font-medium">Quanity: </span>
-      <div class="ml-4">
-        {if isset($product.is_gift) && $product.is_gift}
-          <span class="gift-quantity">{$product.quantity}</span>
-        {else}
-          <input
-            class="js-cart-line-product-quantity px-2 py-1"
-            data-down-url="{$product.down_quantity_url}"
-            data-up-url="{$product.up_quantity_url}"
-            data-update-url="{$product.update_quantity_url}"
-            data-product-id="{$product.id_product}"
-            type="number"
-            value="{$product.quantity}"
-            name="product-quantity-spin"
-            min="{$product.minimal_quantity}"
-          />
-        {/if}
-      </div>
+    <div class="flex items-center w-max">
+        <input
+          class="js-cart-line-product-quantity px-2 py-1"
+          data-down-url="{$product.down_quantity_url}"
+          data-up-url="{$product.up_quantity_url}"
+          data-update-url="{$product.update_quantity_url}"
+          data-product-id="{$product.id_product}"
+          type="number"
+          value="{$product.quantity}"
+          name="product-quantity-spin"
+          min="{$product.minimal_quantity}"
+        />
     </div>
   </div>
-  <div class="px-4 flex flex-1 items-center">
+  <div class="flex flex-col gap-4 w-24 items-center">
     <span class="product-price text-base font-bold">
         {if isset($product.is_gift) && $product.is_gift}
           {l s='Gift' d='Shop.Theme.Checkout'}
@@ -71,8 +64,6 @@
           {$product.total}
         {/if}
     </span>
-  </div>
-  <div class="flex w-24 items-center">
     <div class="cart-line-product-actions">
       <a
           class                       = "remove-from-cart"

templates/checkout/_partials/cart-detailed.tpl

@@ -25,7 +25,7 @@
 {block name='cart_detailed_product'}
   <div class="relative cart-overview js-cart" data-refresh-url="{url entity='cart' params=['ajax' => true, 'action' => 'refresh']}">
     {if $cart.products}
-    <ul class="flex flex-col cart-items">
+    <ul class="flex flex-col gap-2 cart-items">
       {foreach from=$cart.products item=product}
         <li class="flex mb-4 cart-item">
           {block name='cart_detailed_product_line'}

templates/checkout/_partials/cart-summary.tpl

@@ -29,12 +29,10 @@
     {/block}
 
     {block name='cart_summary_products'}
-      <div class="cart-summary-products flex items-center">
-
-
-        <p>{$cart.summary_string}</p>
+      <div class="cart-summary-products flex items-center gap-2 w-full">
+        <span>{$cart.summary_string}</>
         <p>
-          <a href="#" data-toggle="collapse" data-target="#cart-summary-product-list">
+          <a href="#" data-toggle="collapse" class="flex items-center gap-2" data-target="#cart-summary-product-list">
             {l s='show details' d='Shop.Theme.Actions'}
             <i class="ti ti-chevron-down"></i>
           </a>