Bug: text overflow in forked from text

[suvanbanerjee]

Describe the bug
Whenever the text overflows in branch name commit name or forked from text the mobile site don't handles it properly

To Reproduce
Steps to reproduce the behavior:

1. Go to https://github.com/Realme-Moon-Development/android_kernel_realme_moon on mobile device or layout

Expected behavior
The text should wrap or hidden

Screenshots

Smartphone (please complete the following information):

• Device: Realme Narzo 30A
• OS: Android 12
• Browser: Brave
• Version: 1.70.119

Additional context
None

[Sanjai451]

I have reviewed the problem. Can I get assigned to work on this project?

[mperrotti]

@sunnyi101 - I suspect this was fixed when we rewrote this component's styles to be written in CSS Modules instead of styled-components. I can only reproduce this as a logged out user, so the feature flag to use CSS Modules would not be set. When I'm logged in, the text overflow behaves as expected - it wraps and does not truncate.

I'd advise against truncating because it may be an accessibility violation if we don't make the full text available.

Some user interface components that function as a label and require activation by the user to access content are not wide enough to accommodate the label's content. For example, in Web mail applications the subject column may not be wide enough to accommodate every possible subject header, but activating the subject header takes the user to the full message with the full subject header. In Web-based spreadsheets, cell content that is too long to be displayed in a column can be truncated, and the full content of the cell is available to the user when the cell receives focus. The content of a user interface component may also become too wide in user interfaces where the user can resize the column width. In this type of user interface component, line wrapping is not required; truncation is acceptable if the component's full content is available on focus or after user activation and an indication that this information can be accessed, is provided to the user in some way besides the fact that it is truncated.

— from WCAG SC 1.14

---

@sunnyi101 - you can close this issue if we're ok with waiting until we fully ship the CSS Modules work without a feature flag.

[suvanbanerjee]

@sunnyi101 @mperrotti

The issue is fixed in forked from text but still exist in the branch is 728661 commit ahead text and the box below with text with branch name