diff --git a/src/wp-admin/css/wp-admin.css b/src/wp-admin/css/wp-admin.css index 01b922aec1..a2e33f3739 100644 --- a/src/wp-admin/css/wp-admin.css +++ b/src/wp-admin/css/wp-admin.css @@ -1874,6 +1874,8 @@ form.upgrade .hint { width: 34px; height: 30px; margin: 0; + background-repeat: no-repeat; + background-position: center; text-align: center; } diff --git a/src/wp-admin/includes/misc.php b/src/wp-admin/includes/misc.php index 6f0ad5e40c..5091908cf2 100644 --- a/src/wp-admin/includes/misc.php +++ b/src/wp-admin/includes/misc.php @@ -618,9 +618,21 @@ function wp_color_scheme_settings() { $color_scheme = get_user_option( 'admin_color' ); - if ( ! empty( $_wp_admin_css_colors[ $color_scheme ]->icon_colors ) ) { - echo '\n"; + // It's possible to have a color scheme set that is no longer registered. + if ( empty( $_wp_admin_css_colors[ $color_scheme ] ) ) { + $color_scheme = 'fresh'; } + + if ( ! empty( $_wp_admin_css_colors[ $color_scheme ]->icon_colors ) ) { + $icon_colors = $_wp_admin_css_colors[ $color_scheme ]->icon_colors; + } elseif ( ! empty( $_wp_admin_css_colors['fresh']->icon_colors ) ) { + $icon_colors = $_wp_admin_css_colors['fresh']->icon_colors; + } else { + // Fall back to the default set of icon colors if the default scheme is missing. + $icon_colors = array( 'base' => '#999', 'focus' => '#2ea2cc', 'current' => '#fff' ); + } + + echo '\n"; } add_action( 'admin_head', 'wp_color_scheme_settings' ); diff --git a/src/wp-admin/includes/plugin.php b/src/wp-admin/includes/plugin.php index 09142fb506..b163373433 100644 --- a/src/wp-admin/includes/plugin.php +++ b/src/wp-admin/includes/plugin.php @@ -966,8 +966,11 @@ function uninstall_plugin($plugin) { * @param string $capability The capability required for this menu to be displayed to the user. * @param string $menu_slug The slug name to refer to this menu by (should be unique for this menu) * @param callback $function The function to be called to output the content for this page. - * @param string $icon_url The url to the icon to be used for this menu. Using 'none' would leave div.wp-menu-image empty - * so an icon can be added as background with CSS. + * @param string $icon_url The url to the icon to be used for this menu. + * * Pass a base64-encoded SVG using a data URI, which will be colored to match the color scheme. + * This should begin with 'data:image/svg+xml;base64,'. + * * Pass the name of a Dashicons helper class to use a font icon, e.g. 'dashicons-piechart'. + * * Pass 'none' to leave div.wp-menu-image empty so an icon can be added via CSS. * @param int $position The position in the menu order this one should appear * * @return string The resulting page's hook_suffix diff --git a/src/wp-admin/menu-header.php b/src/wp-admin/menu-header.php index ede610e291..ab219683d4 100644 --- a/src/wp-admin/menu-header.php +++ b/src/wp-admin/menu-header.php @@ -67,11 +67,24 @@ function _wp_menu_output( $menu, $submenu, $submenu_as_parent = true ) { $class = $class ? ' class="' . join( ' ', $class ) . '"' : ''; $id = ! empty( $item[5] ) ? ' id="' . preg_replace( '|[^a-zA-Z0-9_:.]|', '-', $item[5] ) . '"' : ''; - $img = ''; + $img = $img_style = $img_class = ''; + // if the string 'none' (previously 'div') is passed instead of an URL, don't output the default menu image // so an icon can be added to div.wp-menu-image as background with CSS. - if ( ! empty( $item[6] ) ) - $img = ( 'none' === $item[6] || 'div' === $item[6] ) ? '
' : ''; + // Dashicons and base64-encoded data:image/svg_xml URIs are also handled as special cases. + if ( ! empty( $item[6] ) ) { + $img = ''; + + if ( 'none' === $item[6] || 'div' === $item[6] ) { + $img = '
'; + } elseif ( 0 === strpos( $item[6], 'data:image/svg+xml;base64,' ) ) { + $img = '
'; + $img_style = ' style="background-image:url(\'' . esc_attr( $item[6] ) . '\')"'; + } elseif ( 0 === strpos( $item[6], 'dashicons-' ) ) { + $img = '
'; + $img_class = ' dashicons ' . sanitize_html_class( $item[6] ); + } + } $arrow = '
'; $title = wptexturize( $item[0] ); @@ -88,9 +101,9 @@ function _wp_menu_output( $menu, $submenu, $submenu_as_parent = true ) { $menu_file = substr( $menu_file, 0, $pos ); if ( ! empty( $menu_hook ) || ( ( 'index.php' != $submenu_items[0][2] ) && file_exists( WP_PLUGIN_DIR . "/$menu_file" ) && ! file_exists( ABSPATH . "/wp-admin/$menu_file" ) ) ) { $admin_is_parent = true; - echo "$arrow
$img
$title
"; + echo "$arrow
$img
$title
"; } else { - echo "\n\t$arrow
$img
$title
"; + echo "\n\t$arrow
$img
$title
"; } } elseif ( ! empty( $item[2] ) && current_user_can( $item[1] ) ) { $menu_hook = get_plugin_page_hook( $item[2], 'admin.php' ); @@ -99,9 +112,9 @@ function _wp_menu_output( $menu, $submenu, $submenu_as_parent = true ) { $menu_file = substr( $menu_file, 0, $pos ); if ( ! empty( $menu_hook ) || ( ( 'index.php' != $item[2] ) && file_exists( WP_PLUGIN_DIR . "/$menu_file" ) && ! file_exists( ABSPATH . "/wp-admin/$menu_file" ) ) ) { $admin_is_parent = true; - echo "\n\t$arrow
$img
{$item[0]}
"; + echo "\n\t$arrow
$img
{$item[0]}
"; } else { - echo "\n\t$arrow
$img
{$item[0]}
"; + echo "\n\t$arrow
$img
{$item[0]}
"; } } diff --git a/src/wp-admin/menu.php b/src/wp-admin/menu.php index b0f7b51e3a..5a53cff255 100644 --- a/src/wp-admin/menu.php +++ b/src/wp-admin/menu.php @@ -107,8 +107,14 @@ foreach ( (array) get_post_types( array('show_ui' => true, '_builtin' => false, continue; $ptype_menu_position = is_int( $ptype_obj->menu_position ) ? $ptype_obj->menu_position : ++$_wp_last_object_menu; // If we're to use $_wp_last_object_menu, increment it first. $ptype_for_id = sanitize_html_class( $ptype ); + if ( is_string( $ptype_obj->menu_icon ) ) { - $menu_icon = esc_url( $ptype_obj->menu_icon ); + // Special handling for data:image/svg+xml and Dashicons. + if ( 0 === strpos( $ptype_obj->menu_icon, 'data:image/svg+xml;base64,' ) || 0 === strpos( $ptype_obj->menu_icon, 'dashicons-' ) ) { + $menu_icon = $ptype_obj->menu_icon; + } else { + $menu_icon = esc_url( $ptype_obj->menu_icon ); + } $ptype_class = $ptype_for_id; } else { $menu_icon = 'none'; diff --git a/src/wp-includes/js/svg-painter.js b/src/wp-includes/js/svg-painter.js index 87bb852baa..26f4ba4f5a 100644 --- a/src/wp-includes/js/svg-painter.js +++ b/src/wp-includes/js/svg-painter.js @@ -200,7 +200,7 @@ var svgPainter = ( function( $, window, document, undefined ) { $element.data( 'wp-ui-svg-' + color, xml ); } - $element.attr( 'style', 'background-image: url("data:image/svg+xml;base64,' + xml + '") !important;' ); + $element.css( 'background-image', 'url("data:image/svg+xml;base64,' + xml + '")' ); } }; diff --git a/src/wp-includes/post.php b/src/wp-includes/post.php index 302002961b..857cd17a8e 100644 --- a/src/wp-includes/post.php +++ b/src/wp-includes/post.php @@ -1129,6 +1129,10 @@ function get_post_types( $args = array(), $output = 'names', $operator = 'and' ) * * show_in_menu must be true * * Defaults to null, which places it at the bottom of its area. * - menu_icon - The url to the icon to be used for this menu. Defaults to use the posts icon. + * * Pass a base64-encoded SVG using a data URI, which will be colored to match the color scheme. + * This should begin with 'data:image/svg+xml;base64,'. + * * Pass the name of a Dashicons helper class to use a font icon, e.g. 'dashicons-piechart'. + * * Pass 'none' to leave div.wp-menu-image empty so an icon can be added via CSS. * - capability_type - The string to use to build the read, edit, and delete capabilities. Defaults to 'post'. * * May be passed as an array to allow for alternative plurals when using this argument as a base to construct the * capabilities, e.g. array('story', 'stories').