How can I add linear-gradient on slick-track level?

[fzn0x]

Hi @akiran thanks for maintaining this amazing open source, I would like to ask you or other contributors, how can I add linear-gradient on slick-track level?

I'm using the slider to capture the expected result below:

Instead on slider level, i want the linear-gradient above the slider, from what I inspect, it is the slide-track element that was above the slides, I already modify the slick-track CSS but somehow it messed up other styles.

Thanks!

[fzn0x]

Why not use the gradient on slider? This is what happen, we need the gradient on the parent element, which is slide-track, or maybe other?

[fzn0x]

Solved by adding new parent with pointer-events: none;

.SliderViewPortGradient {
  width: 100%;
  aspect-ratio: 9/3;
  height: 100%;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.9) 100%);
  position: absolute;
  z-index: 100;
  pointer-events: none; /* Add this line to allow pointer events to pass through */
}