diff options
| -rw-r--r-- | src/components/products/ProductSlider.js | 2 | ||||
| -rw-r--r-- | src/pages/index.js | 2 | ||||
| -rw-r--r-- | src/styles/globals.css | 6 |
3 files changed, 7 insertions, 3 deletions
diff --git a/src/components/products/ProductSlider.js b/src/components/products/ProductSlider.js index 100d0063..b7c17ecd 100644 --- a/src/components/products/ProductSlider.js +++ b/src/components/products/ProductSlider.js @@ -20,7 +20,7 @@ export default function ProductSlider({ { bannerMode && ( <Image src={products.banner.image} alt={products.banner.name} className={`absolute rounded-r top-0 left-0 h-full max-w-[52%] idt-transition border border-gray_r-6 ` + (activeIndex > 0 ? 'opacity-20' : 'opacity-100')} /> ) } - <Swiper freeMode={true} slidesPerView={2.2} spaceBetween={8} onSlideChange={swiperSliderFirstMove}> + <Swiper freeMode={true} slidesPerView={2.2} spaceBetween={8} onSlideChange={swiperSliderFirstMove} prefix="product"> { bannerMode && ( <SwiperSlide> <Link href={products.banner.url} className="w-full h-full block"></Link> diff --git a/src/pages/index.js b/src/pages/index.js index 5bab4ffe..0f24ebea 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -105,7 +105,7 @@ export default function Home({ heroBanners }) { </div> { categoryProducts?.map((categoryProduct, index) => ( - <div className="my-6 p-4 relative" key={index}> + <div className="my-6 px-4 relative" key={index}> <ProductSlider products={categoryProduct ? { products: categoryProduct.products, diff --git a/src/styles/globals.css b/src/styles/globals.css index 4e593536..f7d70150 100644 --- a/src/styles/globals.css +++ b/src/styles/globals.css @@ -213,7 +213,7 @@ html, body { h-full border border-gray_r-3 - shadow-md + shadow bg-white rounded relative @@ -366,6 +366,10 @@ html, body { @apply hidden; } +.swiper[prefix="product"] { + @apply py-4; +} + .swiper-slide { @apply !h-auto; } |