Changeset 61682

Timestamp:

02/18/2026 10:02:47 PM (3 weeks ago)

Author:

joedolson

Message:

Admin: Miscellaneous reskin color and alignment fixes.

Fix a few miscellaneous colors and alignment shifts missed in previous updates. Apply the new admin link and button colors on missed cases in the customizer, classic widgets, skip links, help and screen options, and admin nav menus.

Props joedolson, fabiankaegy.
Fixes #64652.

Location:

trunk/src

Files:

• wp-admin/css/common.css (modified) (4 diffs)
• wp-admin/css/nav-menus.css (modified) (1 diff)
• wp-admin/css/widgets.css (modified) (2 diffs)
• wp-admin/includes/widgets.php (modified) (1 diff)
• wp-admin/widgets-form.php (modified) (3 diffs)
• wp-includes/css/customize-preview.css (modified) (2 diffs)

trunk/src/wp-admin/css/common.css

@@ -156 +156 @@
     padding: 15px 23px 14px;
     /* Background and color set to prevent false positives in automated accessibility tests. */
-    background: #f0f0f1;
-    color: #2271b1;
+    background: #ffffff;
+    color: var(--wp-admin-theme-color, #3858e9);
     z-index: 100000;
     line-height: normal;
@@ -165 +165 @@
     top: -25px;
     /* Overrides a:focus in the admin. See ticket #56789. */
-    color: #2271b1;
-    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
+    color: var(--wp-admin-theme-color, #3858e9);
+    box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
     text-decoration: none;
     /* Only visible in Windows High Contrast mode */
@@ -1895 +1895 @@
 
 #screen-meta-links .show-settings:focus {
-    border-color: #2271b1;
-    box-shadow: 0 0 0 1px #2271b1;
+    border-color: var(--wp-admin-theme-color, #3858e9);
+    box-shadow: 0 0 0 var(--wp-admin-border-width-focus, 1.5px) var(--wp-admin-theme-color, #3858e9);
     /* Only visible in Windows High Contrast mode */
     outline: 2px solid transparent;
@@ -3446 +3446 @@
     box-shadow: none;
     /* Use an inset outline instead, so it's visible also over the current file item. */
-    outline: 2px solid #2271b1;
+    outline: 2px solid var(--wp-admin-theme-color, #3858e9);
     outline-offset: -2px;
 }

trunk/src/wp-admin/css/nav-menus.css

@@ -222 +222 @@
 .menu-settings-group {
     margin: 0 0 10px;
-    overflow: hidden;
     padding-left: 20%;
 }

trunk/src/wp-admin/css/widgets.css

@@ -583 +583 @@
 }
 
+.widget-control-actions {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
 .editwidget .widget-control-actions {
     margin-top: 20px;
@@ -725 +731 @@
 
 .widgets-chooser .widgets-chooser-selected .widgets-chooser-button {
-    background: #2271b1;
+    background: var(--wp-admin-theme-color, #3858e9);
     color: #fff;
 }

trunk/src/wp-admin/includes/widgets.php

@@ -304 +304 @@
             <span class="spinner"></span>
         </div>
-        <br class="clear" />
     </div>
     <?php echo $after_form; ?>

trunk/src/wp-admin/widgets-form.php

@@ -344 +344 @@
 
     <div class="widget-control-actions">
-        <div class="alignleft">
+        <div class="left-actions">
             <?php if ( ! isset( $_GET['addnew'] ) ) : ?>
                 <input type="submit" name="removewidget" id="removewidget" class="button-link button-link-delete widget-control-remove" value="<?php esc_attr_e( 'Delete' ); ?>" />
@@ -354 +354 @@
             <?php endif; ?>
         </div>
-        <div class="alignright">
+        <div class="right-actions">
             <?php submit_button( __( 'Save Widget' ), 'primary alignright', 'savewidget', false ); ?>
             <input type="hidden" name="widget-id" class="widget-id" value="<?php echo esc_attr( $widget_id ); ?>" />
@@ -361 +361 @@
             <?php wp_nonce_field( "save-delete-widget-$widget_id" ); ?>
         </div>
-        <br class="clear" />
     </div>
 

trunk/src/wp-includes/css/customize-preview.css

@@ -45 +45 @@
     font-size: 18px;
     z-index: 5;
-    background: #3582c4 !important;
+    background: #3858e9;
     border-radius: 50%;
     border: 2px solid #fff;
@@ -77 +77 @@
 
 .customize-partial-edit-shortcut button:hover {
-    background: #4f94d4 !important; /* matches primary buttons */
+    background: #2145e6 !important; /* matches primary buttons */
 }
 
 .customize-partial-edit-shortcut button:focus {
-    box-shadow: 0 0 0 2px #4f94d4;
+    box-shadow: 0 0 0 1.5px #3858e9;
 }