Page MenuHomePhabricator

Long URLs (=without linebreaks) increase the width of the File History's "Comments" table cell, so that some browser zoom out a lot
Open, Needs TriagePublic

Description

Currently, when a long URL is included in an upload comment, the URL causes some devices (such as mine; my device is an iPad Pro on the latest iPadOS, and the browser being Safari using desktop mode) to dramatically zoom out in order to fit the entire URL within the limited space of the screen. Would it not be at all possible to implement something similar to what is described in this CSS Tricks article to prevent this from happening and to wrap the URL?

https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/

Event Timeline

Reedy added a subscriber: Reedy.

Where are you seeing this?

In the "File history" comments on a File page?

Yes, I can attach a screenshot of what I'm seeing if that helps?

Aklapper renamed this task from Long URLs overflow the container of upload comments to Long URLs (=without linebreaks) increase the width of the File History's "Comments" table cell, so that some browser zoom out a lot.Dec 22 2020, 11:01 PM

This is not a breaking out of container problem however. It's a "desktop site used on mobile" problem. For desktop sites, the mobile browsers emulate a larger screen. If the content is asking for more width, it will provide you more width (up to a maximum) and/or shrink other content. Since here a lot of width is requested, you will see the page at its maximum zoomed out level, with the maximum amount of width.

There is no real fix for this, other than making the desktop site properly responsive, which will likely upset lots of community members.

@TheDJ would it not be OK to simply wrap the text in word-wrap: break-word; in order to solve this?

Edit: note that the User column already appears to do this. See here

@TheDJ might it perhaps be possible to contain the Comment column with the same formatting as the User column?

@AlbanGeller yes you can, but as it says, it will break words. any words, so people might complain that words get broken at unexpected places for them.. it's a trade off

@TheDJ can we at least trial it out? Nobody has complained yet and if anyone does, it can be rolled back easily.

@Aklapper @Reedy any thoughts on whether such a fix (see above) would be doable?

See previous comments in this task

Tt can easily be trialed by the Commons community, by adding it to Commons' MediaWiki:Filepage.css

@TheDJ thanks for letting me know this. I'll make an edit request, but I'm not sure what specific code I should request?

This comment was removed by AlbanGeller.

Tt can easily be trialed by the Commons community, by adding it to Commons' MediaWiki:Filepage.css

@TheDJ can you please clarify? How can this be trialled?

@AlbanGeller I mean make an editrequest Common's MediaWiki:Filepage.css to have the following css added to it:

.filehistory td:nth-child(6) {
    word-break: break-word;
    min-width: 10em;
}

The min-width is needed to make sure the column doesn't become 1 letter wide and completely unreadable.