From be2c763724d7927b19590cc5555715ac877b5f45 Mon Sep 17 00:00:00 2001 From: Khokan Sardar Date: Thu, 25 Jun 2026 14:57:27 +0530 Subject: [PATCH] Administration: Improve the highlight styling of newly added Quick Drafts. When a new draft is created via the Quick Draft dashboard widget, the entry added to "Your Recent Drafts" is briefly highlighted. Previously the highlight used a faint yellow background (#fffbe5) applied inline, which predates the current admin color scheme, is barely visible, and is inconsistent with other success feedback in the admin. The highlight also hugged the text with no breathing room. Apply the highlight via a `highlighted-draft` class instead of an inline style, and style it in CSS to: * Use the green (#ceb) already used for success confirmations elsewhere, such as the Recent Comments widget when approving a comment or undoing a spam action, so success feedback is visually consistent. * Span the full width of the widget with internal padding, matching the dashboard widget style, so the highlight reads as a proper success row with breathing room around the text. Negative margins offset the padding so surrounding drafts do not shift while the highlight is shown. Fixes #65539. --- src/js/_enqueues/wp/dashboard.js | 4 ++-- src/wp-admin/css/dashboard.css | 8 ++++++++ 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/src/js/_enqueues/wp/dashboard.js b/src/js/_enqueues/wp/dashboard.js index bea3373ae5c97..78248c6f5b7bb 100644 --- a/src/js/_enqueues/wp/dashboard.js +++ b/src/js/_enqueues/wp/dashboard.js @@ -170,9 +170,9 @@ jQuery( function($) { */ function highlightLatestPost () { var latestPost = $('.drafts ul li').first(); - latestPost.css('background', '#fffbe5'); + latestPost.addClass('highlighted-draft'); setTimeout(function () { - latestPost.css('background', 'none'); + latestPost.removeClass('highlighted-draft'); }, 1000); } } ); diff --git a/src/wp-admin/css/dashboard.css b/src/wp-admin/css/dashboard.css index ab73f828f7067..7f6eed3f74823 100644 --- a/src/wp-admin/css/dashboard.css +++ b/src/wp-admin/css/dashboard.css @@ -850,6 +850,14 @@ body #dashboard-widgets .postbox form .submit { #dashboard_quick_press .drafts li { margin-bottom: 1em; } + +/* Transient highlight applied to a newly added draft. */ +#dashboard_quick_press .drafts li.highlighted-draft { + margin: -6px -12px calc(1em - 6px); + padding: 6px 12px; + background: #ceb; +} + #dashboard_quick_press .drafts li time { color: #646970; }