WordPress.org
Get WordPress

Make WordPress Core

Opened 7 months ago

Closed 6 months ago

#63672 closed defect (bug) (fixed)

Layout breaking while editing an Image from "Image Details Edit" screen, if translated text is longer.

Reported by: presskopp's profile Presskopp Owned by: joedolson's profile joedolson
Milestone: 6.9 Priority: normal
Severity: normal Version:
Component: Media Keywords: has-patch commit
Focuses: ui, css, administration Cc:

Description

The buttons for "Apply Crop" and "Clear Crop" are side by side in english, but not in german, for example. If Changeset 58214 gets reverted the buttons are side by side again. See #58979.

Attachments (3)

english_original.png​ (34.6 KB) - added by Presskopp 7 months ago.
german_original.png​ (26.6 KB) - added by Presskopp 7 months ago.
german_patched.png​ (27.5 KB) - added by Presskopp 7 months ago.

Download all attachments as: .zip

Change History (12)

@Presskopp
7 months ago

@Presskopp
7 months ago

@Presskopp
7 months ago

#1 @audrasjb
7 months ago

  • Milestone changed from Awaiting Review to 6.9
  • Owner set to audrasjb
  • Status changed from new to accepted

I think it doesn't hurt if they are not side by side. I feel more concerned about the lack of margin between the two buttons when they are stacked.

#2 @Presskopp
7 months ago

agreed

#3 @joedolson
7 months ago

  • Owner changed from audrasjb to joedolson

Ditto.

#4 @joedolson
7 months ago

Sorry; I didn't realize you'd self-assigned @audrasjb. But I implemented this, so I'm happy to fix it.

This ticket was mentioned in ​PR #9282 on ​WordPress/wordpress-develop by ​@rishabhwp.
7 months ago #5

  • Keywords has-patch added

#6 @rishabhwp
7 months ago

Hi @joedolson,

I’ve created a PR that addresses the button-spacing issue in localized layouts. Could you please review it when you have a moment?

Thanks for your time!

​@joedolson commented on ​PR #9282:
6 months ago #7

@R1shabh-Gupta Using flexbox is fine, and in keeping with WordPress styling expectations. You don't see a lot of it because the bulk of the current admin design was designed to support Internet Explore, and we couldn't start using Flexbox seriously until we dropped support for IE.

#8 @joedolson
6 months ago

  • Keywords commit added

This is a fairly trivial change, and I don't think it needs extra testing before commit.

#9 @joedolson
6 months ago

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

In 60517:

Media: Add gap between Crop apply controls when stacked.

Switch the display of the Media editor Crop controls to flexbox and add a gap of 4px in both column and row directions. Gives space between buttons when they are stacked.

Props presskopp, audrasjb, rishabhwp, joedolson.
Fixes #63672.

Note: See TracTickets for help on using tickets.