Index: src/wp-admin/css/admin-menu.css =================================================================== --- src/wp-admin/css/admin-menu.css (revision 44504) +++ src/wp-admin/css/admin-menu.css (working copy) @@ -330,7 +330,6 @@ #adminmenu .wp-submenu li { padding: 0; margin: 0; - overflow: hidden; } #adminmenu .wp-menu-image img { @@ -547,16 +546,20 @@ padding: 0; position: relative; overflow: visible; - line-height: 34px; background: none; color: #aaa; cursor: pointer; - outline: 0; } -#collapse-button:hover, +#collapse-button:hover { + color: #00b9eb; +} + #collapse-button:focus { color: #00b9eb; + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; + outline-offset: -1px; } #collapse-button .collapse-button-icon, @@ -566,9 +569,12 @@ position: absolute; top: 0; left: 0; - line-height: 34px; } +#collapse-button .collapse-button-label { + top: 8px; +} + #collapse-button .collapse-button-icon { width: 36px; height: 34px; Index: src/wp-admin/css/common.css =================================================================== --- src/wp-admin/css/common.css (revision 44504) +++ src/wp-admin/css/common.css (working copy) @@ -154,7 +154,9 @@ line-height: normal; box-shadow: 0 0 2px 2px rgba(0,0,0,.6); text-decoration: none; - outline: none; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; + outline-offset: -2px; } .hidden, @@ -269,6 +271,8 @@ box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8); + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; } .ie8 a:focus { @@ -275,7 +279,13 @@ outline: #5b9dd9 solid 1px; } -#adminmenu a:focus, +#adminmenu a:focus { + box-shadow: none; + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; + outline-offset: -1px; +} + .screen-reader-text:focus { box-shadow: none; outline: none; @@ -613,7 +623,6 @@ line-height: normal; /* IE8-IE11 need this for buttons */ color: #0073aa; /* some of these controls are button elements and don't inherit from links */ cursor: pointer; - outline: 0; } .wrap .wp-heading-inline + .page-title-action { @@ -635,6 +644,8 @@ .wrap .page-title-action:focus { border-color: #5b9dd9; box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 ); + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .wrap h1.long-header { Index: src/wp-admin/css/forms.css =================================================================== --- src/wp-admin/css/forms.css (revision 44504) +++ src/wp-admin/css/forms.css (working copy) @@ -52,6 +52,8 @@ textarea:focus { border-color: #5b9dd9; box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 ); + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } /* rtl:ignore */ @@ -236,10 +238,12 @@ color: #72777c; } -.form-invalid input, .form-invalid input:focus, -.form-invalid select, .form-invalid select:focus { +.form-invalid input, +.form-invalid input:focus, +.form-invalid select, +.form-invalid select:focus { border-color: #dc3232 !important; - box-shadow: 0 0 2px rgba( 204, 0, 0, 0.8 ); + box-shadow: 0 0 2px rgba( 204, 0, 0, 0.8 ); } .form-table .form-required.form-invalid td:after { Index: src/wp-admin/css/media.css =================================================================== --- src/wp-admin/css/media.css (revision 44504) +++ src/wp-admin/css/media.css (working copy) @@ -310,10 +310,12 @@ } #find-posts-close:focus { - outline: none; box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8); + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; + outline-offset: -2px; } #find-posts-close:before { @@ -528,7 +530,9 @@ box-shadow: inset 0 0 2px 3px #f1f1f1, inset 0 0 0 7px #5b9dd9; - outline: none; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; + outline-offset: -6px; } .media-frame.mode-grid .selected.attachment { @@ -681,6 +685,14 @@ box-shadow: none; } +.upload-php .media-modal-close:focus, +.edit-attachment-frame .edit-media-header .left:focus, +.edit-attachment-frame .edit-media-header .right:focus { + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; + outline-offset: -2px; +} + .upload-php .media-modal-close:focus .media-modal-icon:before, .upload-php .media-modal-close:hover .media-modal-icon:before { color: #000; @@ -1079,8 +1091,9 @@ .image-editor .imgedit-settings .imgedit-help-toggle:focus { color: #0074a2; border-color: #5b9dd9; - outline: none; box-shadow: 0 0 3px rgba( 0, 115, 170, .8 ); + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .form-table td.imgedit-response { Index: src/wp-includes/css/admin-bar.css =================================================================== --- src/wp-includes/css/admin-bar.css (revision 44504) +++ src/wp-includes/css/admin-bar.css (working copy) @@ -53,7 +53,6 @@ #wpadminbar a:hover, #wpadminbar a img, #wpadminbar a img:hover { - outline: none; border: none; text-decoration: none; background: none; @@ -71,9 +70,13 @@ #wpadminbar textarea, #wpadminbar div { box-shadow: none; - outline: none; } +#wpadminbar a:focus { + /* Inherits transparent outline only visible in Windows High Contrast mode */ + outline-offset: -1px; +} + #wpadminbar { direction: ltr; color: #ccc; Index: src/wp-includes/css/buttons.css =================================================================== --- src/wp-includes/css/buttons.css (revision 44504) +++ src/wp-includes/css/buttons.css (working copy) @@ -92,9 +92,12 @@ padding: 0 36px; } +/* Only visible in Windows High Contrast mode */ .wp-core-ui .button:active, .wp-core-ui .button:focus { - outline: none; + outline: 2px solid transparent; + /* Reset inherited offset from Gutenberg */ + outline-offset: 0; } .wp-core-ui .button.hidden { @@ -190,7 +193,6 @@ border: 0; border-radius: 0; background: none; - outline: none; cursor: pointer; text-align: left; /* Mimics the default link style in common.css */ @@ -211,6 +213,8 @@ box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8); + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; } .wp-core-ui .button-link-delete { @@ -280,7 +284,7 @@ } .wp-core-ui .button.button-primary.button-hero { - box-shadow: 0 2px 0 #006799; + box-shadow: 0 2px 0 #006799; } .wp-core-ui .button.button-primary.button-hero.active, @@ -287,7 +291,7 @@ .wp-core-ui .button.button-primary.button-hero.active:hover, .wp-core-ui .button.button-primary.button-hero.active:focus, .wp-core-ui .button.button-primary.button-hero:active { - box-shadow: inset 0 3px 0 #006799; + box-shadow: inset 0 3px 0 #006799; } /* ---------------------------------------------------------------------------- Index: src/wp-includes/css/media-views.css =================================================================== --- src/wp-includes/css/media-views.css (revision 44504) +++ src/wp-includes/css/media-views.css (working copy) @@ -48,8 +48,9 @@ box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8); - outline: none; color: #124964; + /* Only visible in Windows High Contrast mode */ + outline: 1px solid transparent; } .media-frame a.button { @@ -195,6 +196,9 @@ color: #00a0d2; border-color: #5b9dd9; box-shadow: 0 0 3px rgba( 0, 115, 170, .8 ); + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; + outline-offset: -2px; } .media-modal-close span.media-modal-icon { @@ -835,7 +839,9 @@ box-shadow: inset 0 0 2px 3px #fff, inset 0 0 0 7px #5b9dd9; - outline: none; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; + outline-offset: -6px; } .wp-core-ui .selected.attachment { @@ -1011,6 +1017,11 @@ 0 0 0 2px #0073aa; } +.wp-core-ui .attachment.selected .check:focus { + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; +} + .wp-core-ui .attachment.details .check .media-modal-icon, .wp-core-ui .media-frame.mode-grid .attachment.selected .check .media-modal-icon { background-position: -21px 0; @@ -1485,6 +1496,8 @@ box-shadow: 0 0 0 1px #fff, 0 0 2px 3px #5b9dd9; + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .wp-core-ui .media-selection .selected.attachment { @@ -1777,8 +1790,9 @@ .wp-core-ui.media-modal .image-editor .imgedit-help-toggle:focus { color: #0074a2; border-color: #5b9dd9; - outline: none; box-shadow: 0 0 3px rgba( 0, 115, 170, .8 ); + /* Only visible in Windows High Contrast mode */ + outline: 2px solid transparent; } .wp-core-ui.media-modal .imgedit-group-top .dashicons-arrow-down.imgedit-help-toggle {