feat: Enhance Language Picker UX for improved discoverability and clarity

[Anish-Gupta1]

Description

This PR optimizes the language picker for better user experience, as detailed in the Figma proposal.

Key Changes:

Removed "Browser" tag from UI (functionality retained).
Alphabetical language sorting for easier discovery.
Added localized messages to promote translation efforts based on browser language.

Related Issue

Closes: #15488

[netlify]

✅ Deploy Preview for ethereumorg ready!

Name	Link
🔨 Latest commit	8b78c62
🔍 Latest deploy log	https://app.netlify.com/projects/ethereumorg/deploys/68758c0721456200080ff026
😎 Deploy Preview	https://deploy-preview-15511--ethereumorg.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	7 paths audited Performance: 52 (🟢 up 4 from production) Accessibility: 94 (no change from production) Best Practices: 92 (no change from production) SEO: 99 (no change from production) PWA: 59 (no change from production) View the detailed breakdown and full score reports

---

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

[konopkja]

Hi @Anish-Gupta1 , overall it looks good except for the button size here.Could you make the height smaller?

[konopkja]

like this

[wackerow]

Hey @konopkja, I patched the button, but I guess I'm unclear on the logic you're desiring here.

You mentioned having this based on browser locale?

Is your desire that IF a user has a non-english browser locale, we show "Translate to " all in English? Else... not show this footer?

[konopkja]

Hey @konopkja, I patched the button, but I guess I'm unclear on the logic you're desiring here.

You mentioned having this based on browser locale?

Is your desire that IF a user has a non-english browser locale, we show "Translate to " all in English? Else... not show this footer?

• we show the banner always (for english locales it will just say "translate ethereum.org")
• if we detect different locale we show variable message for that language (eg - "Translate to Czech")
• in other languages the prompt should be translated eventually

[wackerow]

on it

[wackerow]

@konopkja https://deploy-preview-15511--ethereumorg.netlify.app/ Let me know if this looks like what you're expecting.

[konopkja]

@wackerow visually it looks like as expected but i think we are missing some functionality from it now:

1. order should be alphabetical instead of % translated
2. browser defaults should still be first

[wackerow]

Made them alphabetical.. cc: @konopkja pulling in; please ping if anything looks off and we can patch

[wackerow]

@all-contributors please add @Anish-Gupta1 for code

[allcontributors]

@wackerow

I've put up a pull request to add @Anish-Gupta1! 🎉