From 033b880d1a88e2fc0cd5bb8bce2ed24dae3e94ea Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Thu, 22 Jun 2023 16:57:41 +0700
Subject: change layout

---
 .../components/Product/ProductDesktopVariant.jsx   | 56 ++++++++++++----------
 1 file changed, 30 insertions(+), 26 deletions(-)

(limited to 'src/lib/product/components/Product')

diff --git a/src/lib/product/components/Product/ProductDesktopVariant.jsx b/src/lib/product/components/Product/ProductDesktopVariant.jsx
index a98985c9..557bcc0e 100644
--- a/src/lib/product/components/Product/ProductDesktopVariant.jsx
+++ b/src/lib/product/components/Product/ProductDesktopVariant.jsx
@@ -195,42 +195,46 @@ const ProductDesktopVariant = ({ product, wishlist, toggleWishlist, isVariant })
               </div>
             </div> */}
           </div>
-
           <div className='w-[25%]'>
+            <div className='flex justify-between mb-3 items-center'>
+              <div className='flex'>
+                <span className='text-gray-400 text-md'>Harga Sebelum PPN : </span>
+              </div>
+              <div className='flex'>
+                <span className='font-semibold text-body-1 text-danger-500'>
+                  {currencyFormat(lowestPrice?.priceDiscount)}
+                </span>
+              </div>
+            </div>
+            <span className='font-semibold'>Termasuk PPN :</span>
             {lowestPrice?.discountPercentage > 0 && (
-              <div className='flex gap-x-1 items-center mt-2'>
+              <div className='flex gap-x-1 items-center mt-2 '>
                 <div className='badge-solid-red text-caption-1'>
                   {lowestPrice?.discountPercentage}%
                 </div>
                 <div className='text-gray_r-11 line-through text-caption-1'>
                   {currencyFormat(lowestPrice?.price * 1.11)}
                 </div>
+                <h3 className='text-danger-500 font-semibold text-title-sm'>
+                  {lowestPrice?.priceDiscount > 0 ? (
+                    currencyFormat(lowestPrice?.priceDiscount * 1.11)
+                  ) : (
+                    <span className='text-gray_r-12/90 font-normal text-h-sm'>
+                      Hubungi kami untuk dapatkan harga terbaik,&nbsp;
+                      <a
+                        href={whatsappUrl('product', {
+                          name: product.name,
+                          url: createSlug('/shop/product/', product.name, product.id, true)
+                        })}
+                        className='text-danger-500 underline'
+                      >
+                        klik disini
+                      </a>
+                    </span>
+                  )}
+                </h3>
               </div>
             )}
-            <h3 className='font-semibold mt-1 text-title-sm'>
-              {currencyFormat(lowestPrice?.priceDiscount)}
-            </h3>
-            <h3 className='text-danger-500 font-semibold mt-1 text-title-md'>
-              {lowestPrice?.priceDiscount > 0 ? (
-                currencyFormat(lowestPrice?.priceDiscount * 1.11)
-              ) : (
-                <span className='text-gray_r-12/90 font-normal text-h-sm'>
-                  Hubungi kami untuk dapatkan harga terbaik,&nbsp;
-                  <a
-                    href={whatsappUrl('product', {
-                      name: product.name,
-                      url: createSlug('/shop/product/', product.name, product.id, true)
-                    })}
-                    className='text-danger-500 underline'
-                  >
-                    klik disini
-                  </a>
-                </span>
-              )}
-              {lowestPrice?.priceDiscount > 0 && (
-                <span className='text-sm text-gray_r-11'>*include PPN</span>
-              )}
-            </h3>
 
             <div className='flex gap-x-3 mt-4'>
               <input
-- 
cgit v1.2.3