WordPress.org

Make WordPress Core

Opened 2 years ago

Closed 22 months ago

#44209 closed defect (bug) (fixed)

Admin Menu SVG Icon colour wrong in Default colour scheme

Reported by: swift Owned by: swift
Milestone: 5.1 Priority: normal
Severity: normal Version: 4.5
Component: Administration Keywords: has-screenshots good-first-bug
Focuses: ui, administration Cc:

Description

When using a SVG as an icon for an admin menu, the default color scheme shows the svg icons as a different colour (#82878c) than font icons (#a0a5aa). Other colour schemes seem to render svg icons correctly. Seems like it's related to /wp-includes/general-template.php line 3886 (WP 4.9.5), and possibly /wp-admin/includes/misc.php line 713. Changing 'base' => '#82878c' to 'base' => '#a0a5aa' fixes the issue for me.

Attachments (2)

Screen Shot 2018-05-23 at 8.00.32 PM.JPG (14.7 KB) - added by swift 2 years ago.
SVG Admin Icon colour wrong in default colour scheme (eg. Conference vs. Comments)
#44209.diff (907 bytes) - added by swift 2 years ago.
patch for this bug

Download all attachments as: .zip

Change History (13)

@swift
2 years ago

SVG Admin Icon colour wrong in default colour scheme (eg. Conference vs. Comments)

#1 @desrosj
2 years ago

  • Keywords needs-patch has-screenshots good-first-bug added

@swift
2 years ago

patch for this bug

#2 @swift
2 years ago

  • Keywords has-patch added; needs-patch removed

I've made a patch for this - it's my first ever so hopefully it's correct.

#3 @dschalk
2 years ago

  • Resolution set to worksforme
  • Status changed from new to closed

I have tested this and can confirm that it works :)

#4 @dschalk
2 years ago

  • Resolution worksforme deleted
  • Status changed from closed to reopened

#5 @desrosj
2 years ago

  • Keywords commit added
  • Milestone changed from Awaiting Review to 4.9.9
  • Owner set to swift
  • Status changed from reopened to assigned
  • Version set to 4.5

Assigning to mark good-first-bug claimed. Thanks for the patch, @swift, and thank you for testing @dschalk!

It looks like this color was changed in [36587]. The goal there was to improve color contrast for a11y. This change makes the colors consistent while maintaining a proper level of contrast.

I was able to reproduce the issue with several plugins that use SVG icons, and #44209.diff fixed them all for me.

#6 @pento
2 years ago

  • Milestone changed from 4.9.9 to 5.0.1

#7 @pento
23 months ago

  • Milestone changed from 5.0.1 to 5.0.2

#8 @pento
23 months ago

  • Milestone changed from 5.0.2 to 5.0.3

#9 @desrosj
22 months ago

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

In 44353:

Administration: Update default fallback color for SVG icons.

Currently, when an SVG is used as a menu icon, the color is inconsistent with the other, default dashicons and the contrast ratio does not meet the minimum requirement for accessibility.

This updates the base color for the default fresh color scheme to ensure consistency and proper contrast.

Props swift, dschalk.
Fixes #44209.

#10 @desrosj
22 months ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

Reopening for backport consideration.

#11 @desrosj
22 months ago

  • Keywords has-patch commit removed
  • Milestone changed from 5.0.3 to 5.1
  • Resolution set to fixed
  • Status changed from reopened to closed

Since 5.0.3 is for block editor improvements, regressions, and major bug fixes, let's leave this in 5.1.

Note: See TracTickets for help on using tickets.