From f51d3946be44400b9f4b90fe03b79226522d7369 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <rafizadanly@gmail.com>
Date: Thu, 29 Dec 2022 09:12:14 +0700
Subject: no message

---
 src/components/LineDivider.js    |  2 +-
 src/pages/shop/product/[slug].js | 80 +++++++++++++++++++++++-----------------
 2 files changed, 47 insertions(+), 35 deletions(-)

(limited to 'src')

diff --git a/src/components/LineDivider.js b/src/components/LineDivider.js
index ce92f4ee..4e8c7b52 100644
--- a/src/components/LineDivider.js
+++ b/src/components/LineDivider.js
@@ -1,6 +1,6 @@
 const LineDivider = () => {
   return (
-    <hr className="h-1.5 bg-gray_r-4 border-none"/>
+    <hr className="h-1 bg-gray_r-4 border-none"/>
   );
 };
 
diff --git a/src/pages/shop/product/[slug].js b/src/pages/shop/product/[slug].js
index b76cdee9..16763ab7 100644
--- a/src/pages/shop/product/[slug].js
+++ b/src/pages/shop/product/[slug].js
@@ -11,6 +11,7 @@ import { createOrUpdateItemCart } from "../../../helpers/cart";
 import toast from "react-hot-toast";
 import Footer from "../../../components/Footer";
 import Image from "../../../components/Image";
+import LineDivider from "../../../components/LineDivider";
 
 export async function getServerSideProps( context ) {
   const { slug } = context.query;
@@ -113,7 +114,8 @@ export default function ProductDetail({ product }) {
           alt={product.name}
           className="border-b border-gray_r-6 w-full h-[300px] object-contain object-center bg-white"
         />
-        <div className="p-4 pb-10">
+
+        <div className="p-4">
           <Link href={'/shop/brands/' + createSlug(product.manufacture.name, product.manufacture.id)}>
             {product.manufacture.name ?? '-'}
           </Link>
@@ -135,8 +137,12 @@ export default function ProductDetail({ product }) {
           ) : (
             <p className="text-gray_r-11">Dapatkan harga terbaik, <a href="">hubungi kami.</a></p>
           )}
+        </div>
+        
+        <LineDivider />
 
-          <div className="flex gap-x-2 mt-5">
+        <div className="p-4">
+          <div className="flex gap-x-2">
             <div className="w-9/12">
               <label className="form-label mb-1">Pilih: <span className="text-gray_r-11 font-normal">{product.variant_total} Varian</span></label>
               <select name="variant" className="form-input" value={selectedVariant} onChange={onchangeVariant} >
@@ -168,42 +174,48 @@ export default function ProductDetail({ product }) {
               + Keranjang
             </button>
           </div>
+        </div>
 
-          <div className="mt-10">
-            <h2 className="font-bold mb-2">Detail Produk</h2>
-            <div className="flex py-2 justify-between items-center gap-x-1 border-b border-gray-300">
-              <h3 className="text-gray-900">Jumlah Varian</h3>
-              <p className="text-gray-800">{product.variant_total} Varian</p>
-            </div>
-            <div className="flex py-2 justify-between items-center gap-x-1 border-b border-gray-300">
-              <h3 className="text-gray-900">Nomor SKU</h3>
-              <p className="text-gray-800" id="sku_number">SKU-{activeVariant.id}</p>
-            </div>
-            <div className="flex py-2 justify-between items-center gap-x-1 border-b border-gray-300">
-              <h3 className="text-gray-900">Part Number</h3>
-              <p className="text-gray-800" id="part_number">{activeVariant.code}</p>
-            </div>
-            <div className="flex py-2 justify-between items-center gap-x-1 border-b border-gray-300">
-              <h3 className="text-gray-900">Stok</h3>
-              <p className="text-gray-800" id="stock">
-                {activeVariant.stock > 0 ? (activeVariant.stock > 5 ? 'Lebih dari 5' : 'Kurang dari 5') : '0'}
-              </p>
-            </div>
-            <div className="flex py-2 justify-between items-center gap-x-1 border-b border-gray-300">
-              <h3 className="text-gray-900">Berat Barang</h3>
-              <p className="text-gray-800" id="weight">{activeVariant.weight > 0 ? activeVariant.weight : '1'} KG</p>
-            </div>
-          </div>
+        <LineDivider />
 
-          <div className="mt-10">
-            <h2 className="font-bold mb-4">Deskripsi Produk</h2>
-            <div className="text-gray-800 leading-7" dangerouslySetInnerHTML={{__html: (product.description != '' ? product.description : 'Belum ada deskripsi produk.')}}></div>
+        <div className="p-4">
+          <h2 className="font-bold mb-2">Detail Produk</h2>
+          <div className="flex py-2 justify-between items-center gap-x-1 border-b border-gray-300">
+            <h3 className="text-gray-900">Jumlah Varian</h3>
+            <p className="text-gray-800">{product.variant_total} Varian</p>
           </div>
-
-          <div className="mt-10">
-            <h2 className="font-bold mb-4">Produk Lainnya</h2>
-            <ProductSlider products={similarProducts}/>
+          <div className="flex py-2 justify-between items-center gap-x-1 border-b border-gray-300">
+            <h3 className="text-gray-900">Nomor SKU</h3>
+            <p className="text-gray-800" id="sku_number">SKU-{activeVariant.id}</p>
+          </div>
+          <div className="flex py-2 justify-between items-center gap-x-1 border-b border-gray-300">
+            <h3 className="text-gray-900">Part Number</h3>
+            <p className="text-gray-800" id="part_number">{activeVariant.code}</p>
+          </div>
+          <div className="flex py-2 justify-between items-center gap-x-1 border-b border-gray-300">
+            <h3 className="text-gray-900">Stok</h3>
+            <p className="text-gray-800" id="stock">
+              {activeVariant.stock > 0 ? (activeVariant.stock > 5 ? 'Lebih dari 5' : 'Kurang dari 5') : '0'}
+            </p>
           </div>
+          <div className="flex py-2 justify-between items-center gap-x-1 border-b border-gray-300">
+            <h3 className="text-gray-900">Berat Barang</h3>
+            <p className="text-gray-800" id="weight">{activeVariant.weight > 0 ? activeVariant.weight : '1'} KG</p>
+          </div>
+        </div>
+
+        <LineDivider />
+
+        <div className="p-4">
+          <h2 className="font-bold mb-4">Deskripsi Produk</h2>
+          <div className="text-gray-800 leading-7" dangerouslySetInnerHTML={{__html: (product.description != '' ? product.description : 'Belum ada deskripsi produk.')}}></div>
+        </div>
+
+        <LineDivider />
+
+        <div className="p-4">
+          <h2 className="font-bold mb-4">Produk Lainnya</h2>
+          <ProductSlider products={similarProducts}/>
         </div>
         
         <Footer />
-- 
cgit v1.2.3