Improve versions UI/UX/a11y

[alexdln]

• Adjust the left margin of the input so that it is in line with the rest of the content
• Increase the space between the tooltip and the input
• Increase click area for versions dropdown (chevron icon - add more vertical paddings and a bit horizontal with sth like px-1 -mx-1)

[alex-key]

@alexdln Also, probably, add proper cursor state on chevron hover.

[alexdln]

@alex-key For now, for consistency, we're sticking with the default cursor for buttons.

As soon as we come to a different solution, we'll update it everywhere

https://github.com/npmx-dev/npmx.dev/blob/main/CONTRIBUTING.md#cursor-and-navigation

[alex-key]

@alexdln Thankyou for sharing this instructions! Well, it says "A button is any element that operates an action (show tooltip, open menu, "like" package, open dropdown)" and I do not see how this chevron behavior different from dropdown behavior (this one below as an example), which uses pointer

Also "keyboard shorcuts" in the footer looks like a link (and uses pointer), but acts as a button (and it's actually button tag).

[alexdln]

For package manager, yes, there should be a default.

It's hard to tell about the footer, the footer probably needs to be redesigned to make it clear that it's not a link

[alex-key]

For package manager, yes, there should be a default.

It's hard to tell about the footer, the footer probably needs to be redesigned to make it clear that it's not a link

I agree, for me this footer link opening modal was unexpected when I clicked it for the first time