Custom arrows aren't dispositioned and grayed out

[guyman20]

Checks

• [X] Not a duplicate.
• [X] Not a question, feature request, or anything other than a bug report directly related to Splide. Use Discussions for these topics: https://github.com/Splidejs/splide/discussions

Version

4.1.3

Description

Following the instructions for creating custom arrows isn't working well. The css of the automatically created arrows are applied to my custom arrows, moving them around (by applying them an absolute position) and coloring them in gray.

Reproduction Link

https://codepen.io/guyman20/pen/gOdqPWa?editors=1010

Steps to Reproduce

The base for the codepen was an older version code, I did some minor changes so it might have some bugs, but the point is the custom arrows. As can be seen, they are forced to be in the center of the slider as opposed to above it, and they are forced to have a gray background.

Expected Behaviour

As can be seen, they are forced to be in the center of the slider as opposed to above it, and they are forced to have a gray background.

[kristiansp]

I got it working for me. You might need to check this part of the docs: https://splidejs.com/guides/options/#classes

The short story is that you should add your own custom CSS classes in addition to the Solide classes.