From 364c5e1ff1a4f207fd44692761e303edcd7bf36e Mon Sep 17 00:00:00 2001
From: Ilia Mashkov <hikkikomori7@gmail.com>
Date: Fri, 21 Nov 2025 15:41:57 +0300
Subject: [PATCH] =?UTF-8?q?feature:=20=D0=9D=D0=B0=D1=81=D1=82=D1=80=D0=BE?=
 =?UTF-8?q?=D0=B5=D0=BD=20=D0=B0=D0=B4=D0=B0=D0=BF=D1=82=D0=B8=D0=B2=20?=
 =?UTF-8?q?=D0=B4=D0=BB=D1=8F=20=D0=BA=D0=B0=D1=80=D1=83=D1=81=D0=B5=D0=BB?=
 =?UTF-8?q?=D0=B8=20=D1=81=D0=BE=D0=B1=D1=8B=D1=82=D0=B8=D0=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../EventsCarousel/EventsCarousel.module.scss | 20 +++++++++++++
 .../ui/EventsCarousel/EventsCarousel.tsx      |  1 +
 .../ui/EventsCarousel/constants.ts            | 29 +++++++++++++++----
 3 files changed, 44 insertions(+), 6 deletions(-)

diff --git a/src/widgets/TimeFrameSlider/ui/EventsCarousel/EventsCarousel.module.scss b/src/widgets/TimeFrameSlider/ui/EventsCarousel/EventsCarousel.module.scss
index 68c1485..d968c58 100644
--- a/src/widgets/TimeFrameSlider/ui/EventsCarousel/EventsCarousel.module.scss
+++ b/src/widgets/TimeFrameSlider/ui/EventsCarousel/EventsCarousel.module.scss
@@ -30,4 +30,24 @@
     opacity: 0;
 
     pointer-events: none;
+}
+
+:global(.swiper-slide-next) {
+    transition: opacity 0.3s ease;
+
+    @media (width <=576px) {
+        opacity: 0.4;
+    }
+}
+
+:global(.swiper-slide-prev) {
+    transition: opacity 0.3s ease;
+
+    @media (width <=576px) {
+        opacity: 0.4;
+    }
+}
+
+:global(.swiper-slide-active) {
+    opacity: 1;
 }
\ No newline at end of file
diff --git a/src/widgets/TimeFrameSlider/ui/EventsCarousel/EventsCarousel.tsx b/src/widgets/TimeFrameSlider/ui/EventsCarousel/EventsCarousel.tsx
index f6e7d00..cd12507 100644
--- a/src/widgets/TimeFrameSlider/ui/EventsCarousel/EventsCarousel.tsx
+++ b/src/widgets/TimeFrameSlider/ui/EventsCarousel/EventsCarousel.tsx
@@ -145,6 +145,7 @@ export const EventsCarousel = memo(
 
         <Swiper
           {...EVENT_CAROUSEL_CONFIG}
+          watchSlidesProgress
           onInit={handleSwiperInit}
           onSlideChange={handleSlideChange}
         >
diff --git a/src/widgets/TimeFrameSlider/ui/EventsCarousel/constants.ts b/src/widgets/TimeFrameSlider/ui/EventsCarousel/constants.ts
index b6149e8..7697fff 100644
--- a/src/widgets/TimeFrameSlider/ui/EventsCarousel/constants.ts
+++ b/src/widgets/TimeFrameSlider/ui/EventsCarousel/constants.ts
@@ -1,5 +1,7 @@
 import { Navigation } from 'swiper/modules'
 
+import styles from './EventsCarousel.module.scss'
+
 import type { SwiperOptions } from 'swiper/types'
 
 /**
@@ -7,16 +9,31 @@ import type { SwiperOptions } from 'swiper/types'
  */
 export const EVENT_CAROUSEL_CONFIG: SwiperOptions = {
   modules: [Navigation],
-  spaceBetween: 30,
   slidesPerView: 1.5,
-  breakpoints: {
-    768: {
-      slidesPerView: 3.5,
-    },
-  },
+  spaceBetween: 25,
   navigation: {
     prevEl: '.swiper-button-prev-custom',
     nextEl: '.swiper-button-next-custom',
+    enabled: false,
+  },
+  breakpoints: {
+    576: {
+      slidesPerView: 2,
+    },
+    768: {
+      slidesPerView: 3,
+      navigation: {
+        enabled: true,
+      },
+      spaceBetween: 30,
+    },
+    1440: {
+      slidesPerView: 3,
+      navigation: {
+        enabled: true,
+      },
+      spaceBetween: 80,
+    },
   },
 }