From 0ca62faf89775496320025c170c942b2cb3e1a20 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Sat, 8 Apr 2023 10:12:31 +0700
Subject: update theme color

---
 src/core/components/elements/Badge/Badge.jsx       | 29 ---------
 src/core/components/elements/Link/Link.jsx         |  2 +-
 .../components/elements/Navbar/NavbarDesktop.jsx   |  6 +-
 src/core/components/elements/Navbar/Search.jsx     |  2 +-
 src/lib/address/components/CreateAddress.jsx       | 16 ++---
 src/lib/address/components/EditAddress.jsx         | 16 ++---
 src/lib/auth/components/RegisterDesktop.jsx        |  4 +-
 src/lib/auth/components/RegisterMobile.jsx         |  2 +-
 src/lib/brand/components/Brand.jsx                 |  4 +-
 src/lib/brand/components/BrandCard.jsx             |  2 +-
 src/lib/brand/components/Brands.jsx                |  2 +-
 src/lib/cart/components/Cart.jsx                   | 43 +++++-------
 src/lib/checkout/components/Checkout.jsx           |  6 +-
 src/lib/checkout/components/FinishCheckout.jsx     | 10 +--
 src/lib/content/components/PageContent.jsx         |  2 +-
 src/lib/home/components/CategoryHome.jsx           |  2 +-
 src/lib/invoice/components/Invoice.jsx             |  2 +-
 src/lib/invoice/components/Invoices.jsx            |  2 +-
 .../product/components/Product/ProductDesktop.jsx  | 12 ++--
 .../product/components/Product/ProductMobile.jsx   | 12 ++--
 src/lib/product/components/ProductCard.jsx         |  4 +-
 src/lib/product/components/ProductFilter.jsx       |  2 +-
 src/lib/product/components/ProductSearch.jsx       |  2 +-
 src/lib/quotation/components/Quotation.jsx         |  6 +-
 src/lib/transaction/components/Transaction.jsx     |  4 +-
 src/lib/transaction/components/Transactions.jsx    |  2 +-
 src/pages/blog/[slug].jsx                          |  2 +-
 src/pages/shop/quotation/finish.jsx                |  4 +-
 src/pages/sitemap/products.xml.js                  | 30 +++++++++
 src/pages/sitemap/products/[id].xml.js             | 32 +++++++++
 src/pages/video.jsx                                |  2 +-
 src/styles/globals.css                             | 76 ++++++++++------------
 32 files changed, 179 insertions(+), 163 deletions(-)
 delete mode 100644 src/core/components/elements/Badge/Badge.jsx
 create mode 100644 src/pages/sitemap/products.xml.js
 create mode 100644 src/pages/sitemap/products/[id].xml.js

(limited to 'src')

diff --git a/src/core/components/elements/Badge/Badge.jsx b/src/core/components/elements/Badge/Badge.jsx
deleted file mode 100644
index e50cdc78..00000000
--- a/src/core/components/elements/Badge/Badge.jsx
+++ /dev/null
@@ -1,29 +0,0 @@
-const Badge = ({ children, type, ...props }) => {
-  return (
-    <div
-      {...props}
-      className={`${badgeStyle(type)} ${props?.className}`}
-    >
-      {children}
-    </div>
-  )
-}
-
-Badge.defaultProps = {
-  className: ''
-}
-
-const badgeStyle = (type) => {
-  let className = ['rounded px-1 text-[11px]']
-  switch (type) {
-    case 'solid-red':
-      className.push('bg-red_r-11 text-white')
-      break
-    case 'light':
-      className.push('bg-gray_r-4 text-gray_r-11')
-      break
-  }
-  return className.join(' ')
-}
-
-export default Badge
diff --git a/src/core/components/elements/Link/Link.jsx b/src/core/components/elements/Link/Link.jsx
index 05859639..360444a6 100644
--- a/src/core/components/elements/Link/Link.jsx
+++ b/src/core/components/elements/Link/Link.jsx
@@ -13,7 +13,7 @@ const Link = ({ children, ...props }) => {
     <NextLink
       {...props}
       scroll={false}
-      className={`block font-medium text-red_r-11 ${props?.className || ''}`}
+      className={`block font-medium text-danger-500 ${props?.className || ''}`}
     >
       {children}
     </NextLink>
diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index c01cb777..0bc9e967 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -22,7 +22,7 @@ const NavbarDesktop = () => {
 
   return (
     <DesktopView>
-      <div className='py-3 bg-yellow_r-10/80' id='desktop-nav-top'>
+      <div className='py-3 bg-warning-400' id='desktop-nav-top'>
         <div className='container mx-auto flex justify-between'>
           <Link href='/' className='!text-gray_r-12'>
             Tentang Indoteknik.com
@@ -129,13 +129,13 @@ const NavbarDesktop = () => {
               <>
                 <Link
                   href='/login'
-                  className='flex-1 flex justify-center items-center bg-red_r-11 !text-gray_r-1 rounded-none'
+                  className='flex-1 flex justify-center items-center bg-danger-500 !text-gray_r-1 rounded-none'
                 >
                   Masuk
                 </Link>
                 <Link
                   href='/register'
-                  className='flex-1 flex justify-center items-center bg-red_r-11 !text-gray_r-1 rounded-none rounded-tr-xl'
+                  className='flex-1 flex justify-center items-center bg-danger-500 !text-gray_r-1 rounded-none rounded-tr-xl'
                 >
                   Daftar
                 </Link>
diff --git a/src/core/components/elements/Navbar/Search.jsx b/src/core/components/elements/Navbar/Search.jsx
index 32a8d170..d0627b24 100644
--- a/src/core/components/elements/Navbar/Search.jsx
+++ b/src/core/components/elements/Navbar/Search.jsx
@@ -73,7 +73,7 @@ const Search = () => {
                 <Link
                   href={`/shop/search?q=${suggestion.term}`}
                   key={index}
-                  className='px-3 py-3 !text-gray_r-12 font-normal hover:bg-yellow_r-4'
+                  className='px-3 py-3 !text-gray_r-12 font-normal'
                 >
                   {suggestion.term}
                 </Link>
diff --git a/src/lib/address/components/CreateAddress.jsx b/src/lib/address/components/CreateAddress.jsx
index a4669ee0..86519147 100644
--- a/src/lib/address/components/CreateAddress.jsx
+++ b/src/lib/address/components/CreateAddress.jsx
@@ -105,7 +105,7 @@ const CreateAddress = () => {
                   <HookFormSelect {...props} isSearchable={false} options={types} />
                 )}
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.type?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.type?.message}</div>
             </div>
 
             <div>
@@ -116,7 +116,7 @@ const CreateAddress = () => {
                 type='text'
                 className='form-input'
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.name?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.name?.message}</div>
             </div>
 
             <div>
@@ -127,7 +127,7 @@ const CreateAddress = () => {
                 type='email'
                 className='form-input'
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.email?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.email?.message}</div>
             </div>
 
             <div>
@@ -138,7 +138,7 @@ const CreateAddress = () => {
                 type='tel'
                 className='form-input'
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.mobile?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.mobile?.message}</div>
             </div>
 
             <div>
@@ -149,7 +149,7 @@ const CreateAddress = () => {
                 type='text'
                 className='form-input'
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.street?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.street?.message}</div>
             </div>
 
             <div>
@@ -160,7 +160,7 @@ const CreateAddress = () => {
                 type='number'
                 className='form-input'
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.zip?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.zip?.message}</div>
             </div>
 
             <div>
@@ -170,7 +170,7 @@ const CreateAddress = () => {
                 control={control}
                 render={(props) => <HookFormSelect {...props} options={cities} />}
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.city?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.city?.message}</div>
             </div>
 
             <div>
@@ -182,7 +182,7 @@ const CreateAddress = () => {
                   <HookFormSelect {...props} options={districts} disabled={!watchCity} />
                 )}
               />
-               <div className='text-caption-2 text-red_r-11 mt-1'>{errors.district?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.district?.message}</div>
             </div>
 
             <div>
diff --git a/src/lib/address/components/EditAddress.jsx b/src/lib/address/components/EditAddress.jsx
index 006ea407..30555ecd 100644
--- a/src/lib/address/components/EditAddress.jsx
+++ b/src/lib/address/components/EditAddress.jsx
@@ -120,7 +120,7 @@ const EditAddress = ({ id, defaultValues }) => {
                   <HookFormSelect {...props} isSearchable={false} options={types} />
                 )}
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.type?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.type?.message}</div>
             </div>
 
             <div>
@@ -131,7 +131,7 @@ const EditAddress = ({ id, defaultValues }) => {
                 type='text'
                 className='form-input'
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.name?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.name?.message}</div>
             </div>
 
             <div>
@@ -142,7 +142,7 @@ const EditAddress = ({ id, defaultValues }) => {
                 type='email'
                 className='form-input'
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.email?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.email?.message}</div>
             </div>
 
             <div>
@@ -153,7 +153,7 @@ const EditAddress = ({ id, defaultValues }) => {
                 type='tel'
                 className='form-input'
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.mobile?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.mobile?.message}</div>
             </div>
 
             <div>
@@ -164,7 +164,7 @@ const EditAddress = ({ id, defaultValues }) => {
                 type='text'
                 className='form-input'
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.street?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.street?.message}</div>
             </div>
 
             <div>
@@ -175,7 +175,7 @@ const EditAddress = ({ id, defaultValues }) => {
                 type='number'
                 className='form-input'
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.zip?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.zip?.message}</div>
             </div>
 
             <div>
@@ -185,7 +185,7 @@ const EditAddress = ({ id, defaultValues }) => {
                 control={control}
                 render={(props) => <HookFormSelect {...props} options={cities} />}
               />
-              <div className='text-caption-2 text-red_r-11 mt-1'>{errors.city?.message}</div>
+              <div className='text-caption-2 text-danger-500 mt-1'>{errors.city?.message}</div>
             </div>
 
             <div>
@@ -197,7 +197,7 @@ const EditAddress = ({ id, defaultValues }) => {
                   <HookFormSelect {...props} options={districts} disabled={!watchCity} />
                 )}
               />
-               <div className='text-caption-2 text-red_r-11 mt-1'>{errors.district?.message}</div>
+               <div className='text-caption-2 text-danger-500 mt-1'>{errors.district?.message}</div>
             </div>
 
             <div>
diff --git a/src/lib/auth/components/RegisterDesktop.jsx b/src/lib/auth/components/RegisterDesktop.jsx
index 5f0caf73..ac6ac960 100644
--- a/src/lib/auth/components/RegisterDesktop.jsx
+++ b/src/lib/auth/components/RegisterDesktop.jsx
@@ -91,14 +91,14 @@ const RegisterDesktop = () => {
               </div>
               <div class="flex items-center mt-4 ">
                 <input type="checkbox" id='sdk' className='form-input flex items-start w-fit mr-2' required />
-                <label onClick={() => setTnd(true)}  className='inline cursor-pointer text-red_r-10'>Syarat dan Ketentuan</label>
+                <label onClick={() => setTnd(true)}  className='inline cursor-pointer text-danger-500'>Syarat dan Ketentuan</label>
               </div>
               <button
                 type='submit'
                 className='btn-yellow w-full mt-2'
                 disabled={!isValid || isLoading}
               >
-                {!isLoading ? 'Masuk' : 'Loading...'}
+                {!isLoading ? 'Daftar' : 'Loading...'}
               </button>
             </form>
 
diff --git a/src/lib/auth/components/RegisterMobile.jsx b/src/lib/auth/components/RegisterMobile.jsx
index 11935439..214584f4 100644
--- a/src/lib/auth/components/RegisterMobile.jsx
+++ b/src/lib/auth/components/RegisterMobile.jsx
@@ -100,7 +100,7 @@ const RegisterMobile = () => {
               className='form-input flex items-start w-fit mr-2'
               required
             />
-            <label onClick={() => setTnd(true)} className='inline cursor-pointer text-red_r-10'>
+            <label onClick={() => setTnd(true)} className='inline cursor-pointer text-danger-500'>
               Syarat dan Ketentuan
             </label>
           </div>
diff --git a/src/lib/brand/components/Brand.jsx b/src/lib/brand/components/Brand.jsx
index 6e156b8e..6ebb8aa7 100644
--- a/src/lib/brand/components/Brand.jsx
+++ b/src/lib/brand/components/Brand.jsx
@@ -58,7 +58,7 @@ const Brand = ({ id }) => {
                     />
                   )}
                   {!brand?.data?.logo && (
-                    <div className='bg-red_r-10 text-white text-center text-caption-1 py-2 px-4 rounded w-fit'>
+                    <div className='bg-danger-500 text-white text-center text-caption-1 py-2 px-4 rounded w-fit'>
                       {brand?.data?.name}
                     </div>
                   )}
@@ -102,7 +102,7 @@ const Brand = ({ id }) => {
                     />
                   )}
                   {!brand?.data?.logo && (
-                    <div className='bg-red_r-10 text-white text-center text-caption-1 py-2 px-4 rounded w-fit'>
+                    <div className='bg-danger-500 text-white text-center text-body-1 py-2 px-4 rounded w-fit'>
                       {brand?.data?.name}
                     </div>
                   )}
diff --git a/src/lib/brand/components/BrandCard.jsx b/src/lib/brand/components/BrandCard.jsx
index 984a9fa6..f8c01e6d 100644
--- a/src/lib/brand/components/BrandCard.jsx
+++ b/src/lib/brand/components/BrandCard.jsx
@@ -20,7 +20,7 @@ const BrandCard = ({ brand }) => {
       {!brand.logo && (
         <span
           className='text-center'
-          style={{ fontSize: `${14 - brand.name.length * 0.5}px` }}
+          style={{ fontSize: `${16 - brand.name.length * 0.5}px` }}
         >
           {brand.name}
         </span>
diff --git a/src/lib/brand/components/Brands.jsx b/src/lib/brand/components/Brands.jsx
index 777e05ac..25fb1c67 100644
--- a/src/lib/brand/components/Brands.jsx
+++ b/src/lib/brand/components/Brands.jsx
@@ -56,7 +56,7 @@ const Brands = () => {
             key={index}
             className={
               'p-2 py-1 border bg-white border-gray_r-6 rounded w-10 flex-shrink-0' +
-              (startWith == alphabet ? ' !bg-yellow_r-9 border-yellow_r-9 ' : '')
+              (startWith == alphabet ? ' !bg-warning-500 border-warning-500 ' : '')
             }
             type='button'
             onClick={() => toggleStartWith(alphabet)}
diff --git a/src/lib/cart/components/Cart.jsx b/src/lib/cart/components/Cart.jsx
index 1131fed7..5b8a4690 100644
--- a/src/lib/cart/components/Cart.jsx
+++ b/src/lib/cart/components/Cart.jsx
@@ -170,16 +170,13 @@ const Cart = () => {
 
             {products?.map((product) => (
               <div key={product?.id} className='flex mx-4'>
-                <button
-                  type='button'
-                  className='flex items-center mr-2'
+                <input
+                  type='checkbox'
                   onClick={() => toggleSelected(product.id)}
-                >
-                  {!product?.selected && (
-                    <div className='w-5 h-5 border border-gray_r-11 rounded' />
-                  )}
-                  {product?.selected && <CheckIcon className='border bg-red_r-10 w-5 text-white' />}
-                </button>
+                  checked={product?.selected}
+                  className='mr-2 accent-danger-500 w-4'
+                />
+
                 <Link
                   href={createSlug('/shop/product/', product?.parent.name, product?.parent.id)}
                   className='w-[30%] flex-shrink-0'
@@ -213,7 +210,7 @@ const Cart = () => {
                     {currencyFormat(product?.price?.priceDiscount)}
                   </div>
                   <div className='flex justify-between items-center mt-1'>
-                    <div className='text-red_r-11 font-medium'>
+                    <div className='text-danger-500 font-medium'>
                       {currencyFormat(product?.price?.priceDiscount * product?.quantity)}
                     </div>
                     <div className='flex gap-x-1'>
@@ -255,7 +252,7 @@ const Cart = () => {
               <div className='flex justify-between mb-4'>
                 <div className='text-gray_r-11'>
                   Total:
-                  <span className='text-red_r-11 font-semibold'>
+                  <span className='text-danger-500 font-semibold'>
                     &nbsp;
                     {selectedProduct().length > 0
                       ? currencyFormat(totalPriceBeforeTax - totalDiscountAmount + totalTaxAmount)
@@ -319,18 +316,12 @@ const Cart = () => {
                 {products?.map((product) => (
                   <tr key={product.id}>
                     <td>
-                      <button
-                        type='button'
-                        className='flex items-center mr-2'
+                      <input
+                        type='checkbox'
                         onClick={() => toggleSelected(product.id)}
-                      >
-                        {!product?.selected && (
-                          <div className='w-5 h-5 border border-gray_r-11 rounded' />
-                        )}
-                        {product?.selected && (
-                          <CheckIcon className='border bg-red_r-10 w-5 text-white' />
-                        )}
-                      </button>
+                        checked={product?.selected}
+                        className='accent-danger-500 w-4'
+                      />
                     </td>
                     <td className='flex'>
                       <Link
@@ -339,12 +330,12 @@ const Cart = () => {
                           product?.parent.name,
                           product?.parent.id
                         )}
-                        className='w-[30%] flex-shrink-0'
+                        className='w-[20%] flex-shrink-0'
                       >
                         <Image
                           src={product?.parent?.image}
                           alt={product?.name}
-                          className='object-contain object-center border border-gray_r-6 h-40 w-full rounded-md'
+                          className='object-contain object-center border border-gray_r-6 h-28 w-full rounded-md'
                         />
                       </Link>
                       <div className='px-2 text-left'>
@@ -391,7 +382,7 @@ const Cart = () => {
                       </div>
                     </td>
                     <td>
-                      <div className='text-red_r-11 font-medium'>
+                      <div className='text-danger-500 font-medium'>
                         {currencyFormat(product?.price?.priceDiscount * product?.quantity)}
                       </div>
                     </td>
@@ -429,7 +420,7 @@ const Cart = () => {
               <div className='flex justify-between mb-4'>
                 <div className='text-gray_r-11'>
                   Total:
-                  <span className='text-red_r-11 font-semibold'>
+                  <span className='text-danger-500 font-semibold'>
                     &nbsp;
                     {selectedProduct().length > 0
                       ? currencyFormat(totalPriceBeforeTax - totalDiscountAmount + totalTaxAmount)
diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx
index c9e0556b..17ac20e1 100644
--- a/src/lib/checkout/components/Checkout.jsx
+++ b/src/lib/checkout/components/Checkout.jsx
@@ -184,7 +184,7 @@ const Checkout = () => {
             </div>
             <div className='flex gap-x-2 justify-between'>
               <div className='text-gray_r-11'>Total Diskon</div>
-              <div className='text-red_r-11'>- {currencyFormat(totalDiscountAmount)}</div>
+              <div className='text-danger-500'>- {currencyFormat(totalDiscountAmount)}</div>
             </div>
             <div className='flex gap-x-2 justify-between'>
               <div className='text-gray_r-11'>Subtotal</div>
@@ -313,7 +313,7 @@ const Checkout = () => {
                         </div>
                       </td>
                       <td>
-                        <div className='text-red_r-11 font-medium'>
+                        <div className='text-danger-500 font-medium'>
                           {currencyFormat(product?.price?.priceDiscount * product?.quantity)}
                         </div>
                       </td>
@@ -340,7 +340,7 @@ const Checkout = () => {
                 </div>
                 <div className='flex gap-x-2 justify-between'>
                   <div className='text-gray_r-11'>Total Diskon</div>
-                  <div className='text-red_r-11'>- {currencyFormat(totalDiscountAmount)}</div>
+                  <div className='text-danger-500'>- {currencyFormat(totalDiscountAmount)}</div>
                 </div>
                 <div className='flex gap-x-2 justify-between'>
                   <div className='text-gray_r-11'>Subtotal</div>
diff --git a/src/lib/checkout/components/FinishCheckout.jsx b/src/lib/checkout/components/FinishCheckout.jsx
index 4af39e91..cd93e3a4 100644
--- a/src/lib/checkout/components/FinishCheckout.jsx
+++ b/src/lib/checkout/components/FinishCheckout.jsx
@@ -3,19 +3,19 @@ import Link from '@/core/components/elements/Link/Link'
 const FinishCheckout = ({ query }) => {
   return (
     <div className='mx-auto container p-4 md:p-0 mt-0 md:mt-10'>
-      <div className='rounded-xl bg-yellow_r-4 text-center border border-yellow_r-7'>
-        <div className='px-4 py-6 text-yellow_r-12'>
+      <div className='rounded-xl bg-warning-100 text-center border border-warning-300 w-full md:w-1/2 mx-auto'>
+        <div className='px-4 py-6 text-warning-900'>
           <p className='font-semibold mb-2'>Terima Kasih atas Pembelian Anda</p>
-          <p className='text-yellow_r-11 mb-4 leading-6'>
+          <p className='text-warning-800 mb-4 leading-6'>
             Rincian belanja sudah kami kirimkan ke email anda. Mohon dicek kembali. jika tidak
             menerima email, anda dapat menghubungi kami disini.
           </p>
           <p className='mb-2 font-medium'>{query?.order_id?.replaceAll('-', '/')}</p>
-          <p className='text-caption-2 text-yellow_r-11'>No. Transaksi</p>
+          <p className='text-caption-2 text-warning-800'>No. Transaksi</p>
         </div>
         <Link
           href='/my/transactions'
-          className='bg-yellow_r-6 text-yellow_r-12 rounded-b-xl py-4 block'
+          className='bg-warning-400 text-warning-900 rounded-b-xl py-4 block'
         >
           Lihat detail pembelian Anda disini
         </Link>
diff --git a/src/lib/content/components/PageContent.jsx b/src/lib/content/components/PageContent.jsx
index bb44dd92..8b07cbfb 100644
--- a/src/lib/content/components/PageContent.jsx
+++ b/src/lib/content/components/PageContent.jsx
@@ -15,7 +15,7 @@ const PageContent = ({ path }) => {
     const contentClassNames = ` 
       prose 
       prose-gray 
-      prose-a:text-red_r-10 
+      prose-a:text-danger-500 
       prose-p:my-0 
       prose-headings:my-0
       prose-headings:mb-1
diff --git a/src/lib/home/components/CategoryHome.jsx b/src/lib/home/components/CategoryHome.jsx
index 05f0ca28..8fe3788c 100644
--- a/src/lib/home/components/CategoryHome.jsx
+++ b/src/lib/home/components/CategoryHome.jsx
@@ -6,7 +6,7 @@ const CategoryHome = ({ id }) => {
   const { categoryHome } = useCategoryHome({ id })
 
   return (
-    <div className='p-4 sm:py-8 relative bg-yellow_r-2 border border-yellow_r-5'>
+    <div className='p-4 sm:py-8 relative bg-warning-100 border border-warning-300'>
       {categoryHome.data ? (
         <ProductSlider
           products={{
diff --git a/src/lib/invoice/components/Invoice.jsx b/src/lib/invoice/components/Invoice.jsx
index 6012e4ea..1094e2e4 100644
--- a/src/lib/invoice/components/Invoice.jsx
+++ b/src/lib/invoice/components/Invoice.jsx
@@ -167,7 +167,7 @@ const Invoice = ({ id }) => {
                     {invoice.data?.efaktur ? (
                       <button
                         type='button'
-                        className='inline-block text-red_r-11'
+                        className='inline-block text-danger-500'
                         onClick={() => downloadTaxInvoice(invoice?.data)}
                       >
                         Download
diff --git a/src/lib/invoice/components/Invoices.jsx b/src/lib/invoice/components/Invoices.jsx
index 51041316..6f7d54a0 100644
--- a/src/lib/invoice/components/Invoices.jsx
+++ b/src/lib/invoice/components/Invoices.jsx
@@ -80,7 +80,7 @@ const Invoices = () => {
               <div className='grid grid-cols-2'>
                 <Link href={`/my/invoice/${invoice.id}`}>
                   <span className='text-caption-2 text-gray_r-11'>No. Invoice</span>
-                  <h2 className='text-red_r-11 mt-1'>{invoice.name}</h2>
+                  <h2 className='text-danger-500 mt-1'>{invoice.name}</h2>
                 </Link>
                 <div className='flex gap-x-1 justify-end'>
                   {invoice.amountResidual > 0 ? (
diff --git a/src/lib/product/components/Product/ProductDesktop.jsx b/src/lib/product/components/Product/ProductDesktop.jsx
index e0d2a959..faff375f 100644
--- a/src/lib/product/components/Product/ProductDesktop.jsx
+++ b/src/lib/product/components/Product/ProductDesktop.jsx
@@ -125,7 +125,7 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
                 <div className='w-3/4'>
                   {product?.weight > 0 && <span>{product?.weight} KG</span>}
                   {product?.weight == 0 && (
-                    <a href='https://wa.me' className='text-red_r-11 font-medium'>
+                    <a href='https://wa.me' className='text-danger-500 font-medium'>
                       Tanya Berat
                     </a>
                   )}
@@ -149,13 +149,13 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
                 </div>
               </div>
             )}
-            <h3 className='text-red_r-11 font-semibold mt-1 text-title-md'>
+            <h3 className='text-danger-500 font-semibold mt-1 text-title-md'>
               {lowestPrice?.priceDiscount > 0 ? (
                 currencyFormat(lowestPrice?.priceDiscount)
               ) : (
                 <span className='text-gray_r-12/90 font-normal text-h-sm'>
                   Hubungi kami untuk dapatkan harga terbaik,&nbsp;
-                  <a href='https://wa.me/' className='text-red_r-11 underline'>
+                  <a href='https://wa.me/' className='text-danger-500 underline'>
                     klik disini
                   </a>
                 </span>
@@ -173,7 +173,7 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
             <div className='flex mt-4'>
               <button className='flex items-center gap-x-1' onClick={toggleWishlist}>
                 {wishlist.data?.productTotal > 0 ? (
-                  <HeartIcon className='w-6 fill-red_r-11 text-red_r-11' />
+                  <HeartIcon className='w-6 fill-danger-500 text-danger-500' />
                 ) : (
                   <HeartIcon className='w-6' />
                 )}
@@ -213,7 +213,7 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
                         {variant.price.priceDiscount > 0 ? (
                           currencyFormat(variant.price.priceDiscount)
                         ) : (
-                          <a href='https://wa.me/' className='text-red_r-11'>
+                          <a href='https://wa.me/' className='text-danger-500'>
                             Call for price
                           </a>
                         )}
@@ -301,7 +301,7 @@ const informationTabOptions = [
 
 const TabButton = ({ children, active, ...props }) => {
   const activeClassName = active
-    ? 'text-red_r-11 underline underline-offset-4'
+    ? 'text-danger-500 underline underline-offset-4'
     : 'text-gray_r-12/80'
   return (
     <button {...props} type='button' className={`font-medium ${activeClassName}`}>
diff --git a/src/lib/product/components/Product/ProductMobile.jsx b/src/lib/product/components/Product/ProductMobile.jsx
index 13b02354..493fcbf7 100644
--- a/src/lib/product/components/Product/ProductMobile.jsx
+++ b/src/lib/product/components/Product/ProductMobile.jsx
@@ -122,7 +122,7 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
           )}
           <button type='button' className='ml-auto' onClick={toggleWishlist}>
             {wishlist.data?.productTotal > 0 ? (
-              <HeartIcon className='w-6 fill-red_r-11 text-red_r-11' />
+              <HeartIcon className='w-6 fill-danger-500 text-danger-500' />
             ) : (
               <HeartIcon className='w-6' />
             )}
@@ -142,13 +142,13 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
             <div className='badge-solid-red'>{activeVariant?.price?.discountPercentage}%</div>
           </div>
         )}
-        <h3 className='text-red_r-11 font-semibold mt-1'>
+        <h3 className='text-danger-500 font-semibold mt-1'>
           {activeVariant?.price?.priceDiscount > 0 ? (
             currencyFormat(activeVariant?.price?.priceDiscount)
           ) : (
             <span className='text-gray_r-11 leading-6 font-normal'>
               Hubungi kami untuk dapatkan harga terbaik,&nbsp;
-              <a href='https://wa.me/' className='text-red_r-11 underline'>
+              <a href='https://wa.me/' className='text-danger-500 underline'>
                 klik disini
               </a>
             </span>
@@ -232,7 +232,7 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
               </span>
             )}
             {activeVariant?.stock == 0 && (
-              <a href='https://wa.me' className='text-red_r-11 font-medium'>
+              <a href='https://wa.me' className='text-danger-500 font-medium'>
                 Tanya Stok
               </a>
             )}
@@ -240,7 +240,7 @@ const ProductMobile = ({ product, wishlist, toggleWishlist }) => {
           <SpecificationContent label='Berat Barang'>
             {activeVariant?.weight > 0 && <span>{activeVariant?.weight} KG</span>}
             {activeVariant?.weight == 0 && (
-              <a href='https://wa.me' className='text-red_r-11 font-medium'>
+              <a href='https://wa.me' className='text-danger-500 font-medium'>
                 Tanya Berat
               </a>
             )}
@@ -275,7 +275,7 @@ const informationTabOptions = [
 ]
 
 const TabButton = ({ children, active, ...props }) => {
-  const activeClassName = active ? 'text-red_r-11 underline underline-offset-4' : 'text-gray_r-11'
+  const activeClassName = active ? 'text-danger-500 underline underline-offset-4' : 'text-gray_r-11'
   return (
     <button {...props} type='button' className={`font-medium pb-1 ${activeClassName}`}>
       {children}
diff --git a/src/lib/product/components/ProductCard.jsx b/src/lib/product/components/ProductCard.jsx
index df709394..f85a0b03 100644
--- a/src/lib/product/components/ProductCard.jsx
+++ b/src/lib/product/components/ProductCard.jsx
@@ -54,7 +54,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
             </div>
           )}
 
-          <div className='text-red_r-11 font-semibold mb-2'>
+          <div className='text-danger-500 font-semibold mb-2'>
             {product?.lowestPrice.priceDiscount > 0 ? (
               currencyFormat(product?.lowestPrice.priceDiscount)
             ) : (
@@ -126,7 +126,7 @@ const ProductCard = ({ product, simpleTitle, variant = 'vertical' }) => {
             </div>
           )}
 
-          <div className='text-red_r-11 font-semibold mb-2'>
+          <div className='text-danger-500 font-semibold mb-2'>
             {product?.lowestPrice?.priceDiscount > 0 ? (
               currencyFormat(product?.lowestPrice?.priceDiscount)
             ) : (
diff --git a/src/lib/product/components/ProductFilter.jsx b/src/lib/product/components/ProductFilter.jsx
index eca95f74..be1edd18 100644
--- a/src/lib/product/components/ProductFilter.jsx
+++ b/src/lib/product/components/ProductFilter.jsx
@@ -88,7 +88,7 @@ const ProductFilter = ({ active, close, brands, categories, prefixUrl, defaultBr
               <button
                 key={orderOption.value}
                 className={`btn-light px-3 font-normal flex-shrink-0 ${
-                  order == orderOption.value ? 'bg-yellow_r-10' : 'bg-transparent'
+                  order == orderOption.value ? 'bg-warning-500' : 'bg-transparent'
                 }`}
                 onClick={() => setOrder(orderOption.value)}
               >
diff --git a/src/lib/product/components/ProductSearch.jsx b/src/lib/product/components/ProductSearch.jsx
index 8e68d62d..0010a88a 100644
--- a/src/lib/product/components/ProductSearch.jsx
+++ b/src/lib/product/components/ProductSearch.jsx
@@ -200,7 +200,7 @@ const ProductSearch = ({ query, prefixUrl, defaultBrand = null }) => {
                 <div className='text-gray_r-12/90'>
                   <span>
                     Barang yang anda cari tidak ada?{' '}
-                    <a href='#' className='text-red_r-9'>
+                    <a href='#' className='text-danger-500'>
                       Hubungi Kami
                     </a>
                   </span>
diff --git a/src/lib/quotation/components/Quotation.jsx b/src/lib/quotation/components/Quotation.jsx
index a95a149a..e233efd1 100644
--- a/src/lib/quotation/components/Quotation.jsx
+++ b/src/lib/quotation/components/Quotation.jsx
@@ -129,7 +129,7 @@ const Quotation = () => {
             </div>
             <div className='flex gap-x-2 justify-between'>
               <div className='text-gray_r-11'>Total Diskon</div>
-              <div className='text-red_r-11'>- {currencyFormat(totalDiscountAmount)}</div>
+              <div className='text-danger-500'>- {currencyFormat(totalDiscountAmount)}</div>
             </div>
             <div className='flex gap-x-2 justify-between'>
               <div className='text-gray_r-11'>Subtotal</div>
@@ -226,7 +226,7 @@ const Quotation = () => {
                       </div>
                     </td>
                     <td>
-                      <div className='text-red_r-11 font-medium'>
+                      <div className='text-danger-500 font-medium'>
                         {currencyFormat(product?.price?.priceDiscount * product?.quantity)}
                       </div>
                     </td>
@@ -252,7 +252,7 @@ const Quotation = () => {
                 </div>
                 <div className='flex gap-x-2 justify-between'>
                   <div className='text-gray_r-11'>Total Diskon</div>
-                  <div className='text-red_r-11'>- {currencyFormat(totalDiscountAmount)}</div>
+                  <div className='text-danger-500'>- {currencyFormat(totalDiscountAmount)}</div>
                 </div>
                 <div className='flex gap-x-2 justify-between'>
                   <div className='text-gray_r-11'>Subtotal</div>
diff --git a/src/lib/transaction/components/Transaction.jsx b/src/lib/transaction/components/Transaction.jsx
index c8956d80..a0455c27 100644
--- a/src/lib/transaction/components/Transaction.jsx
+++ b/src/lib/transaction/components/Transaction.jsx
@@ -318,7 +318,7 @@ const Transaction = ({ id }) => {
                     : {transaction?.data?.purchaseOrderName}{' '}
                     <button
                       type='button'
-                      className='inline-block text-red_r-11'
+                      className='inline-block text-danger-500'
                       onClick={
                         transaction.data?.purchaseOrderFile
                           ? () => downloadPurchaseOrder(transaction.data)
@@ -421,7 +421,7 @@ const Transaction = ({ id }) => {
                   <div className='text-right font-medium'>{currencyFormat(totalAmount)}</div>
 
                   <div className='text-right'>Total Diskon</div>
-                  <div className='text-right font-medium text-red_r-11'>
+                  <div className='text-right font-medium text-danger-500'>
                     {currencyFormat(-totalDiscountAmount)}
                   </div>
 
diff --git a/src/lib/transaction/components/Transactions.jsx b/src/lib/transaction/components/Transactions.jsx
index 30c670ae..13417707 100644
--- a/src/lib/transaction/components/Transactions.jsx
+++ b/src/lib/transaction/components/Transactions.jsx
@@ -91,7 +91,7 @@ const Transactions = () => {
               <div className='grid grid-cols-2'>
                 <Link href={`/my/transaction/${saleOrder.id}`}>
                   <span className='text-caption-2 text-gray_r-11'>No. Transaksi</span>
-                  <h2 className='text-red_r-11 mt-1'>{saleOrder.name}</h2>
+                  <h2 className='text-danger-500 mt-1'>{saleOrder.name}</h2>
                 </Link>
                 <div className='flex gap-x-1 justify-end'>
                   <TransactionStatusBadge status={saleOrder.status} />
diff --git a/src/pages/blog/[slug].jsx b/src/pages/blog/[slug].jsx
index 39f10b79..9305411d 100644
--- a/src/pages/blog/[slug].jsx
+++ b/src/pages/blog/[slug].jsx
@@ -20,7 +20,7 @@ export default function BlogDetail() {
   const contentClassNames = ` 
       prose 
       prose-gray 
-      prose-a:text-red_r-10 
+      prose-a:text-danger-500 
       prose-a:no-underline
       prose-p:my-4
       prose-headings:mt-6
diff --git a/src/pages/shop/quotation/finish.jsx b/src/pages/shop/quotation/finish.jsx
index 52e03cf6..f6c0ac6b 100644
--- a/src/pages/shop/quotation/finish.jsx
+++ b/src/pages/shop/quotation/finish.jsx
@@ -19,8 +19,8 @@ export default function FinishQuotation() {
         <div className='mx-auto container'>
           <div className='m-4 md:m-0 md:mt-10 px-4 py-6 shadow-md border border-gray_r-3'>
             <div className='flex'>
-              <span className='p-3 mx-auto bg-yellow_r-3 border border-yellow_r-6 rounded'>
-                <EnvelopeIcon className='w-8 text-yellow_r-11' />
+              <span className='p-3 mx-auto bg-warning-100 border border-warning-300 rounded'>
+                <EnvelopeIcon className='w-8 text-warning-800' />
               </span>
             </div>
             <p className='h2 text-center mt-6'>Terima Kasih {auth?.name}</p>
diff --git a/src/pages/sitemap/products.xml.js b/src/pages/sitemap/products.xml.js
new file mode 100644
index 00000000..e5fc8029
--- /dev/null
+++ b/src/pages/sitemap/products.xml.js
@@ -0,0 +1,30 @@
+import productSearchApi from '@/lib/product/api/productSearchApi'
+import { create } from 'xmlbuilder'
+import _ from 'lodash-contrib'
+
+export async function getServerSideProps({ res }) {
+  const baseUrl = process.env.SELF_HOST + '/sitemap/products'
+  const limit = 2500
+  const query = { limit }
+  const products = await productSearchApi({ query: _.toQuery(query) })
+  const pageCount = Math.ceil(products.response.numFound / limit)
+  const pages = Array.from({ length: pageCount }, (_, i) => i + 1)
+  const sitemapIndex = create('sitemapindex', { encoding: 'UTF-8' })
+
+  const date = new Date()
+  pages.forEach((page) => {
+    const sitemap = sitemapIndex.ele('sitemap')
+    sitemap.ele('loc', `${baseUrl}/${page}.xml`)
+    sitemap.ele('lastmod', date.toISOString().slice(0, 10))
+  })
+
+  res.setHeader('Content-Type', 'text/xml')
+  res.write(sitemapIndex.end())
+  res.end()
+
+  return { props: {} }
+}
+
+export default function SitemapProducts() {
+  return null
+}
diff --git a/src/pages/sitemap/products/[id].xml.js b/src/pages/sitemap/products/[id].xml.js
new file mode 100644
index 00000000..e9caaa00
--- /dev/null
+++ b/src/pages/sitemap/products/[id].xml.js
@@ -0,0 +1,32 @@
+import productSearchApi from '@/lib/product/api/productSearchApi'
+import { create } from 'xmlbuilder'
+import _ from 'lodash-contrib'
+import { createSlug } from '@/core/utils/slug'
+
+export async function getServerSideProps({ res }) {
+  const baseUrl = process.env.SELF_HOST + '/shop/product'
+  const limit = 2500
+  const query = { limit }
+  const products = await productSearchApi({ query: _.toQuery(query) })
+  console.log(products);
+  // const sitemap = create('urlset', { encoding: 'UTF-8' })
+
+  // const date = new Date()
+  // pages.forEach((page) => {
+  //   const url = sitemap.ele('url')
+  //   url.ele('loc', createSlug(baseUrl, '', ''))
+  //   url.ele('lastmod', date.toISOString().slice(0, 10))
+  //   url.ele('changefreq', 'weekly')
+  //   url.ele('priority', '0.8')
+  // })
+
+  // res.setHeader('Content-Type', 'text/xml')
+  // res.write(sitemap.end())
+  // res.end()
+
+  return { props: {} }
+}
+
+export default function SitemapProducts() {
+  return <></>
+}
diff --git a/src/pages/video.jsx b/src/pages/video.jsx
index 7a2a5ecc..708c3368 100644
--- a/src/pages/video.jsx
+++ b/src/pages/video.jsx
@@ -45,7 +45,7 @@ export default function Video() {
                 <div className='p-3'>
                   <a
                     href='https://www.youtube.com/@indoteknikb2bindustriale-c778'
-                    className='text-red_r-11 mb-2 block'
+                    className='text-danger-500 mb-2 block'
                   >
                     {video.channelName}
                   </a>
diff --git a/src/styles/globals.css b/src/styles/globals.css
index d43dad1f..d27913a2 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -55,12 +55,12 @@ button {
     }
 
     .badge-red {
-        @apply bg-red_r-5
-            text-red_r-10;
+        @apply bg-danger-100
+            text-danger-600;
     }
 
     .badge-solid-red {
-        @apply bg-red_r-10
+        @apply bg-danger-500
             text-white;
     }
 
@@ -70,8 +70,8 @@ button {
     }
 
     .badge-yellow {
-        @apply bg-yellow_r-3
-            text-yellow_r-11;
+        @apply bg-warning-200
+            text-warning-900;
     }
 
     .badge-blue {
@@ -80,12 +80,12 @@ button {
     }
 
     .badge-green {
-        @apply bg-green_r-5
-            text-green_r-10;
+        @apply bg-success-100
+            text-success-600;
     }
 
     .badge-solid-green {
-        @apply bg-green_r-10
+        @apply bg-success-500
             text-white;
     }
 
@@ -105,20 +105,19 @@ button {
             w-full
             leading-none
             focus:outline-none
-            focus:border-yellow_r-9
+            focus:border-warning-500
             disabled:bg-gray_r-5;
     }
 
     .form-input[aria-invalid] {
-        @apply border-red_r-10
-            focus:border-red_r-10;
+        @apply border-danger-500
+            focus:border-danger-500;
     }
 
     .btn-yellow,
     .btn-light,
     .btn-red,
-    .btn-solid-red,
-    .btn-green {
+    .btn-solid-red {
         @apply block
             w-fit
             py-3
@@ -132,37 +131,29 @@ button {
     }
 
     .btn-yellow {
-        @apply bg-yellow_r-9
-            border-yellow_r-9
-            hover:bg-yellow_r-10
+        @apply bg-warning-500
+            border-warning-500
+            hover:bg-warning-600
             disabled:text-gray_r-10
-            disabled:bg-yellow_r-7
-            disabled:border-yellow_r-7;
+            disabled:bg-warning-200
+            disabled:border-warning-200;
     }
 
     .btn-red {
-        @apply bg-red_r-3
-            border-red_r-6
-            text-red_r-11
-            disabled:text-red_r-10
-            disabled:bg-red_r-6;
+        @apply bg-danger-100
+            border-danger-300
+            text-danger-500
+            disabled:text-danger-400
+            disabled:bg-danger-200;
     }
 
     .btn-solid-red {
-        @apply bg-red_r-11
-            border-red_r-11
+        @apply bg-danger-500
+            border-danger-500
             text-gray_r-1
             disabled:text-gray_r-1
-            disabled:bg-red_r-8
-            disabled:border-red_r-8;
-    }
-
-    .btn-green {
-        @apply bg-green_r-3
-            border-green_r-6
-            text-green_r-11
-            disabled:text-green_r-10
-            disabled:bg-green_r-6;
+            disabled:bg-danger-200
+            disabled:border-danger-200;
     }
 
     .btn-light {
@@ -333,7 +324,7 @@ button {
 }
 
 .swiper-pagination-bullet-active {
-    @apply !bg-red_r-11;
+    @apply !bg-danger-500;
 }
 
 .pagination {
@@ -359,8 +350,9 @@ button {
 }
 
 .pagination-item--active {
-    @apply border-yellow_r-9
-        bg-yellow_r-9;
+    @apply border-warning-500
+        bg-warning-500
+        hover:bg-warning-500;
 }
 
 .pagination-dots {
@@ -391,7 +383,7 @@ button {
 }
 
 .form-select__control--menu-is-open {
-    @apply !border-yellow_r-9;
+    @apply !border-warning-500;
 }
 
 .table-specification {
@@ -492,7 +484,7 @@ button {
         gap-x-2
         p-4
         items-center
-        bg-red_r-11
+        bg-danger-500
         font-medium
         !text-gray_r-1
         rounded-none
@@ -594,7 +586,7 @@ button {
 
 .category-mega-box__child-one {
     @apply text-gray_r-12/80 
-        hover:text-red_r-11 
+        hover:text-danger-500 
         transition-colors 
         ease-linear 
         duration-100 
@@ -603,7 +595,7 @@ button {
 
 .category-mega-box__child-two {
     @apply text-gray_r-12/80 
-        hover:text-red_r-11 
+        hover:text-danger-500 
         transition-colors 
         ease-linear 
         duration-100 
-- 
cgit v1.2.3


From 4b25b3e36c459b34f075550ca6e61b1d8f2643ce Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Sat, 8 Apr 2023 13:33:57 +0700
Subject: fix

---
 .../components/elements/Navbar/NavbarDesktop.jsx   | 141 ++++++++++-----------
 src/lib/cart/api/CartApi.js                        |   2 +-
 src/lib/product/api/productApi.js                  |   2 +-
 src/styles/globals.css                             |   3 +-
 4 files changed, 74 insertions(+), 74 deletions(-)

(limited to 'src')

diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index 0bc9e967..fcb54802 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -41,7 +41,7 @@ const NavbarDesktop = () => {
         </div>
       </div>
 
-      <nav className='py-6 sticky top-0 z-50 bg-white border-b border-gray_r-6'>
+      <nav className='pt-6 sticky top-0 z-50 bg-white border-b-2 border-danger-500'>
         <div className='container mx-auto flex gap-x-6'>
           <Link href='/'>
             <Image src={IndoteknikLogo} alt='Indoteknik Logo' width={210} height={210 / 3} />
@@ -52,7 +52,7 @@ const NavbarDesktop = () => {
           <div className='flex gap-x-4'>
             <Link href='/my/transactions' className='flex items-center gap-x-2 !text-gray_r-12/80'>
               <DocumentCheckIcon className='w-7' />
-              Pending
+              Daftar
               <br />
               Quotation
             </Link>
@@ -80,81 +80,80 @@ const NavbarDesktop = () => {
             </a>
           </div>
         </div>
-      </nav>
-
-      <div className='container mx-auto mt-6'>
-        <div className='flex bg-gray_r-2'>
-          <button
-            type='button'
-            onClick={() => setIsOpenCategory((isOpen) => !isOpen)}
-            onBlur={() => setIsOpenCategory(false)}
-            className='w-3/12 p-4 font-semibold border border-gray_r-6 rounded-tl-xl flex items-center relative'
-          >
-            <div>Kategori Produk</div>
-            <ChevronDownIcon className={`ml-auto w-6 ${isOpenCategory ? 'rotate-180' : ''}`} />
+        <div className='container mx-auto mt-6'>
+          <div className='flex'>
+            <button
+              type='button'
+              onClick={() => setIsOpenCategory((isOpen) => !isOpen)}
+              onBlur={() => setIsOpenCategory(false)}
+              className='w-3/12 p-4 font-semibold border border-gray_r-6 rounded-t-xl flex items-center relative'
+            >
+              <div>Kategori Produk</div>
+              <ChevronDownIcon className={`ml-auto w-6 ${isOpenCategory ? 'rotate-180' : ''}`} />
 
-            <div className={`category-mega-box-wrapper ${isOpenCategory ? 'show' : ''}`}>
-              <Category />
+              <div className={`category-mega-box-wrapper ${isOpenCategory ? 'show' : ''}`}>
+                <Category />
+              </div>
+            </button>
+            <div className='w-6/12 flex px-1 divide-x divide-gray_r-6'>
+              <Link
+                href='/shop/brands'
+                className='p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition'
+              >
+                Semua Brand
+              </Link>
+              <Link
+                href='/shop/search?orderBy=stock'
+                className='p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition'
+              >
+                Ready Stock
+              </Link>
+              <Link
+                href='/blog'
+                className='p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition'
+              >
+                Blog Indoteknik
+              </Link>
+              <Link
+                href='/video'
+                className='p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition'
+              >
+                Indoteknik TV
+              </Link>
             </div>
-          </button>
-          <div className='w-6/12 flex gap-x-1 px-1 bg-gray_r-1'>
-            <Link
-              href='/shop/brands'
-              className='p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 bg-gray_r-2 hover:bg-gray_r-4 border border-gray_r-6 idt-transition'
-            >
-              Semua Brand
-            </Link>
-            <Link
-              href='/shop/search?orderBy=stock'
-              className='p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 bg-gray_r-2 hover:bg-gray_r-4 border border-gray_r-6 idt-transition'
-            >
-              Ready Stock
-            </Link>
-            <Link
-              href='/blog'
-              className='p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 bg-gray_r-2 hover:bg-gray_r-4 border border-gray_r-6 idt-transition'
-            >
-              Blog Indoteknik
-            </Link>
-            <Link
-              href='/video'
-              className='p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 bg-gray_r-2 hover:bg-gray_r-4 border border-gray_r-6 idt-transition'
-            >
-              Indoteknik TV
-            </Link>
-          </div>
 
-          <div className='w-3/12 flex gap-x-1 relative'>
-            {!auth && (
-              <>
-                <Link
-                  href='/login'
-                  className='flex-1 flex justify-center items-center bg-danger-500 !text-gray_r-1 rounded-none'
-                >
-                  Masuk
-                </Link>
-                <Link
-                  href='/register'
-                  className='flex-1 flex justify-center items-center bg-danger-500 !text-gray_r-1 rounded-none rounded-tr-xl'
-                >
-                  Daftar
-                </Link>
-              </>
-            )}
-            {auth && (
-              <>
-                <div href='/' className='navbar-user-dropdown-button'>
-                  <span>Halo, {auth?.name}</span>
-                  <div className='ml-auto'>
-                    <ChevronDownIcon className='w-6' />
+            <div className='w-3/12 flex gap-x-1 relative'>
+              {!auth && (
+                <>
+                  <Link
+                    href='/login'
+                    className='flex-1 flex justify-center items-center bg-danger-500 !text-gray_r-1 rounded-none rounded-t-xl'
+                  >
+                    Masuk
+                  </Link>
+                  <Link
+                    href='/register'
+                    className='flex-1 flex justify-center items-center bg-danger-500 !text-gray_r-1 rounded-none rounded-t-xl'
+                  >
+                    Daftar
+                  </Link>
+                </>
+              )}
+              {auth && (
+                <>
+                  <div href='/' className='navbar-user-dropdown-button'>
+                    <span>Halo, {auth?.name}</span>
+                    <div className='ml-auto'>
+                      <ChevronDownIcon className='w-6' />
+                    </div>
                   </div>
-                </div>
-                <NavbarUserDropdown />
-              </>
-            )}
+                  <NavbarUserDropdown />
+                </>
+              )}
+            </div>
           </div>
         </div>
-      </div>
+      </nav>
     </DesktopView>
   )
 }
diff --git a/src/lib/cart/api/CartApi.js b/src/lib/cart/api/CartApi.js
index 33b61891..7683a935 100644
--- a/src/lib/cart/api/CartApi.js
+++ b/src/lib/cart/api/CartApi.js
@@ -2,7 +2,7 @@ import odooApi from '@/core/api/odooApi'
 
 const CartApi = async ({ variantIds }) => {
   if (variantIds) {
-    const dataCart = await odooApi('GET', `/api/v1/product_variant/${variantIds}`)
+    const dataCart = await odooApi('GET', `/api/v2/product_variant/${variantIds}`)
     return dataCart
   }
   return null
diff --git a/src/lib/product/api/productApi.js b/src/lib/product/api/productApi.js
index 4fe4cd7d..8156d1ec 100644
--- a/src/lib/product/api/productApi.js
+++ b/src/lib/product/api/productApi.js
@@ -2,7 +2,7 @@ import odooApi from '@/core/api/odooApi'
 
 const productApi = async ({ id }) => {
   if (!id) return
-  const dataProduct = await odooApi('GET', `/api/v1/product/${id}`)
+  const dataProduct = await odooApi('GET', `/api/v2/product/${id}`)
   return dataProduct
 }
 
diff --git a/src/styles/globals.css b/src/styles/globals.css
index d27913a2..551ff057 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -151,6 +151,7 @@ button {
         @apply bg-danger-500
             border-danger-500
             text-gray_r-1
+            hover:bg-danger-600
             disabled:text-gray_r-1
             disabled:bg-danger-200
             disabled:border-danger-200;
@@ -488,7 +489,7 @@ button {
         font-medium
         !text-gray_r-1
         rounded-none
-        rounded-tr-xl;
+        rounded-t-xl;
 }
 
 .navbar-user-dropdown-button span {
-- 
cgit v1.2.3