Как задать кастомное поведение dots в Slick Slider?

Question

[Shine_97]

Как сделать вот такое поведение точек?
Изображение №1

Изображение №2

Что надо добавить, чтобы следующему элементу после активного вешался другой класс у которого ш-6px и в-6px? Или чтобы всегда центральные точки были большего размера? Вот ссылка на CodePen того, что есть сейчас.

Answer 1

[0xD34F]

.slick-dots li > button {
  width: 8px;
  height: 8px;
}

.slick-dots li.slick-active > button {
  width: 20px;
  height: 20px;
}

.slick-dots li.slick-active + li > button {
  width: 14px;
  height: 14px;
}

Comments

[Shine_97]

Спасибо большое! Удачи и успехов! :)