WordPress.org

Make WordPress Core

Opened 11 months ago

Closed 8 months ago

#50838 closed defect (bug) (fixed)

Width issue on user list table post column

Reported by: justinahinon Owned by: audrasjb
Milestone: 5.6 Priority: normal
Severity: normal Version: 5.4.2
Component: Users Keywords: has-screenshots has-patch commit
Focuses: ui, css, administration Cc:

Description

In WordPress 5.3.1 French version, the translation of "Posts" in the the table heading here /wp-admin/users.php has been changed from "Articles" to "Publications".

This makes the title of this column spread over two lines instead of one (see screenshot). I guess the behavior should be the same for locales where the translation of "Posts" is very long.

Attachments (5)

Screenshot_101.png (43.8 KB) - added by justinahinon 11 months ago.
50838.patch (294 bytes) - added by justinahinon 11 months ago.
Increase the width of the ".fixed .column-posts" element. This solves the issue, and "Publications" is now displayed on a single line.
50838.1.diff (334 bytes) - added by audrasjb 10 months ago.
Administration: Use hyphens: auto CSS property to fixed list tables columns
Capture d’écran 2020-09-02 à 01.36.16.png (66.3 KB) - added by audrasjb 10 months ago.
Looks like it solves the issue ;-)
50838.diff (385 bytes) - added by helen 8 months ago.

Download all attachments as: .zip

Change History (19)

@justinahinon
11 months ago

Increase the width of the ".fixed .column-posts" element. This solves the issue, and "Publications" is now displayed on a single line.

#1 follow-up: @justinahinon
11 months ago

50838.patch fixes the issue. Checking other places where .fixed .column-posts is used to see how they are affected.

#2 in reply to: ↑ 1 @justinahinon
11 months ago

Replying to justinahinon:

Doesn't look like it has been used somewhere else that could lead to a breaking change.

#3 @SergeyBiryukov
11 months ago

  • Component changed from Administration to Users
  • Focuses ui css administration added
  • Milestone changed from Awaiting Review to 5.6
  • Owner set to SergeyBiryukov
  • Status changed from new to reviewing

Related: #15993

This ticket was mentioned in Slack in #core-css by kirstyburgoine. View the logs.


10 months ago

#5 @kburgoine
10 months ago

  • Keywords needs-testing added
  • Owner changed from SergeyBiryukov to kburgoine

#6 follow-up: @jipmoors
10 months ago

Looking at the patch, rising the number of pixels seems like a very specific solution.

Me and @tacoverdo were looking at the translations in French and realised that the common translation for "Posts" is "Articles" instead of "Publications".

We think the best way to solve this is to make sure the 3 "Publications" translations are set to "Articles" which require less width.

See https://translate.wordpress.org/consistency/?search=posts&set=fr%2Fdefault&project=1

Also, in Armenic the translation is even longer, which would require 85px width.
To combat this problem, the entire methodology of defining column sizes should be revisited.

Suggesting to closing this issue.

#7 @justinahinon
10 months ago

Thanks for looking @jipmoors @tacoverdo.

@audrasjb what do you think? Since they're different formulations for the same term... I don't recall if this is a point that will be discussed in the nexts FR translation team meetings.

#8 in reply to: ↑ 6 @audrasjb
10 months ago

  • Keywords needs-refresh added

Replying to jipmoors:

Me and @tacoverdo were looking at the translations in French and realised that the common translation for "Posts" is "Articles" instead of "Publications".

We think the best way to solve this is to make sure the 3 "Publications" translations are set to "Articles" which require less width.

Hello @jipmoors,

As fr_FR GTE, I have to kindly disagree :)
"Articles" is used for the "Posts" post type. When we talk about any post type (custom or not), "Publications" need to be used. This translation decision was made around one year ago to to disambiguate the use of "Posts" in different contexts.

I do think the issue is relevant, and we should fix this by using some CSS in WP-Admin list tables.

By the way, I agree the proposed patch is not ideal as it only solves the issue for one language. We need a more universal solution.

I'll try to see if I can help on a patch.

Cheers,
Jb

@audrasjb
10 months ago

Administration: Use hyphens: auto CSS property to fixed list tables columns

@audrasjb
10 months ago

Looks like it solves the issue ;-)

#9 @audrasjb
10 months ago

  • Keywords has-patch added; needs-testing needs-refresh removed
  • Owner changed from kburgoine to audrasjb
  • Status changed from reviewing to accepted

Using hyphens: auto looks like to fix the issue at least on Chrome and Firefox, without touching to the column width. I’m in favor of committing this first step before touching the columns width, which is probably a dangerous rabbit hole :D

#10 @audrasjb
9 months ago

  • Keywords commit added
  • Severity changed from minor to normal

Hi,

Given it's a very minor CSS fix and a very annoying bug (potentially for several Locales), I'd like to propose it for the next minor release. Any thought about that @SergeyBiryukov ?

This ticket was mentioned in Slack in #core by helen. View the logs.


8 months ago

@helen
8 months ago

#12 @helen
8 months ago

50838.diff adds the prefixes using postcss. My testing results on Mac are a bit strange:

  • Chrome (86.0.4240.80): Works, doesn't need prefix.
  • Firefox Developer (83): Does not work, with or without prefixes.
  • Safari (14.0): Does not work on initial load, does require prefix. Oddly, it suddenly applies hyphens when I target it with the dev tools inspector. No idea.

I'm testing this by changing the column title in class-wp-users-list-table.php to replicate that the long text is there on load, just in case results are different if you edit the string in dev tools instead.

I'm happy to commit this if we feel it covers enough cases to be useful, I would just like to know if others see the same thing in testing and what it's like in Windows + MS browsers.

#13 @audrasjb
8 months ago

Hey @helen, thank you for adding those prefixes 👍
Patch looks good to ship on my side.

#14 @helen
8 months ago

  • Resolution set to fixed
  • Status changed from accepted to closed

In 49317:

Administration: Accommodate long translations for "Posts" in list table headers.

This stems from longer translations on the User table, but this will apply to any posts column in a list table. Hyphenation should typically just apply to the column header, as the cell contents are just a count.

This does appear to have some browser inconsistencies, so may need further adjustment in the future.

Props audrasjb, justinahinon.
Fixes #50838.

Note: See TracTickets for help on using tickets.