From 4f9b7759ad1a1cca502b3a0917a34683dd1e3adc Mon Sep 17 00:00:00 2001 From: Suryakant Upadhyay Date: Tue, 20 Oct 2026 18:32:42 +0530 Subject: [PATCH 1/4] Administration: Use SVG icons in the At a Glance dashboard widget. Use registered core icons and preserve them when comment counts update via AJAX. See https://core.trac.wordpress.org/ticket/66347. --- src/js/_enqueues/admin/edit-comments.js | 2 +- src/wp-admin/css/dashboard.css | 41 ++++++------------------- src/wp-admin/includes/dashboard.php | 22 +++++++------ 3 files changed, 24 insertions(+), 41 deletions(-) diff --git a/src/js/_enqueues/admin/edit-comments.js b/src/js/_enqueues/admin/edit-comments.js index 7e89f1c0dd7cb..a8c869f6d33dc 100644 --- a/src/js/_enqueues/admin/edit-comments.js +++ b/src/js/_enqueues/admin/edit-comments.js @@ -152,7 +152,7 @@ var getCount, updateCount, updateCountText, updatePending, updateApproved, return; } - $( '.comment-count a', '#dashboard_right_now' ).text( response.i18n_comments_text ); + $( '.comment-count .comments-count-text', '#dashboard_right_now' ).text( response.i18n_comments_text ); }; /** diff --git a/src/wp-admin/css/dashboard.css b/src/wp-admin/css/dashboard.css index a79960cb39419..779f93f23304d 100644 --- a/src/wp-admin/css/dashboard.css +++ b/src/wp-admin/css/dashboard.css @@ -442,41 +442,20 @@ content: "\f159" / ""; } -#dashboard_right_now .page-count a::before, -#dashboard_right_now .page-count span::before { - content: "\f105"; - content: "\f105" / ""; -} - -#dashboard_right_now .post-count a::before, -#dashboard_right_now .post-count span::before { - content: "\f109"; - content: "\f109" / ""; -} - -#dashboard_right_now .comment-count a::before { - content: "\f101"; - content: "\f101" / ""; -} - -#dashboard_right_now .comment-mod-count a::before { - content: "\f125"; - content: "\f125" / ""; -} - -#dashboard_right_now .storage-count a::before { - content: "\f104"; - content: "\f104" / ""; +#dashboard_right_now li .glance-item::before, +#dashboard_right_now .search-engines-info::before { + display: none; } -#dashboard_right_now .storage-count.warning a::before { - content: "\f153"; - content: "\f153" / ""; +#dashboard_right_now .glance-item svg { + fill: currentColor; + color: #646970; + margin-right: 5px; + vertical-align: top; } -#dashboard_right_now .search-engines-info::before { - content: "\f348"; - content: "\f348" / ""; +#dashboard_right_now .warning .glance-item svg, +#dashboard_right_now .search-engines-info svg { color: #d63638; } diff --git a/src/wp-admin/includes/dashboard.php b/src/wp-admin/includes/dashboard.php index 165b556f9eb85..645e73c77ee7d 100644 --- a/src/wp-admin/includes/dashboard.php +++ b/src/wp-admin/includes/dashboard.php @@ -349,6 +349,7 @@ function wp_dashboard_right_now() { $text = sprintf( $text, number_format_i18n( $num_posts->publish ) ); $post_type_object = get_post_type_object( $post_type ); + $icon = wp_get_icon( 'post' === $post_type ? 'core-admin/pin' : 'core-admin/page', array( 'size' => 20 ) ); if ( $post_type_object && current_user_can( $post_type_object->cap->edit_posts ) ) { $url = add_query_arg( @@ -358,9 +359,9 @@ function wp_dashboard_right_now() { ), admin_url( 'edit.php' ) ); - printf( '
  • %3$s
    • ', $post_type, esc_url( $url ), esc_html( $text ) ); + printf( '
  • %3$s%4$s
    • ', $post_type, esc_url( $url ), $icon, esc_html( $text ) ); } else { - printf( '
  • %2$s
    • ', $post_type, $text ); + printf( '
  • %2$s%3$s
    • ', $post_type, $icon, esc_html( $text ) ); } } } @@ -373,7 +374,7 @@ function wp_dashboard_right_now() { $text = sprintf( _n( '%s Comment', '%s Comments', $num_comm->approved ), number_format_i18n( $num_comm->approved ) ); ?>
  • - + 20 ) ); ?>
    • moderated ); @@ -381,7 +382,7 @@ function wp_dashboard_right_now() { $text = sprintf( _n( '%s Comment in moderation', '%s Comments in moderation', $num_comm->moderated ), $moderated_comments_count_i18n ); ?>
  • - + 20 ) ); ?>
    • $content

    "; + $icon = wp_get_icon( 'core/caution', array( 'size' => 20 ) ); + echo "

    $icon$content

    "; } ?> @@ -1921,11 +1923,12 @@ function wp_dashboard_quota() { number_format_i18n( $quota ) ); printf( - '%2$s (%3$s)', + '%4$s%2$s (%3$s)', esc_url( admin_url( 'upload.php' ) ), $text, /* translators: Hidden accessibility text. */ - __( 'Manage Uploads' ) + __( 'Manage Uploads' ), + wp_get_icon( 'core/upload', array( 'size' => 20 ) ) ); ?>
  • @@ -1937,11 +1940,12 @@ function wp_dashboard_quota() { $percentused ); printf( - '%2$s (%3$s)', + '%4$s%2$s (%3$s)', esc_url( admin_url( 'upload.php' ) ), $text, /* translators: Hidden accessibility text. */ - __( 'Manage Uploads' ) + __( 'Manage Uploads' ), + wp_get_icon( $used_class ? 'core/caution' : 'core/upload', array( 'size' => 20 ) ) ); ?>
    • From c6a0037fb2723da476e129268ad008d4914e0baa Mon Sep 17 00:00:00 2001 From: Suryakant Upadhyay Date: Tue, 20 Oct 2026 19:40:45 +0530 Subject: [PATCH 2/4] fix: align dashboard glance icons and text with consistent spacing --- src/wp-admin/css/dashboard.css | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/wp-admin/css/dashboard.css b/src/wp-admin/css/dashboard.css index 779f93f23304d..18e86b61e05c0 100644 --- a/src/wp-admin/css/dashboard.css +++ b/src/wp-admin/css/dashboard.css @@ -447,11 +447,16 @@ display: none; } +#dashboard_right_now .glance-item { + display: inline-flex; + align-items: center; + gap: 5px; +} + #dashboard_right_now .glance-item svg { + flex: none; fill: currentColor; color: #646970; - margin-right: 5px; - vertical-align: top; } #dashboard_right_now .warning .glance-item svg, From 40be28d7efc085fbcc29a0422e6dbfb820f6762a Mon Sep 17 00:00:00 2001 From: Suryakant Upadhyay Date: Fri, 23 Oct 2026 23:26:08 +0530 Subject: [PATCH 3/4] fix: use suggested SVG icons and support plugin items in At a Glance --- src/wp-admin/css/dashboard.css | 35 +++++++++++++++++++++-------- src/wp-admin/includes/dashboard.php | 20 ++++++++--------- 2 files changed, 36 insertions(+), 19 deletions(-) diff --git a/src/wp-admin/css/dashboard.css b/src/wp-admin/css/dashboard.css index 18e86b61e05c0..b5abc7e631a16 100644 --- a/src/wp-admin/css/dashboard.css +++ b/src/wp-admin/css/dashboard.css @@ -433,33 +433,50 @@ /* Right Now specific Icons styles */ -#dashboard_right_now .search-engines-info::before, #dashboard_right_now li a::before, -#dashboard_right_now li > span::before { /* get only the first level span to exclude screen-reader-text in mu-storage */ +#dashboard_right_now li > span::before { padding: 0 5px 0 0; - /* generic icon for items added by CPTs ? */ - content: "\f159"; - content: "\f159" / ""; + /* + * Default icon for plugin-added items: a copy of the core `asterisk` icon. + * Plugins can still override `content` with a Dashicon. + */ + content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2024%2024%22%20style%3D%22fill%3A%20none%22%20stroke%3D%22%23646970%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M5.72131%2015.625L12%2012M12%2012L18.2787%208.375M12%2012V4.75M12%2012L12%2019.25M12%2012L5.72131%208.375M12%2012L18.2787%2015.625%22%20stroke-linecap%3D%22square%22%20%2F%3E%3C%2Fsvg%3E"); + content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2024%2024%22%20style%3D%22fill%3A%20none%22%20stroke%3D%22%23646970%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M5.72131%2015.625L12%2012M12%2012L18.2787%208.375M12%2012V4.75M12%2012L12%2019.25M12%2012L5.72131%208.375M12%2012L18.2787%2015.625%22%20stroke-linecap%3D%22square%22%20%2F%3E%3C%2Fsvg%3E") / ""; } -#dashboard_right_now li .glance-item::before, +/* Fallback for when the SVG icon is unavailable. */ #dashboard_right_now .search-engines-info::before { + padding: 0 5px 0 0; + content: "\f348"; + content: "\f348" / ""; + color: #d63638; +} + +#dashboard_right_now li a:has(> svg)::before, +#dashboard_right_now li > span:has(> svg)::before, +#dashboard_right_now .search-engines-info:has(svg)::before { display: none; } -#dashboard_right_now .glance-item { +#dashboard_right_now li a:has(> svg), +#dashboard_right_now li > span:has(> svg), +#dashboard_right_now .search-engines-info a { display: inline-flex; align-items: center; gap: 5px; + /* Match the height of ::before icon rows so the floated list items don't snag. */ + vertical-align: top; } -#dashboard_right_now .glance-item svg { +#dashboard_right_now li a > svg, +#dashboard_right_now li > span > svg, +#dashboard_right_now .search-engines-info svg { flex: none; fill: currentColor; color: #646970; } -#dashboard_right_now .warning .glance-item svg, +#dashboard_right_now .warning a > svg, #dashboard_right_now .search-engines-info svg { color: #d63638; } diff --git a/src/wp-admin/includes/dashboard.php b/src/wp-admin/includes/dashboard.php index 645e73c77ee7d..94c8bdadce0a8 100644 --- a/src/wp-admin/includes/dashboard.php +++ b/src/wp-admin/includes/dashboard.php @@ -359,9 +359,9 @@ function wp_dashboard_right_now() { ), admin_url( 'edit.php' ) ); - printf( '
  • %3$s%4$s
    • ', $post_type, esc_url( $url ), $icon, esc_html( $text ) ); + printf( '
  • %3$s%4$s
    • ', $post_type, esc_url( $url ), $icon, esc_html( $text ) ); } else { - printf( '
  • %2$s%3$s
    • ', $post_type, $icon, esc_html( $text ) ); + printf( '
  • %2$s%3$s
    • ', $post_type, $icon, esc_html( $text ) ); } } } @@ -374,7 +374,7 @@ function wp_dashboard_right_now() { $text = sprintf( _n( '%s Comment', '%s Comments', $num_comm->approved ), number_format_i18n( $num_comm->approved ) ); ?>
  • - 20 ) ); ?> + 20 ) ); ?>
    • moderated ); @@ -382,7 +382,7 @@ function wp_dashboard_right_now() { $text = sprintf( _n( '%s Comment in moderation', '%s Comments in moderation', $num_comm->moderated ), $moderated_comments_count_i18n ); ?>
  • - 20 ) ); ?> + 20 ) ); ?>
    • 20 ) ); - echo "

    $icon$content

    "; + $icon = wp_get_icon( 'core-admin/info', array( 'size' => 20 ) ); + echo "

    $icon$content

    "; } ?> @@ -1923,12 +1923,12 @@ function wp_dashboard_quota() { number_format_i18n( $quota ) ); printf( - '%4$s%2$s (%3$s)', + '%4$s%2$s (%3$s)', esc_url( admin_url( 'upload.php' ) ), $text, /* translators: Hidden accessibility text. */ __( 'Manage Uploads' ), - wp_get_icon( 'core/upload', array( 'size' => 20 ) ) + wp_get_icon( 'core-admin/media', array( 'size' => 20 ) ) ); ?>
  • @@ -1940,12 +1940,12 @@ function wp_dashboard_quota() { $percentused ); printf( - '%4$s%2$s (%3$s)', + '%4$s%2$s (%3$s)', esc_url( admin_url( 'upload.php' ) ), $text, /* translators: Hidden accessibility text. */ __( 'Manage Uploads' ), - wp_get_icon( $used_class ? 'core/caution' : 'core/upload', array( 'size' => 20 ) ) + wp_get_icon( $used_class ? 'core-admin/error' : 'core-admin/media', array( 'size' => 20 ) ) ); ?>
    • From a3b77df20b8297369c9114b4295ebde2712b0335 Mon Sep 17 00:00:00 2001 From: Suryakant Upadhyay Date: Sat, 24 Oct 2026 00:01:54 +0530 Subject: [PATCH 4/4] fix: keep Dashicon fallbacks for pending At a Glance icons --- src/wp-admin/css/dashboard.css | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/wp-admin/css/dashboard.css b/src/wp-admin/css/dashboard.css index b5abc7e631a16..7ff4be929f496 100644 --- a/src/wp-admin/css/dashboard.css +++ b/src/wp-admin/css/dashboard.css @@ -444,7 +444,17 @@ content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2024%2024%22%20style%3D%22fill%3A%20none%22%20stroke%3D%22%23646970%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M5.72131%2015.625L12%2012M12%2012L18.2787%208.375M12%2012V4.75M12%2012L12%2019.25M12%2012L5.72131%208.375M12%2012L18.2787%2015.625%22%20stroke-linecap%3D%22square%22%20%2F%3E%3C%2Fsvg%3E") / ""; } -/* Fallback for when the SVG icon is unavailable. */ +/* Fallbacks for when the SVG icons are unavailable. */ +#dashboard_right_now .comment-mod-count a::before { + content: "\f125"; + content: "\f125" / ""; +} + +#dashboard_right_now .storage-count.warning a::before { + content: "\f153"; + content: "\f153" / ""; +} + #dashboard_right_now .search-engines-info::before { padding: 0 5px 0 0; content: "\f348";