RocketChat / RocketChat/Rocket.Chat
Long Button Text Overflows and Causes Misalignment in User Info
Open
Nobody has claimed this yet.
planned
- Dominant language
- TypeScript
- Stars
- 46.1k
- Forks
- 13.9k
- Avg merge
- 3d 3h
- Merged PRs (30d)
- 130
Description
In Admin Mode, the action buttons (e.g., "Direct Message," "Set as Owner," "Set as Leader") display layout issues when the text inside the buttons is longer (2-3 words). The text overflows and gets cut off, making it partially hidden behind the button borders.
Description:
Steps to reproduce:
- Open a channel
- click to any member username
- See full profile
Expected behavior:
Actual behavior:
Server Setup Information:
- Version of Rocket.Chat Server: 7.1.0-develop
- License Type:
- Number of Users: 4
- Operating System: ubuntu
- Deployment Method: development
- Number of Running Instances:
- DB Replicaset Oplog:
- NodeJS Version: 20.18.0
- MongoDB Version:
Client Setup Information
- Desktop App or Browser Version: firefox
- Operating System: ubuntu-24
Additional context
Relevant logs:
Also for mobile or smaller devices it does not fit.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the issue by opening a channel, selecting a member username, and viewing the full profile in Admin Mode, including a smaller device or viewport. Inspect the action buttons such as “Direct Message,” “Set as Owner,” and “Set as Leader”; done means their text is fully visible and the layout remains aligned at the reported desktop and mobile sizes.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100