Pinned message drawer is visually indifferentiable from normal messages

[HarHarLinks]

Is your suggestion related to a problem? Please describe.

Message pinning is currently a labs feature, however it has become somewhat usable more or less recently.
The pinned message drawer is visually almost indistinguishable from the normal chat. It is the same size and at least in dark mode uses the same background color. There are no borders. The scrollbar's lower limit isn't indicated. Only the message layout itself is slightly different (but also needs further work to be pretty). The drawer title text "Pinned Messages" should stay on screen while scrolling.

Describe the solution you'd like.

• draw clear borders to indicate what is the drawer
  • this automatically also hints at how far you can scroll
• don't scroll the panel title
• improve the pinned messages layout incl sender name, always display date, don't stick right up to the panel border....
• similar UX to search, including where you can click and what happens when you do click
• auto-close after clicking jump to(?)

Describe alternatives you've considered.

Looking at discord, they do a lot of these things, but i don't like the very narrow popup bubble approach.

Additional context

Version information

• Platform: desktop

For the desktop app:

• OS: Arch
• Version: aur/element-desktop-nightly-bin 2021050701-1