WordPress.org
Get WordPress

Make WordPress Core

Opened 9 months ago

Closed 9 months ago

#58877 closed defect (bug) (fixed)

New image editing screen - buttons overflow in non en_US locales

Reported by: kebbet's profile kebbet Owned by: joedolson's profile joedolson
Milestone: 6.3 Priority: normal
Severity: normal Version: 6.3
Component: Media Keywords: has-patch fixed-major dev-reviewed
Focuses: ui, css Cc:

Description

The new image editing interface has a glitch when using other locales than en_US. The strings are longer in for example sv_SE, which makes the dropdown menu for ”Image rotatation” to overflow.

Attachments (2)

image-editiing-overflow.jpg​ (77.1 KB) - added by kebbet 9 months ago.
The drop down menu in action, with sv_SE locale
image-editiing-overflow-fixx.jpg​ (82.4 KB) - added by kebbet 9 months ago.
What the solution in comment 1 looks like.

Download all attachments as: .zip

Change History (19)

@kebbet
9 months ago

The drop down menu in action, with sv_SE locale

#1 @kebbet
9 months ago

A solution can be adjusting the .image-editor .imgedit-menu .imgedit-popup-menu button selector by adding:

white-space: space-break;
line-height: 1.5;

@kebbet
9 months ago

What the solution in comment 1 looks like.

This ticket was mentioned in ​PR #4888 on ​WordPress/wordpress-develop by ​@kebbet.
9 months ago #2

  • Keywords has-patch added; needs-patch removed

https://core.trac.wordpress.org/ticket/58877 Solves the issues present on sv_SE.

#3 @kebbet
9 months ago

  • Keywords needs-testing added

Test instructions

  1. Perform the test on both en_US locale and sv_SE.
  2. Go to edit screen of media item, press button Edit image/Redigera bild.
  3. Click Image rotation/Bildrotation button.
  4. View the buttons in the fly out menu drawer.

Expecations

  • Before and after patch in en_US: The fly out menu buttons do not overflow.
  • Before patch in sv_SE: The buttons in the fly out menu overflows.
  • After patch in sv_SE: The buttons in the fly out menu does not overflow.

#4 @SergeyBiryukov
9 months ago

  • Milestone changed from Awaiting Review to 6.3

#5 @SergeyBiryukov
9 months ago

Thanks for the ticket! Moving to 6.3, as this appears to be introduced in [55919] / #50523.

#6 @joedolson
9 months ago

  • Owner set to joedolson
  • Status changed from new to accepted

Well, I should definitely have caught that. Thanks, @kebbet!

#7 @joedolson
9 months ago

  • Keywords commit added; needs-testing removed

Looks good.

#8 @joedolson
9 months ago

This was actually introduced in [56239] / #58756, which was a follow up to [55919] / #50523. Still introduced in 6.3, though.

#9 @joedolson
9 months ago

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

In 56282:

Media: Fix Image rotation button overflow in translations.

Fix CSS to cover the image rotation button action text being longer than the Image Rotation menu toggle. Prevent the button text from overflowing the button. Follow-up to [56239].

Props kebbet.
Fixes #58877.

#10 @joedolson
9 months ago

  • Keywords commit removed
  • Resolution fixed deleted
  • Status changed from closed to reopened

#11 @joedolson
9 months ago

  • Keywords dev-feedback added

Reopening for 2nd committer approval to backport into 6.3.

#13 @joedolson
9 months ago

Hi, @audrasjb! Requesting second committer review for backport to 6.3, when you have a chance.

#14 @audrasjb
9 months ago

  • Keywords fixed-major added

#15 @audrasjb
9 months ago

  • Keywords dev-reviewed added; dev-feedback removed

Thanks for the ping @joedolson.
I sign-off this changeset 👍

This ticket was mentioned in ​Slack in #core by audrasjb. ​View the logs.
9 months ago

#17 @audrasjb
9 months ago

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

In 56286:

Media: Fix Image rotation button overflow in translations.

Fix CSS to cover the image rotation button action text being longer than the Image Rotation menu toggle. Prevent the button text from overflowing the
button.

Follow-up to [56239].

Props kebbet, joedolson.
Reviewed by audrasjb.
Merges [56282] to the 6.3 branch.
Props kebbet.
Fixes #58877.

Note: See TracTickets for help on using tickets.