Add padding to guides categories and fix layout on phones

[mabartos]

• Use flex to fix layout on phones
• Use gap for padding for the version selector and categories list
• Minimal width for the version selector as on smaller screens, it was shrinked
• Smaller font size on the secondary navbar as shown in the bootstrap example: https://getbootstrap.com/docs/5.3/examples/offcanvas-navbar/

OLD

Screencast.From.2026-03-16.10-38-50.mp4

NEW

Screencast.From.2026-03-18.10-30-47.mp4

@shawkins @vmuzikar I believe this might be a minimal fix for the layout on phones and the gap... Later, we can discuss this follow-up:

• converting guide categories to a drop down #700

WDYT?

[shawkins]

I'm fine with this change. I may have misunderstood the original complaint about how things looked - I thought the concern was more about having the categories on multiple lines.

[mabartos]

@shawkins Yes, the concern was about the single line - I thought that we could live with it and just make things nicer...

But, I moved a little bit further and make more changes to be also ~compliant with Bootstrap and secondary navbars. Please take a look.

[shawkins]

Still looks good. I do prefer having the drop down for categories - especially on mobile.

[mabartos]

I do prefer having the drop down for categories - especially on mobile.

Yes, on the mobile, it'd really help.