src/shared/ui/modal/modal.module.scss

@@ -10,6 +10,7 @@
   align-items: center;
   background: rgba(0, 0, 0, 0.5);
   padding: 0;
+  animation: fadeIn ease 0.3s;
 
   @include iftablet {
     position: fixed;
@@ -20,7 +21,6 @@
   @include iflaptop {
     padding: 0 rem(48px);
   }
-  animation: fadeIn ease 0.3s;
 
   &_open {
     animation: fadeOut ease 0.3s;

src/views/home/ui/license/license.tsx

@@ -3,6 +3,8 @@ import { Mark } from '@shared/ui';
 import { LicenseForm, LicenseSlider } from '@/widgets';
 
 import emptyPaper from '@public/svg/empty-paper.svg';
+import mcsLicense from '@public/images/license-mcs.jpg';
+import eacLicense from '@public/images/license-dtr-eac.png';
 
 export default function License() {
   return (
@@ -20,21 +22,21 @@ const slides = [
   {
     id: '0',
     name: '',
-    image: emptyPaper,
+    image: eacLicense,
   },
   {
     id: '1',
     name: '',
-    image: emptyPaper,
+    image: mcsLicense,
-  },
-  {
-    id: '2',
-    name: '',
-    image: emptyPaper,
-  },
-  {
-    id: '3',
-    name: '',
-    image: emptyPaper,
   },
+  // {
+  //   id: '2',
+  //   name: '',
+  //   image: emptyPaper,
+  // },
+  // {
+  //   id: '3',
+  //   name: '',
+  //   image: emptyPaper,
+  // },
 ];

src/views/home/ui/main/main.tsx

@@ -1,15 +1,13 @@
 import s from './main.module.scss';
 
 import Image from 'next/image';
-import { Button } from '@shared/ui';
 import { ConsultationOrder } from '@/entities/home/consultation-order';
+import { CallbackOrder } from '@/entities/home/callback-order';
 
 import bgStart from '@public/images/bg-start-desktop.jpg';
 import logo from '@public/images/dtr-logo.png';
 import waIcon from '@public/svg/whatsapp.svg';
 import emailIcon from '@public/svg/email-icon.svg';
-import callBtn from '@public/svg/phone-calling.svg';
-import { CallbackOrder } from '@/entities/home/callback-order';
 
 export default function Main() {
   return (

src/widgets/license-slider/styles.module.scss

@@ -3,7 +3,7 @@
   flex-direction: row;
   justify-content: space-between;
   margin-bottom: rem(40px);
-  padding: 0 rem(20px) 0;
+  padding: 0 rem(20px) 0!important;
 
   @include iftablet {
     padding: unset;
@@ -15,6 +15,14 @@
 }
 
 .Slide {
-  cursor: pointer;
+  display: flex!important;
-  width: 100%;
+  justify-content: center;
+
+  .Image {
+    cursor: pointer;
+    width: auto;
+    height: rem(400px);
+    display: flex;
+    align-items: center;
+  }
 }

src/widgets/license-slider/ui.tsx

@@ -32,11 +32,11 @@ const swiperBreakpoints = {
     spaceBetween: 30,
   },
   1024: {
-    slidesPerView: 3,
+    slidesPerView: 2,
     spaceBetween: 30,
   },
   1440: {
-    slidesPerView: 3,
+    slidesPerView: 2,
     spaceBetween: 30,
   },
 };
@@ -47,13 +47,11 @@ export default function Ui({ className, images }: LicenseSliderProps) {
       className={clsx(s.Slider, className)}
       modules={[Grid]}
       breakpoints={swiperBreakpoints}
-      // onSlideChange={() => console.log('slide change')}
-      // onSwiper={(swiper) => console.log(swiper)}
     >
       {images.map(({ id, name, image }) => (
-        <SwiperSlide key={id}>
+        <SwiperSlide key={id} className={s.Slide}>
           <a href={mockFullSizeImage} target='_blank'>
-            <Image className={s.Slide} src={image} alt={name} />
+            <Image className={s.Image} src={image} alt={name} quality={75} />
           </a>
         </SwiperSlide>
       ))}