responsive bug fixing

components/pageParts/partners.tsx

@@ -27,40 +27,38 @@ const images: StaticImageData[] = [
 
 export default function Partners() {
   return (
-    <div className="my-5 max-w-[1200px] w-full mx-auto ">
+    <div className="my-5 max-w-[1000px] w-full mx-auto ">
       {/* title */}
       <div className="mb-4">
         <Title text="partner-h2" />
       </div>
 
       {/* slider */}
-      <div className="my-10">
-        <Swiper
-          autoplay={{
-            reverseDirection: true,
-            delay: 2500,
-            disableOnInteraction: false,
-          }}
-          modules={[Autoplay]}
-          slidesPerView={4}
-          breakpoints={{
-            320: { slidesPerView: 1 },
-            640: { slidesPerView: 2 },
-            1024: { slidesPerView: 4 },
-          }}
-          className="mySwiper flex items-center justify-center"
-        >
-          {images.map((item, index) => (
-            <SwiperSlide key={index}>
-              <Image
-                src={item}
-                alt="Partner images"
-                className="w-[200px] h-[200px] object-contain"
-              />
-            </SwiperSlide>
-          ))}
-        </Swiper>
-      </div>
+            <div className="my-20">
+              <Swiper
+                autoplay={{
+                  reverseDirection: true,
+                  delay: 2500,
+                  disableOnInteraction: false,
+                }}
+                loop={true}
+                modules={[Autoplay]}
+                slidesPerView={4}
+                className="mySwiper flex items-center justify-around"
+              >
+                {images.map((item, index) => (
+                  <SwiperSlide key={index} className="!w-[200px] mx-10 " >
+                    <Image
+                      src={item}
+                      alt="Partner images"
+                      width={200}
+                      height={200}
+                      className="object-contain mx-auto max-w-[200px] h-auto"
+                    />
+                  </SwiperSlide>
+                ))}
+              </Swiper>
+            </div>
     </div>
   );
 }