diff --git a/src/wp-admin/css/common.css b/src/wp-admin/css/common.css index 0ff5ec39cf..98555d1c6c 100644 --- a/src/wp-admin/css/common.css +++ b/src/wp-admin/css/common.css @@ -279,11 +279,9 @@ a:focus .media-icon img, a:focus .plugin-icon, .wp-person a:focus .gravatar { color: #043959; - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); - /* Only visible in Windows High Contrast mode */ - outline: 1px solid transparent; + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } #adminmenu a:focus { @@ -844,9 +842,9 @@ img.emoji { } .tagchecklist .ntdelbutton:focus .remove-tag-icon:before { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .key-labels label { @@ -1460,10 +1458,9 @@ div.error p, } .notice-dismiss:focus { - outline: none; - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .notice-success, @@ -1804,8 +1801,10 @@ p.auto-update-status { } #screen-meta-links .show-settings:focus { - border-color: #4f94d4; - box-shadow: 0 0 3px rgba(34, 113, 177, 0.8); + border-color: #2271b1; + box-shadow: 0 0 0 1px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } #screen-meta-links .show-settings:active { @@ -2143,8 +2142,8 @@ html.wp-toolbar { .postbox .handle-order-higher, .postbox .handle-order-lower, .postbox .handlediv { - width: 36px; - height: 36px; + width: 1.62rem; + height: 1.62rem; margin: 0; padding: 0; border: 0; @@ -3186,11 +3185,10 @@ img { .postbox .handle-order-higher:focus, .postbox .handle-order-lower:focus, .postbox .handlediv:focus { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: inset 0 0 0 2px #2271b1; + border-radius: 50%; /* Only visible in Windows High Contrast mode */ - outline: 1px solid transparent; + outline: 2px solid transparent; } .postbox .handle-order-higher:focus .order-higher-indicator::before, @@ -3289,12 +3287,17 @@ img { [role="treeitem"] { outline: 0; } + +[role="treeitem"] a:focus, [role="treeitem"] .folder-label.focus { color: #043959; - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + /* Reset default focus style. */ + box-shadow: none; + /* Use an inset outline instead, so it's visible also over the current file item. */ + outline: 2px solid #2271b1; + outline-offset: -2px; } + [role="treeitem"].hover, [role="treeitem"] .folder-label.hover { background-color: #f0f0f1; @@ -3436,6 +3439,10 @@ img { text-decoration: none; } +#templateside li.current-file > a { + padding-bottom: 0; +} + #templateside li:not(.howto) > a:first-of-type { padding-top: 0; } @@ -3521,13 +3528,13 @@ img { .accordion-section-title:hover:after { color: #1d2327; /* Only visible in Windows High Contrast mode */ - outline: 1px solid transparent; + outline: 2px solid transparent; } .widget-top .widget-action:focus .toggle-indicator:before { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .control-section .accordion-section-title:after, diff --git a/src/wp-admin/css/customize-controls.css b/src/wp-admin/css/customize-controls.css index 3548f12e9c..ca21fe2889 100644 --- a/src/wp-admin/css/customize-controls.css +++ b/src/wp-admin/css/customize-controls.css @@ -1566,10 +1566,9 @@ p.customize-section-description { } .customize-control-header .choice:focus { - outline: none; - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 3px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .customize-control-header .uploaded div:last-child > .choice { @@ -2679,9 +2678,9 @@ body.adding-widget .add-new-widget:before, #available-widgets-filter .clear-results:focus, #available-menu-items-search .clear-results:focus { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } #available-menu-items-search .search-icon:after, diff --git a/src/wp-admin/css/customize-nav-menus.css b/src/wp-admin/css/customize-nav-menus.css index 46ac3066ef..c645bb5f11 100644 --- a/src/wp-admin/css/customize-nav-menus.css +++ b/src/wp-admin/css/customize-nav-menus.css @@ -271,7 +271,7 @@ .customize-screen-options-toggle:focus, #customize-controls .customize-info .customize-help-toggle:focus { /* Only visible in Windows High Contrast mode */ - outline: 1px solid transparent; + outline: 2px solid transparent; } .customize-screen-options-toggle:before { @@ -864,9 +864,9 @@ li.assigned-to-menu-location .add-new-menu-item { .menu-delete:focus, .menu-item-bar .item-delete:focus:before, #available-menu-items .item-add:focus:before { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } diff --git a/src/wp-admin/css/edit.css b/src/wp-admin/css/edit.css index 8f2032b189..757d676b72 100644 --- a/src/wp-admin/css/edit.css +++ b/src/wp-admin/css/edit.css @@ -1293,8 +1293,9 @@ div.tabs-panel-inactive { } div.tabs-panel-active:focus { - box-shadow: inset 0 0 0 1px #4f94d4, inset 0 0 2px 1px rgba(79, 148, 212, 0.8); - outline: 0 none; + box-shadow: inset 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } #front-page-warning, diff --git a/src/wp-admin/css/forms.css b/src/wp-admin/css/forms.css index bdceac04c4..16f7cb899f 100644 --- a/src/wp-admin/css/forms.css +++ b/src/wp-admin/css/forms.css @@ -679,6 +679,13 @@ fieldset label, border-color: #68de7c; } +#pass1:focus, +#pass1-text:focus { + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; +} + .pw-weak { display: none; } diff --git a/src/wp-admin/css/install.css b/src/wp-admin/css/install.css index 1170ff7c32..29e85715f6 100644 --- a/src/wp-admin/css/install.css +++ b/src/wp-admin/css/install.css @@ -26,9 +26,9 @@ a:active { a:focus { color: #043959; - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } h1, h2 { diff --git a/src/wp-admin/css/list-tables.css b/src/wp-admin/css/list-tables.css index ed7d458488..098c31a6d1 100644 --- a/src/wp-admin/css/list-tables.css +++ b/src/wp-admin/css/list-tables.css @@ -261,8 +261,10 @@ } th .comment-grey-bubble { - height: 16px; width: 16px; + /* Make sure the link clickable area fills the entire table header. */ + position: relative; + top: 2px; } th .comment-grey-bubble:before { @@ -343,7 +345,6 @@ table.fixed { .fixed .column-comments { width: 5.5em; - padding: 8px 0; text-align: left; } @@ -537,9 +538,9 @@ th.sorted.desc:hover .sorting-indicator.asc:before { } .wp-list-table .toggle-row:focus:before { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .wp-list-table .toggle-row:active { @@ -649,9 +650,11 @@ th.sorted a { padding: 8px; } -.fixed .column-comments.sortable a, -.fixed .column-comments.sorted a { - padding: 8px 0; +th.sortable a:focus, +th.sorted a:focus { + box-shadow: inset 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } th.sortable a span, diff --git a/src/wp-admin/css/login.css b/src/wp-admin/css/login.css index fe790f0b42..b9f488bd6c 100644 --- a/src/wp-admin/css/login.css +++ b/src/wp-admin/css/login.css @@ -32,9 +32,9 @@ a:active { a:focus { color: #043959; - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } p { diff --git a/src/wp-admin/css/media.css b/src/wp-admin/css/media.css index 834292901f..4463ae373d 100644 --- a/src/wp-admin/css/media.css +++ b/src/wp-admin/css/media.css @@ -356,9 +356,7 @@ } #find-posts-close:focus { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; outline-offset: -2px; @@ -533,9 +531,7 @@ border color while dragging a file over the uploader drop area */ .media-frame.mode-grid .attachment:focus, .media-frame.mode-grid .selected.attachment:focus, .media-frame.mode-grid .attachment.details:focus { - box-shadow: - inset 0 0 2px 3px #f0f0f1, - inset 0 0 0 7px #4f94d4; + box-shadow: inset 0 0 0 2px #2271b1; /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; outline-offset: -6px; @@ -1172,8 +1168,8 @@ border color while dragging a file over the uploader drop area */ .image-editor .imgedit-settings .imgedit-help-toggle:focus { color: #2271b1; - border-color: #4f94d4; - box-shadow: 0 0 3px rgba(34, 113, 177, 0.8); + border-color: #2271b1; + box-shadow: 0 0 0 1px #2271b1; /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; } diff --git a/src/wp-admin/css/nav-menus.css b/src/wp-admin/css/nav-menus.css index 4fd178dbb0..ff586a4ee7 100644 --- a/src/wp-admin/css/nav-menus.css +++ b/src/wp-admin/css/nav-menus.css @@ -103,7 +103,7 @@ ul.add-menu-item-tabs li { #nav-menu-bulk-actions-bottom { margin: 1em 0; - margin: calc( 1em + 9px ) 0 ; + margin: calc( 1em + 9px ) 0; } .bulk-actions input.button { @@ -732,9 +732,9 @@ body.menu-max-depth-11 { min-width: 1280px !important; } } .nav-menus-php .item-edit:focus:before { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } /* Menu editing */ @@ -991,7 +991,7 @@ body.menu-max-depth-11 { min-width: 1280px !important; } @media only screen and (min-width: 783px) { @supports (position: sticky) and (scroll-margin-bottom: 130px) { - + #nav-menu-footer { position: sticky; bottom: 0; diff --git a/src/wp-admin/css/themes.css b/src/wp-admin/css/themes.css index 268cc558f3..a68abbca04 100644 --- a/src/wp-admin/css/themes.css +++ b/src/wp-admin/css/themes.css @@ -176,12 +176,14 @@ body.js .theme-browser.search-loading { } .theme-browser .theme .more-details:focus { - box-shadow: 0 0 0 1px #fff, 0 0 0 3px #2271b1; + box-shadow: 0 0 0 2px #2271b1; } .theme-browser .theme.focus { - border-color: #4f94d4; - box-shadow: 0 0 2px rgba(79, 148, 212, 0.8); + border-color: #2271b1; + box-shadow: 0 0 0 1px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .theme-browser .theme.focus .more-details { @@ -1586,9 +1588,9 @@ body.full-overlay-active { .wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow, .wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .wp-full-overlay .collapse-sidebar-label { diff --git a/src/wp-admin/css/widgets.css b/src/wp-admin/css/widgets.css index 8faca8f9ac..e24140926e 100644 --- a/src/wp-admin/css/widgets.css +++ b/src/wp-admin/css/widgets.css @@ -336,9 +336,9 @@ } .sidebar-name .handlediv:focus .toggle-indicator:before { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .sidebar-name h2, diff --git a/src/wp-includes/css/buttons.css b/src/wp-includes/css/buttons.css index 56f146d3d6..5146be4274 100644 --- a/src/wp-includes/css/buttons.css +++ b/src/wp-includes/css/buttons.css @@ -215,11 +215,9 @@ TABLE OF CONTENTS: .wp-core-ui .button-link:focus { color: #043959; - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; /* Only visible in Windows High Contrast mode */ - outline: 1px solid transparent; + outline: 2px solid transparent; } .wp-core-ui .button-link-delete { diff --git a/src/wp-includes/css/editor.css b/src/wp-includes/css/editor.css index 969b880873..86952c7c9b 100644 --- a/src/wp-includes/css/editor.css +++ b/src/wp-includes/css/editor.css @@ -87,8 +87,9 @@ .mce-window-head .mce-close:focus .mce-i-remove, div.mce-tab:focus { - box-shadow: 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .mce-window .mce-window-head .mce-dragh { @@ -113,7 +114,9 @@ div.mce-tab:focus { .mce-checkbox:focus i.mce-i-checkbox, #wp-link .query-results:focus { border-color: #4f94d4; - box-shadow: 0 0 2px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .mce-window .mce-wp-help { @@ -409,10 +412,10 @@ div.mce-path { .qt-dfw:hover, .qt-dfw:focus { background: #f6f7f7; - border-color: #50575e; color: #1d2327; - box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba(0, 0, 0, 0.08); - outline: none; + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .mce-toolbar .mce-btn-group .mce-btn.mce-active, @@ -420,7 +423,6 @@ div.mce-path { .qt-dfw.active { background: #f0f0f1; border-color: #50575e; - box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.3); } .mce-btn.mce-active, @@ -532,12 +534,13 @@ div.mce-path { direction: ltr; background: #fff; border: 1px solid #dcdcde; - box-shadow: inset 0 1px 1px -1px rgba(0, 0, 0, 0.2); } .mce-toolbar .mce-btn-group .mce-btn.mce-listbox:hover, .mce-toolbar .mce-btn-group .mce-btn.mce-listbox:focus { - border-color: #c3c4c7; + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .mce-panel .mce-btn i.mce-caret { @@ -635,9 +638,9 @@ div.mce-menubar { .mce-menubar .mce-menubtn:focus { color: #043959; - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } div.mce-menu .mce-menu-item-sep, @@ -1131,10 +1134,9 @@ i.mce-i-wp_code:before { } .wp-switch-editor:focus { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); - outline: none; + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; color: #1d2327; } @@ -1445,10 +1447,7 @@ i.mce-i-wp_code:before { } #wp-link-close:focus { - outline: none; - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; outline-offset: -2px; diff --git a/src/wp-includes/css/jquery-ui-dialog.css b/src/wp-includes/css/jquery-ui-dialog.css index e457b38ddd..528d368251 100644 --- a/src/wp-includes/css/jquery-ui-dialog.css +++ b/src/wp-includes/css/jquery-ui-dialog.css @@ -312,9 +312,7 @@ } .ui-button.ui-dialog-titlebar-close:focus { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; outline-offset: -2px; diff --git a/src/wp-includes/css/media-views.css b/src/wp-includes/css/media-views.css index 95c0dc5a31..c681f6df78 100644 --- a/src/wp-includes/css/media-views.css +++ b/src/wp-includes/css/media-views.css @@ -45,12 +45,10 @@ } .media-frame a:focus { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; color: #043959; /* Only visible in Windows High Contrast mode */ - outline: 1px solid transparent; + outline: 2px solid transparent; } .media-frame a.button { @@ -649,12 +647,10 @@ } .media-menu .media-menu-item:focus { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; color: #043959; /* Only visible in Windows High Contrast mode */ - outline: 1px solid transparent; + outline: 2px solid transparent; } .media-menu .separator { @@ -704,12 +700,10 @@ } .media-router .media-menu-item:focus { - box-shadow: - 0 0 0 1px #4f94d4, - 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; color: #043959; /* Only visible in Windows High Contrast mode */ - outline: 1px solid transparent; + outline: 2px solid transparent; } .media-router .active, @@ -2017,8 +2011,8 @@ .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:focus { color: #2271b1; - border-color: #4f94d4; - box-shadow: 0 0 3px rgba(34, 113, 177, 0.8); + border-color: #2271b1; + box-shadow: 0 0 0 1px #2271b1; /* Only visible in Windows High Contrast mode */ outline: 2px solid transparent; } @@ -2134,8 +2128,8 @@ } .mejs-container:focus { - outline: 1px solid #4f94d4; - box-shadow: 0 0 2px 1px rgba(79, 148, 212, 0.8); + outline: 1px solid #2271b1; + box-shadow: 0 0 0 2px #2271b1; } .image-details .media-modal { diff --git a/src/wp-includes/css/wp-embed-template.css b/src/wp-includes/css/wp-embed-template.css index c1f1cc5c84..6b1ca43f0b 100644 --- a/src/wp-includes/css/wp-embed-template.css +++ b/src/wp-includes/css/wp-embed-template.css @@ -216,7 +216,9 @@ p.wp-embed-heading { .wp-embed-share-dialog-open:focus .dashicons, .wp-embed-share-dialog-close:focus .dashicons { - box-shadow: 0 0 0 1px #4f94d4, 0 0 2px 1px rgba(79, 148, 212, 0.8); + box-shadow: 0 0 0 2px #2271b1; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; border-radius: 100%; } diff --git a/src/wp-includes/functions.php b/src/wp-includes/functions.php index 368315b482..461918bd53 100644 --- a/src/wp-includes/functions.php +++ b/src/wp-includes/functions.php @@ -3905,21 +3905,16 @@ function _default_wp_die_handler( $message, $title = '', $args = array() ) { font-size: 14px ; } a { - color: #0073aa; + color: #2271b1; } a:hover, a:active { - color: #006799; + color: #135e96; } a:focus { - color: #124964; - -webkit-box-shadow: - 0 0 0 1px #5b9dd9, - 0 0 2px 1px rgba(30, 140, 190, 0.8); - box-shadow: - 0 0 0 1px #5b9dd9, - 0 0 2px 1px rgba(30, 140, 190, 0.8); - outline: none; + color: #043959; + box-shadow: 0 0 0 2px #2271b1; + outline: 2px solid transparent; } .button { background: #f3f5f6;