Как уменьшить расстояние между слайдами в slick-slide?

Question

[Jack]

Здравствуйте! Кто-то может помочь через инспектор кода или на глаз?
На этой странице: https://test.raccoon-web.com/ есть слайдер с увеличением центральной картинки.
Картинки уменьшены через transform: scale(0.5), а центральная становится transform: scale(1)
Подскажите, пожалуйста, как уменьшить расстояние между слайдами? чтоб выводилось 3 на экране? Вот так:

Answer 1

[igumenov]

нужно прописать
transform-origin: left center; //для правого слайда
transform-origin: right center; //для левого слайда

Comments

[Jack]

решение дельное, но нельзя угадать какие слайды слева, а какие справа, slick их сам расставляет и еще клонирует

[igumenov]

Jack, тогда нужно уже через js обновлять классы некие

Answer 2

[alex-1917]

Держи - https://codepen.io/kelss/pen/MGxgrO

.slick-slide {
	transform: scale(1);
	//opacity: .5;
	transition: .3s ease-in-out all;
}
.slick-slide.slick-center {
	opacity: 1;
	transform: scale(1.08);
}

$('.slider').slick({
	//dots: true,
	infinite: true,
	centerMode: true,
	centerPadding: '12%',
	slidesToShow: 3,
	speed: 500,
responsive: [{

      breakpoint: 992,
      settings: {
        slidesToShow: 1
      }

    }]
});

Comments

[Jack]

Спасибо!