WordPress.org

Make WordPress Core

Opened 4 weeks ago

Closed 3 weeks ago

#52834 closed defect (bug) (fixed)

Reset password screen: improve buttons layout for better i18n

Reported by: audrasjb Owned by: peterwilsoncc
Milestone: 5.7.1 Priority: normal
Severity: normal Version: 5.7
Component: Login and Registration Keywords: has-screenshots fixed-major has-patch commit dev-reviewed
Focuses: ui, css Cc:

Description

Related: #39638

Props to @pixelverbieger for pointing this out.

In some locales, the two buttons position is not ideal. They should ideally be stacked when there is not enough place leave them float.

Attachments (5)

zu-schmal.jpg (136.2 KB) - added by audrasjb 4 weeks ago.
German translation i18n issue
52834.diff (695 bytes) - added by audrasjb 4 weeks ago.
Proposal: replace floats with flex layout for better fallback
3b868ae1e879873021c9e68ef0fa4b86.gif (662.7 KB) - added by audrasjb 4 weeks ago.
52834.diff result
Log-In.png (58.5 KB) - added by mukesh27 3 weeks ago.
52834.1.diff (337 bytes) - added by audrasjb 3 weeks ago.

Download all attachments as: .zip

Change History (22)

@audrasjb
4 weeks ago

German translation i18n issue

@audrasjb
4 weeks ago

Proposal: replace floats with flex layout for better fallback

@audrasjb
4 weeks ago

52834.diff result

#1 @audrasjb
4 weeks ago

  • Keywords has-patch 2nd-opinion has-screenshots added

#2 @ryelle
4 weeks ago

  • Keywords commit added; 2nd-opinion removed

Tested across a few languages of different lengths, looks good across all.

#3 @grapplerulrich
4 weeks ago

Thank you @audrasjb for reporting this. I just noticed the same issue.

I hope we can get this in in a minor version.

#4 @peterwilsoncc
4 weeks ago

  • Milestone changed from Awaiting Review to 5.7.1

I think this would be good to put in the upcoming minor release.

#5 @peterwilsoncc
4 weeks ago

  • Owner set to peterwilsoncc
  • Resolution set to fixed
  • Status changed from new to closed

In 50569:

Login, Registration: Prevent button misalignment on password reset screen.

Prevent misalignment of "generate password" and "save password" buttons on the password reset screen on narrow screens and in languages requiring longer text than English.

Props audrasjb, grapplerulrich, ryelle.
Fixes #52834.

#6 @peterwilsoncc
4 weeks ago

  • Keywords fixed-major dev-feedback added
  • Resolution fixed deleted
  • Status changed from closed to reopened

Reopening for commit to the 5.7 branch following second a committer's sign-off.

#7 @ryelle
3 weeks ago

  • Keywords dev-reviewed added; dev-feedback removed

Based on my earlier review this is good to backport.

#8 @peterwilsoncc
3 weeks ago

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

In 50572:

Login, Registration: Prevent button misalignment on password reset screen.

Prevent misalignment of "generate password" and "save password" buttons on the password reset screen on narrow screens and in languages requiring longer text than English.

Props audrasjb, grapplerulrich, ryelle.
Merges [50569] to the 5.7 branch.
Fixes #52834.

#9 @mukesh27
3 weeks ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

Login page button issue after removed the below CSS in #50572

.login .button-primary { 
   float: right;
}

I'm using a development version (5.8-alpha-50571).

@mukesh27
3 weeks ago

#10 @audrasjb
3 weeks ago

  • Keywords needs-patch added; has-patch commit removed

I can reproduce the issue as well, thanks @mukesh27

#11 @audrasjb
3 weeks ago

  • Keywords dev-reviewed removed

@audrasjb
3 weeks ago

#12 @audrasjb
3 weeks ago

  • Keywords has-patch added; needs-patch removed

#13 @audrasjb
3 weeks ago

The above patch restore the previous rule and keep the new one used in password reset form.

#14 @ryelle
3 weeks ago

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

In 50577:

Login, Registration: Prevent button misalignment on login screen.

Replace the float CSS removed in [50569], which is used to align the login & register buttons.

Props mukesh27, audrasjb.
Fixes #52834.

#15 @ryelle
3 weeks ago

  • Keywords commit dev-feedback added
  • Resolution fixed deleted
  • Status changed from closed to reopened

Thanks for catching that @mukesh27!

Reopening for backport.

Last edited 3 weeks ago by ryelle (previous) (diff)

#16 @SergeyBiryukov
3 weeks ago

  • Keywords dev-reviewed added; dev-feedback removed

[50577] looks good to backport.

#17 @ryelle
3 weeks ago

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

In 50580:

Login, Registration: Prevent button misalignment on login screen.

Replace the CSS removed in [50569], which is used to align the login & register buttons.

Props mukesh27, audrasjb.
Reviewed by SergeyBiryukov.
Merges [50577] to the 5.7 branch.
Fixes #52834.

Note: See TracTickets for help on using tickets.