WordPress.org

Make WordPress Core

Opened 4 years ago

Last modified 5 months ago

#32679 new defect (bug)

Widgets inside customiser lack contrast

Reported by: paulwilde Owned by:
Milestone: Future Release Priority: normal
Severity: normal Version: 4.3
Component: Customize Keywords: needs-patch
Focuses: ui Cc:
PR Number:

Description

Ever since #31336 was introduced the contract of the widget borders has gotten worst.

The border colours for the customiser interface seem to all be #ddd, whereas the border colour for the widgets are currently set as #e5e5e5. My suggestion would be to use #ddd.

#e5e5e5 is used inside the admin where the widgets (and menus) are on top of a white background, however the background has been changed to #eee so the edges of the widgets now look blurry and a little foreign from the rest of the interface.

See my attached screenshot of its current state and then what I would suggest.

Also for reference #29158.

Attachments (1)

widget-borders.png (96.2 KB) - added by paulwilde 4 years ago.

Download all attachments as: .zip

Change History (8)

This ticket was mentioned in Slack in #design by ocean90. View the logs.


4 years ago

#2 @celloexpressions
4 years ago

Left a bunch of comments in slack, but we never redesigned these in #31336. The current proposed design is what was merged with Menu Customizer, once we finalize that we'll want to make widgets match.

#3 @designsimply
4 years ago

#32727 was marked as a duplicate.

#4 @celloexpressions
4 years ago

  • Keywords needs-patch added
  • Milestone changed from Awaiting Review to 4.3
  • Type changed from enhancement to defect (bug)

Waiting for a decision on #29158 to patch this, but we need to make widgets and menus match. Currently leaning towards doing white backgrounds for titles, dark borders on hover and expanded, and an in between gray shared by the heading and the form in expanded controls. The titles definitely need to be on a white background when they aren't expanded for visual contrast reasons (especially noticeable with menus). Would like to look at darkening border colors on inputs universally as well.

#5 @obenland
4 years ago

  • Milestone changed from 4.3 to Future Release

#29158 got moved out of the milestone, let's look at them together in a future release.

#6 follow-up: @celloexpressions
3 years ago

Widget styling needs to be updated to match the newer menus UI, where contrast decisions were carefully considered around the principles established in #31336 (primarily using white backgrounds for interaction elements). This is largely independent of #29158 at this point, although I'm going to cover the available widgets panel in that patch.

#9 in reply to: ↑ 6 @celloexpressions
7 months ago

  • Milestone set to Future Release

My latest comment still stands. This needs a patch accordingly.

Replying to celloexpressions:

Widget styling needs to be updated to match the newer menus UI, where contrast decisions were carefully considered around the principles established in #31336 (primarily using white backgrounds for interaction elements). This is largely independent of #29158 at this point, although I'm going to cover the available widgets panel in that patch.

Note: See TracTickets for help on using tickets.