Enhancement: Don't overwrite menu items in select lists in narrow width views

[jennaj]

Describe the bug
Menu items can be written over with the "click to select" message.

Galaxy Version and/or server at which you observed the bug
The Galaxy Server is running version 24.0.3.dev0 , and the web client was built on Tuesday May 14th 7:04:11 2024 GMT-7 .

Browser and Operating System
Operating System: macOS
Browser: Chrome

To Reproduce
Steps to reproduce the behavior:

1. Go into the workflow editor
2. For a tool when choosing options, click into a select menu with a listing
3. Notice the content is written over with default width. The part covered up can be the important part!
4. Expand the width of that panel (if you know how to..): items can still be written over for some cases

Expected behavior
Narrow views: toggle to a context-dependent curser or icon that prompts the user to "click" instead of the longer text message that is covering up the items in the list. Or, could the text be flipped over to the left side? (it could layer over the canvas area, yes? the tool panel part is active)

Screenshots

Default on my browser

Width adjusted some. Yes, this could go a bit wider but is that the best solution?

Additional context
Screenshots are from one of the first tutorials some people might try. 10x scRNA > https://training.galaxyproject.org/training-material/topics/single-cell/tutorials/scrna-preprocessing-tenx/tutorial.html

The workflow requires one tune-up after import. But the experience seems.. not so smooth.

Some kind of toggle to an icon or arrow (?) when space is tight, that doesn't overwrite the menu items, would be nicer.

Please consolidate if this is a known

[ahmedhamidawan]

UI Meeting discussion:

• Replace the text (Click to select/deselect) with an icon ☑/⬛ (bring to front)

[ahmedhamidawan]

Fixed in #18194