diff options
| author | Rafi Zadanly <zadanlyr@gmail.com> | 2023-02-06 12:04:30 +0700 |
|---|---|---|
| committer | Rafi Zadanly <zadanlyr@gmail.com> | 2023-02-06 12:04:30 +0700 |
| commit | 620223f151700bbd91a33d32e2a4c29d4c287e9d (patch) | |
| tree | 8151774bc1f595fcc688b376e1e0c710efe3bf2e /src/components | |
| parent | dfff0da443a3e2d92b92c7c1632ca16e1da94e61 (diff) | |
no message
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/elements/ConfirmAlert.js | 6 | ||||
| -rw-r--r-- | src/components/elements/Image.js | 21 | ||||
| -rw-r--r-- | src/components/products/ProductSlider.js | 2 |
3 files changed, 13 insertions, 16 deletions
diff --git a/src/components/elements/ConfirmAlert.js b/src/components/elements/ConfirmAlert.js index 27155011..96f4029d 100644 --- a/src/components/elements/ConfirmAlert.js +++ b/src/components/elements/ConfirmAlert.js @@ -4,6 +4,8 @@ const ConfirmAlert = ({ show, onClose, onSubmit, + closeText, + submitText }) => { return ( <> @@ -14,8 +16,8 @@ const ConfirmAlert = ({ <p className="h2 mb-2">{title}</p> <p className="text-gray_r-11 mb-6">{caption}</p> <div className="flex gap-x-2"> - <button className="flex-1 btn-light" onClick={onClose}>Batal</button> - <button className="flex-1 btn-red" onClick={onSubmit}>Hapus</button> + <button className="flex-1 btn-light" onClick={onClose}>{closeText}</button> + <button className="flex-1 btn-red" onClick={onSubmit}>{submitText}</button> </div> </div> </> diff --git a/src/components/elements/Image.js b/src/components/elements/Image.js index 1fedf61c..8981547a 100644 --- a/src/components/elements/Image.js +++ b/src/components/elements/Image.js @@ -1,18 +1,13 @@ -import NextImage from "next/image"; -import { LazyLoadComponent } from "react-lazy-load-image-component"; +import { LazyLoadImage } from "react-lazy-load-image-component"; +import "react-lazy-load-image-component/src/effects/opacity.css"; export default function Image({ src, alt, className = "" }) { return ( - <LazyLoadComponent> - <div className="w-full h-full flex justify-center items-center"> - <NextImage - src={src || '/images/noimage.jpeg'} - alt={src ? alt : 'Image Not Found - Indoteknik'} - width={1024} - height={1024} - className={className} - /> - </div> - </LazyLoadComponent> + <LazyLoadImage + effect="opacity" + src={src || '/images/noimage.jpeg'} + alt={src ? alt : 'Image Not Found - Indoteknik'} + className={className} + /> ); }
\ No newline at end of file diff --git a/src/components/products/ProductSlider.js b/src/components/products/ProductSlider.js index 6ee31f9b..11fab069 100644 --- a/src/components/products/ProductSlider.js +++ b/src/components/products/ProductSlider.js @@ -19,7 +19,7 @@ export default function ProductSlider({ return ( <> { 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')} /> + <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-10' : 'opacity-100')} /> ) } <Swiper freeMode={true} slidesPerView={2.2} spaceBetween={8} onSlideChange={swiperSliderFirstMove} prefix="product"> { bannerMode && ( |
