[Enhancement] Range is hard to use because of narrowed clickable surface

[ddahan]

I noticed that in practice, it's pretty hard hard to use a range because the clickable space is only the height of the bar. I illustrate this in the example below where only the red part is clickable:

I suggest increasing the clickable height, to the height of the selector, something like:

I noticed some other libraries do this too.

Thanks.

[benjamincanac]

Not sure what to do about this, I don't really want it to look like daisyUI. What would you suggest?

[ddahan]

My suggestion is not about changing the look at all, which is already perfect to me.
I just suggested to increase the clickable space to make it more easy to click.

To be honest I don't know how to do that, but I pointed to the daisyUI example to show it's possible, since they do it. As shown below in the screenshot, the pointer appears without hovering the thin gray bar.

Do you think it's hard to do?

[benjamincanac]

I've tried something, let me know if this works for you!

[ddahan]

@benjamincanac how can I test it? I installed the latest edge version but did not see any change.

[benjamincanac]

You can check the Vercel preview: https://ui-qvqrn13kn-nuxtlabs.vercel.app/forms/range

[ddahan]

@benjamincanac Yep it's way better! Thanks!