fix: responsive versioned dropdown

[fykaa]

added version width and title

---

fixed dropdown component
before:

after:

[netlify]

✅ Deploy Preview for docs-kargo-io ready!

Name	Link
🔨 Latest commit	b64796c
🔍 Latest deploy log	https://app.netlify.com/sites/docs-kargo-io/deploys/6788f7f0ff22550008e72216
😎 Deploy Preview	https://deploy-preview-3292.docs.kargo.io
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[hiddeco]

I wonder if it would not be more useful to display a version for the "latest" version as well, or to at least mention which version is the latest, i.e. Latest version (v1.2.0). The advantage of this is that if someone knows they are on Kargo v1.1.0, they can then automatically tell they are not on latest.

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 52.05%. Comparing base (03632de) to head (b64796c).

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #3292   +/-   ##
=======================================
  Coverage   52.05%   52.05%           
=======================================
  Files         295      295           
  Lines       26695    26695           
=======================================
  Hits        13895    13895           
  Misses      12041    12041           
  Partials      759      759           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[krancour]

I wonder if it would not be more useful to display a version for the "latest" version as well, or to at least mention which version is the latest, i.e. Latest version (v1.2.0). The advantage of this is that if someone knows they are on Kargo v1.1.0, they can then automatically tell they are not on latest.

Well... this is a bit complicated because I'm not sure we have any reasonable way to infer what branch docs.kargo.io currently points at. If we tried do something like take a guess that it points at the semantically greatest release-x.y branch, we'd end up being wrong anytime a release branch exists for an upcoming release. Two days ago, such a heuristic would have shown 1.1 docs and told people they were looking at 1.2.

But I agree that it would be nice as long as we had a reasonable way to approach it. I think we should put a pin in this and come back to it when we have the luxury of time. I wouldn't want it to block the modest styling improvements in this PR.

[krancour]

@fykaa this still doesn't look quite right on mobile...

[fykaa]

this still doesn't look quite right on mobile...

@krancour I gave the dropdown a fixed width on purpose because a dynamic width didn't seem appropriate for select dropdown.
This dropdown will mostly contain options like v1.21.41, Latest Version, or Edge Version, and this size works best for those. For any unrecognized versions, I’ve added a tooltip that displays the full version when hovered over, ensuring users can still see the actual version information for those cases.

[hiddeco]

Should the version in the mobile sidebar be either at the top or the very bottom of the menu?

[fykaa]

Should the version in the mobile sidebar be either at the top or the very bottom of the menu?

UPDATE: @hiddeco addressed this here b64796c ✅