diff options
| author | Rafi Zadanly <rafizadanly@gmail.com> | 2022-11-19 15:00:53 +0700 |
|---|---|---|
| committer | Rafi Zadanly <rafizadanly@gmail.com> | 2022-11-19 15:00:53 +0700 |
| commit | dae5ae9f6c7cd5355caa30ce53f262db696e19e8 (patch) | |
| tree | f5924afbb34d8438aa47096449b493dcd0fd367e | |
| parent | 40bab7be1e0025c7c089e1eac17451ef155a989a (diff) | |
no message
| -rw-r--r-- | src/pages/shop/brands.js | 48 |
1 files changed, 25 insertions, 23 deletions
diff --git a/src/pages/shop/brands.js b/src/pages/shop/brands.js index 499eaf99..00e33f31 100644 --- a/src/pages/shop/brands.js +++ b/src/pages/shop/brands.js @@ -26,29 +26,31 @@ export default function Brands({ initialManufactures }) { return ( <> <Header title='Semua Brand di Indoteknik' /> - <Layout className='p-4' key='/shop/brands'> - <h1>Semua Brand di Indoteknik</h1> - <InfiniteScroll - dataLength={manufactures.length} - next={getMoreManufactures} - hasMore={hasMoreManufacture} - className="grid grid-cols-3 gap-4 mt-4 !overflow-x-hidden" - loader={ - <div className="flex justify-center items-center border border-gray-300 p-1 rounded h-14"> - <Spinner className="w-6 h-6 text-gray-600 fill-gray-900"/> - </div> - } - > - {manufactures?.map((manufacture, index) => ( - manufacture.name ? ( - <Link href={`/shop/brands/${createSlug(manufacture.name, manufacture.id)}`} className="flex justify-center items-center border border-gray-300 p-1 rounded h-16 text-gray-800 text-sm text-center bg-white" key={index}> - {manufacture.logo ? ( - <LazyLoadImage effect="blur" src={manufacture.logo} alt={manufacture.name || ''} className="w-full max-h-full object-contain object-center" /> - ) : manufacture.name} - </Link> - ) : '' - ))} - </InfiniteScroll> + <Layout key='/shop/brands'> + <div className="p-4"> + <h1>Semua Brand di Indoteknik</h1> + <InfiniteScroll + dataLength={manufactures.length} + next={getMoreManufactures} + hasMore={hasMoreManufacture} + className="grid grid-cols-3 gap-4 mt-4 !overflow-x-hidden" + loader={ + <div className="flex justify-center items-center border border-gray-300 p-1 rounded h-14"> + <Spinner className="w-6 h-6 text-gray-600 fill-gray-900"/> + </div> + } + > + {manufactures?.map((manufacture, index) => ( + manufacture.name ? ( + <Link href={`/shop/brands/${createSlug(manufacture.name, manufacture.id)}`} className="flex justify-center items-center border border-gray-300 p-1 rounded h-16 text-gray-800 text-sm text-center bg-white" key={index}> + {manufacture.logo ? ( + <LazyLoadImage effect="blur" src={manufacture.logo} alt={manufacture.name || ''} className="w-full max-h-full object-contain object-center" /> + ) : manufacture.name} + </Link> + ) : '' + ))} + </InfiniteScroll> + </div> </Layout> </> ) |