Improve project overview UI - title row

What does this MR do?

• Sets avatar, project title, visibility level, license, and tags on the same line
• In case of wrapping, the project metadata (visibility, license, tags) goes to a second line

Are there points in the code the reviewer needs to double check?

Not yet 😄

Why was this MR needed?

See #44704 (closed)

Screenshots (if relevant)

Responsive GIF, Short Title

Responsive GIF, Long Title

Does this MR meet the acceptance criteria?

• Documentation created/updated
• API support added
• Tests added for this feature/bug
• Conforms to the code review guidelines
  • Has been reviewed by a UX Designer
  • Has been reviewed by a Frontend maintainer
  • Has been reviewed by a Backend maintainer
• Conforms to the merge request performance guidelines
• Conforms to the style guides
• Conforms to the database guides
• If you have multiple commits, please combine them into a few logically organized commits by squashing them
• Internationalization required/considered
• End-to-end tests pass (package-and-qa manual pipeline job)

What are the relevant issue numbers?

Closes #44704 (closed)