🚸 Make main grid of categories on homepage more mobile friendly

[joshuadavidthomas]

Is your feature request related to a problem? Please describe.
I find the styling of the main grid of categories on the homepage a bit frustrating to use on mobile. The tap targets of the buttons on the side to scroll the list are so small and right up against the edge of the viewport. This wouldn't be so much of a problem if the list responded to swipe gestures, but it doesn't.

Describe the solution you'd like

1. Increase the padding of the buttons slightly to increase the tap target.
2. Make the grid swipeable. IMO, the simplest and modern solution would be to use CSS and scroll snap (MDN Ref), however that is complicated by the fact the current behavior is using jQuery to get the scroll behavior. I'm sure there's a way to get the current jQuery implementation to take swipe gestures, but it may be worth it to invest the time to rip the jQuery out and convert completely over to the CSS scroll snap approach. Or maybe a mix of the two? 🤷‍♂️

Describe alternatives you've considered
If the search was somehow visible on the mobile layout, I suppose that would alleviate the issue of trying to find a certain category on mobile, but that seems a bit orthogonal to the core of the issue.

Additional context

[joshuadavidthomas]

I just want to add -- I'm more than happy taking this on myself. Not expecting the maintainers to take this on (unless one of them wants to!), it's more I want to open the issue to start the discussion on whether this would be wanted.

[jefftriplett]

I would love to port everything over to Tailwind CSS and fix a lot of these issues. (there's on in progress)

Feel free to fix it if you feel comfortable taking on the mobile buttons, though. I'm happy to step you through setup if you have questions, but you have seen enough of how I set stuff up that it should look familiar.