Ability to style min/max slider handles differently about react-input-range HOT 6 OPEN

You can do it by using CSS with the first-of-type tag.

.input-range__track .input-range__slider-container:first-of-type .input-range__slider{

from react-input-range.

Ah thanks. Yes, we're doing a similar workaround at the moment.

It would be easier/better to have a single dedicated classname though, since complex selectors and pseudo-classes like :first-of-type etc. are brittle and not resilient to structural DOM changes.

Would be happy to put together a PR. Or else feel free to close, since there are workarounds.

from react-input-range.

True, if we have time to implement it. But I can live with the first-of-type solution for my specific situation.

from react-input-range.

I think passing custom Label and Track components into the main component would accomplish this and any other customization that the users might dream of. I'd like the handles to show the value only when it's being dragged, but, alas, it doesn't seem to be possible currently.

from react-input-range.

i want to be able to use slider one in multiple instances. but when I do so, each slider moves at the same time.

from react-input-range.

It cannot with with first of type, because last clicked handle is a last children.

from react-input-range.