Make WordPress Core

Opened 2 years ago

Last modified 2 years ago

#55541 new enhancement

Update the styling for invalid form fields

Reported by: afercia's profile afercia Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version:
Component: Administration Keywords: has-patch
Focuses: css Cc:

Description

Splitting this out from #47018.

In a few places in the admin, a red border (actually a border and a box-shadow) are added to some form controls when submitting the form with some empty values.

The style of this red border still uses some transparency and doesn't match any longer with the new style used, for example, for the focus style which is a 'solid' border with no transparency.

For consistency, the red 'error' style should be updated. Here's a few places where the red error style can be checked:

  • The Categories and Tags pages.
  • The Edit Comment page, see the date and time small form under 'Submitted on'.
  • Same for the Classic Editor Edit post page.
  • The Menus page > create a new menu.

See attached screenshots.

Attachments (5)

categories.png (52.0 KB) - added by afercia 2 years ago.
Error and focus style shapes mismatch
comments date time.png (65.1 KB) - added by afercia 2 years ago.
new menu.png (19.3 KB) - added by afercia 2 years ago.
55541.diff (469 bytes) - added by afercia 2 years ago.
example new style.png (27.9 KB) - added by afercia 2 years ago.
Example of the new style

Download all attachments as: .zip

Change History (6)

@afercia
2 years ago

Error and focus style shapes mismatch

@afercia
2 years ago

@afercia
2 years ago

#1 @afercia
2 years ago

  • Keywords has-patch added

55541.diff

  • Updates the red border style used for the invalid form fields.

To test:

  • Check all the forms mentioned in this ticket description.
  • Check the new red 'border' style matches the new 'solid' border pattern used for form fields.

@afercia
2 years ago

Example of the new style

Note: See TracTickets for help on using tickets.