Skip to content

Conversation

@dodaa08
Copy link

@dodaa08 dodaa08 commented Jan 10, 2026

  • Add flex-wrap to message header for proper text wrapping
  • Move system action text to separate line using CSS order
  • Make avatar sizes consistent across all message types
  • Remove conditional avatar sizing for system messages

Brief Title

Improve system message layout and avatar consistency

Acceptance Criteria fulfillment

[x] System message avatars are the same size as regular message avatars (2.25em desktop, 1.5em mobile)
[x] System action text appears on a new line below the username
[x] Username and timestamp remain on the first line
[x] Long action text wraps naturally without truncation

Fixes #1060

Video/Screenshots

Screencast.From.2026-01-11.01-27-37.mp4

PR Test Details

Note: The PR will be ready for live testing at https://rocketchat.github.io/EmbeddedChat/pulls/pr-<pr_number> after approval. Contributors are requested to replace <pr_number> with the actual PR number.

- Add flex-wrap to message header for proper text wrapping
- Move system action text to separate line using CSS order
- Make avatar sizes consistent across all message types
- Remove conditional avatar sizing for system messages
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

System messages have inconsistent avatar sizes and truncated texts on username

1 participant