Skip to content

[Fix] Long profile names are clipped on mobile - #3631

Open
roomote-roomote[bot] wants to merge 1 commit into
developfrom
fix/profile-mobile-truncation-3e6fs9l1l4lxa
Open

roomote-roomote[bot] wants to merge 1 commit into
developfrom
fix/profile-mobile-truncation-3e6fs9l1l4lxa

Conversation

@roomote-roomote

@roomote-roomote roomote-roomote Bot commented Oct 30, 2026 •

Copy link
Copy Markdown
Contributor

​Opened on behalf of @daniel-lxs. Follow up by mentioning @roomote-roomote, in the web UI, or in Telegram.

Related issue

Scoped visual correction; no linked issue.

Why this PR exists

  • A maintainer explicitly invited this PR in the linked issue or discussion
  • I am a maintainer / this is internal Roomote work

What changed

Long profile names were clipped beyond the Personal settings card on mobile rather than showing the intended ellipsis. One min-w-0 class on the details flex item allows the existing name/email truncation to work within available width.

Why this change was made

The text elements already truncated, but their ancestor retained its intrinsic minimum width. Fix that containment boundary without new controls, wrapping, state or dependencies.

Impact

Long names stay inside the mobile card while fitting names remain fully visible on desktop. Editing, avatar actions and authentication logic are unchanged.

How it was tested

  • Clean develop c97173a7: actual local form Save of “Alexandria Montgomery-Wellington de la Cruz Fernández” produced a name block from x100 to x475.44 on a 390px viewport, clipped outside it.
  • Same genuine Save with this fix at 390×844 ends at x350 (250px layout/375px text) with visible ellipsis. At 1440×1000 the full name fits. Geometry repeated at committed head.
  • Actual Edit exposed the full stored value; modified-draft Cancel retained it. Save restored Local Admin. No email/password or external message changed.
  • Six existing profile tests, web types and normal commit/pre-push gates pass. Hosted tests/build/CodeQL/static/backup/upgrade/Judgement pass/expected-skip at 5ae887a7cb1dec03d67bdc9c9eb9427a6be1e2d7; automated review clean, no unresolved threads.
  • Three final images opened/inspected and independently checked against the identical source. Real local app/development auth/form persistence, no DOM/network mocks. Stills show layout; interactions establish Edit/Cancel/Save. Long-email, dark-theme/all-viewport parity not claimed. No CSS snapshot test or new documentation contract.

Screenshots

Mobile long-name ellipsis, full desktop name, and ordinary profile after restoring the demo name:

Mobile profile with contained long-name ellipsis
Desktop profile with full long name
Desktop profile restored after Save

Related PRs

Checklist

  • The PR title follows the repo convention: [Fix], [Feat], [Improve], [Refactor], [Docs], or [Chore] followed by a user-facing description
  • This PR is small and scoped to one change
  • pnpm lint and pnpm check-types pass locally
  • I added tests or included a clear manual validation note above
  • I removed secrets, tokens, private keys, and customer data from code, logs, and screenshots
  • If this change should appear in the changelog, I ran pnpm changeset

Normal fast static gates were used; formatting-inclusive full commands and a changeset were not run.

@roomote-community

roomote-community Bot commented Oct 30, 2026 •

Copy link
Copy Markdown
Contributor

No code issues found. See session

Reviewed the one-line flex sizing change in context, including the existing name/email truncation, avatar controls, and separate edit form. min-w-0 allows the text column to shrink as intended. Current-head lint, type checking, Knip, and CodeQL checks passed; tests and the app Docker build were still running when checked. No local validation suites were run.

Reviewed 5ae887a

This branch has not been deployed

No deployments
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.

1 participant