Page MenuHomePhabricator

Text overflow in wikimedia.org
Closed, ResolvedPublicBUG REPORT

Assigned To
Authored By
santhosh
Feb 3 2025, 9:21 AM
Referenced Files
F58366354: image.png
Feb 6 2025, 5:22 AM
F58366342: image.png
Feb 6 2025, 5:22 AM
F58366337: image.png
Feb 6 2025, 5:22 AM
F58344944: image.png
Feb 3 2025, 9:21 AM

Description

In the newly designed wikimedia.org website, when accessed from Firefox(v134) with accept-language=ml_IN, I see the following text overflow issue:

image.png (878×1 px, 177 KB)

The space given for the project description assumes that text will fit into one line. But it does not for ml(and for many other languages) and it overflows and overlaps with other items.

Details

Related Objects

StatusSubtypeAssignedTask
ResolvedOTichonova
ResolvedBUG REPORTTheDJ

Event Timeline

Seems the cells are fixed height. I don't think that is needed for any reason. We should be able to correct with removing the heights of .project-name-wrapper, .project-block and .project-wrapper.

At the very least,, they should be min-heights, instead of height.

We changed a bit of spacing. It didn't remove the height (we should) but there should be much more space between cards. Can you check again? https://wikimedia.org/?cache123

It is better now:

image.png (904×1 px, 150 KB)

Even though there is no overlap, note the "Collection" header and description of previous one
image.png (904×1 px, 151 KB)

If we remove the height property for project-block and project-wrapper classes, we can gurantee that cells will take as much height it requires and no overlap. They are flex layouts and automaic height will be assigned.

image.png (905×1 px, 136 KB)

Yes, if you make the patch, I will review it!

Change #1120201 had a related patch set uploaded (by Pcoombe; author: Pcoombe):

[wikimedia/portals@master] Remove heights to avoid project overlapping

https://gerrit.wikimedia.org/r/1120201

Change #1120201 merged by jenkins-bot:

[wikimedia/portals@master] Remove heights to avoid project overlapping

https://gerrit.wikimedia.org/r/1120201

TheDJ claimed this task.

Calling this resolved