[FOLLOW-UP] Issues and visual adjustments to chat split view

[nimishavijay]

How to use GitHub

• Please use the 👍 reaction to show that you are interested into the same feature.
• Please don't comment if you have no relevant information to add. It's just extra noise for everyone subscribed to this issue.
• Subscribe to receive notifications on status change and new comments.

---

Noticed issues:

• [SPLIT VIEW] Message buttons bar should show up on hover bigger area #16413
• [SPLIT VIEW] No reserved space for new reaction in small split view #16414
• [SPLIT VIEW] Jump when short messages are sent #16594
• broken styles for shared files (esp. voice messages)
• broken styles for markdown (esp. tables)
• fix(settings): keep classic chat style for older server versions #16693

Design follow-ups:

Before	After

Small adjustments which make the split view look more cohesive:

• Add more spacing between messages of different authors
• Align avatar to author name
• reduce size of author name
• align avatar of own messages to message container
• Add more gap between message text and reactions row

In the inspector here are the changes I made to achieve the "After" screenshot

.wrapper.incoming .messages__avatar-wrapper {
  padding-block-start: calc(3*var(--default-grid-baseline)); }

.wrapper {
  padding: calc(2*var(--default-grid-baseline)) 0; }

.messages__author {
  font-size: small; }

.wrapper.outgoing .messages__avatar-wrapper {
  padding-block-start: calc(2*var(--default-grid-baseline)); }

.message-main--sided:has(.message-main__text):not(.message-main--compressed) .message-actions {
  padding-top: var(--default-grid-baseline); }

[Antreesy]

Converting this issue to a general follow-up