expressjs.com icon indicating copy to clipboard operation
expressjs.com copied to clipboard

Language picker: Add identifying feature and remove/fix duplicate nav ids

Open chrisdel101 opened this issue 10 months ago • 4 comments

The language picker needs to be more distinguishable announcing it as a page feature and not just some text. As it is it just looks like text to me. Could be as simple as some kind of border, or fancier with an arrow

Image

Also it has duplicate ids to navbar. These should be replaced, or changed to classes if they are reusing styles.

  • Ids should not be duplicated in a codebase normally
  • it's very confusing to see these navbar and navmenu identifiers inside the picker like this.

chrisdel101 avatar Feb 22 '25 13:02 chrisdel101

Look like these issue are occurring in conjunction with #1780. Closing it for now since it's not appearing in the main branch after all. Will reopen later.

chrisdel101 avatar Feb 22 '25 13:02 chrisdel101

I like the idea of icons next to each language.

carlosstenzel avatar Mar 18 '25 13:03 carlosstenzel

Duplicate ID resolved in PR #1833 for the desktop language picker. The mobile language picker is not resolved because I am doing an accessibility fix there. However, I believe we can use the same component on mobile devices to remove some JS and CSS.

@carlosstenzel , I decided not to add icons in pr #1833 because of system/browsers restrictions. Ofcourse we can use svgs but it is not top priority at the moment.

ShubhamOulkar avatar Mar 21 '25 05:03 ShubhamOulkar

I think I could use SVG and hide it from mobile.

carlosstenzel avatar Mar 21 '25 13:03 carlosstenzel

I suggest using the 🌐 emoji just on the main menu item (top/1st) next to whatever the current language is

ctcpip avatar Jul 07 '25 16:07 ctcpip

I like Chris's idea.

bjohansebas avatar Jul 11 '25 17:07 bjohansebas

Hi @ctcpip, are you suggesting something like this?

Image

OR replacing current down arrow with 🌐 emoji. Since next to current language is a downward arrow for showing popup menu.

next to whatever the current language is

ShubhamOulkar avatar Jul 15 '25 04:07 ShubhamOulkar

See this design

Image

https://expressjsnewdesign.netlify.app/ I did few months back.

ShubhamOulkar avatar Jul 15 '25 05:07 ShubhamOulkar