Slides are overlaping by DOM - Chakra-ui + React-slick

[isabellasantiago]

here's my code example and a video that shows that second slide overlaps the first one (ps: when you pass the cursor where second button its behave as if second button were in screen and it happens because its overlaps the DOM)

Code

React Slick Problem - CodeSandbox.webm

[isabellasantiago]

@akiran can you help?

[akiran]

This issue is the same as #2076

CSS solution suggested by @ guitassinari is working. https://github.com/akiran/react-slick/issues/2076#issuecomment-984815962

.slick-slide:not(.slick-active) {
    pointer-events: none;
}

We will find a permanent fix that doesn't require additional CSS soon.