Feature/66307 visualize program portfolio and project differently in dropdowns and lists (2/3)

[dombesz]

Ticket

https://community.openproject.org/wp/69445

What are you trying to accomplish?

• Projects list:
  • The name of the projects should be truncated at the end of the modal preserving always visible, if present, the type label and icon.
• Projects dropdown:
  • The name of the projects should be truncated at the end of the modal preserving always visible, if present, the favorite star and the type label.

Screenshots

Project List

What approach did you choose and why?

Use flexbox to keep the badge always displayed.

• [ ] Projects list name shrinking
• [X] ~~Project dropdown name shrinking~~ Already addressed in #21448 .

Merge checklist

• [ ] Added/updated tests
• [ ] Added/updated documentation in Lookbook (patterns, previews, etc)
• [ ] Tested major browsers (Chrome, Firefox, Edge, ...)