diff options
| author | Rafi Zadanly <zadanlyr@gmail.com> | 2023-03-13 16:20:18 +0700 |
|---|---|---|
| committer | Rafi Zadanly <zadanlyr@gmail.com> | 2023-03-13 16:20:18 +0700 |
| commit | 1ef538546c0bdd9351baaed90b837f399584b460 (patch) | |
| tree | 9e0c6c1ab34adecdfcdccf70e2159f219ed217b8 /src/lib/home/components/PreferredBrand.jsx | |
| parent | d26133d39e7d9cd510fdc72d239303f4ba918bdd (diff) | |
category, brand, product popular, product category in desktop home page
Diffstat (limited to 'src/lib/home/components/PreferredBrand.jsx')
| -rw-r--r-- | src/lib/home/components/PreferredBrand.jsx | 21 |
1 files changed, 17 insertions, 4 deletions
diff --git a/src/lib/home/components/PreferredBrand.jsx b/src/lib/home/components/PreferredBrand.jsx index 3df3cdb7..7edd0730 100644 --- a/src/lib/home/components/PreferredBrand.jsx +++ b/src/lib/home/components/PreferredBrand.jsx @@ -2,18 +2,31 @@ import { Swiper, SwiperSlide } from 'swiper/react' import usePreferredBrand from '../hooks/usePreferredBrand' import PreferredBrandSkeleton from './Skeleton/PreferredBrandSkeleton' import BrandCard from '@/lib/brand/components/BrandCard' +import useDevice from '@/core/hooks/useDevice' +import Link from '@/core/components/elements/Link/Link' const PreferredBrand = () => { const { preferredBrands } = usePreferredBrand() + const { isMobile, isDesktop } = useDevice() return ( - <div className='px-4'> - <div className='font-medium mb-4'>Brand Pilihan</div> + <div className='px-4 sm:px-0'> + <div className='flex justify-between items-center mb-4'> + <div className='font-medium sm:text-h-lg'>Brand Pilihan</div> + {isDesktop && ( + <Link + href='/' + className='btn-yellow !text-gray_r-12' + > + Lihat Semua + </Link> + )} + </div> {preferredBrands.isLoading && <PreferredBrandSkeleton />} {!preferredBrands.isLoading && ( <Swiper - slidesPerView={3.5} - spaceBetween={12} + slidesPerView={isMobile ? 3.5 : 7.5} + spaceBetween={isMobile ? 12 : 24} freeMode > {preferredBrands.data?.manufactures.map((brand) => ( |