Accessibility: Allow post boxes on the Dashboard and Classic Editor pages to be reordered by using the keyboard.
So far, it has been possible to rearrange into a new order the post boxes (also known as "widgets" on the Dashboard and "meta boxes" on the Edit post page) only by using a pointing device, for example a mouse.
This change adds new controls and functionality to allow the boxes to be rearranged also with the keyboard. Additionally, audible messages are sent to the admin ARIA live region to notify screen reader users of the reorder action result.
Props joedolson, anevins, antpb, audrasjb, xkon, MarcoZ, karmatosed, afercia.
Fixes #39074.
Built from https://develop.svn.wordpress.org/trunk@48373
git-svn-id: http://core.svn.wordpress.org/trunk@48142 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2020-07-07 15:00:02 +02:00
|
|
|
#wpwrap{height:auto;min-height:100%;width:100%;position:relative;-webkit-font-smoothing:subpixel-antialiased}#wpcontent{height:100%;padding-right:20px}#wpcontent,#wpfooter{margin-right:160px}.folded #wpcontent,.folded #wpfooter{margin-right:36px}#wpbody-content{padding-bottom:65px;float:right;width:100%;overflow:visible}#col-left{float:right;width:35%}#col-right{float:left;width:65%}#col-left .col-wrap{padding:0 0 0 6px}#col-right .col-wrap{padding:0 6px 0 0}.alignleft{float:right}.alignright{float:left}.textleft{text-align:right}.textright{text-align:left}.clear{clear:both}.wp-clearfix:after{content:"";display:table;clear:both}.screen-reader-text,.screen-reader-text span,.ui-helper-hidden-accessible{border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}.button .screen-reader-text{height:auto}.screen-reader-shortcut{position:absolute;top:-1000em}.screen-reader-shortcut:focus{right:6px;top:-25px;height:auto;width:auto;display:block;font-size:14px;font-weight:600;padding:15px 23px 14px;background:#f1f1f1;color:#0073aa;z-index:100000;line-height:normal;box-shadow:0 0 2px 2px rgba(0,0,0,.6);text-decoration:none;outline:2px solid transparent;outline-offset:-2px}.hidden,.js .closed .inside,.js .hide-if-js,.js .wp-core-ui .hide-if-js,.js.wp-core-ui .hide-if-js,.no-js .hide-if-no-js,.no-js .wp-core-ui .hide-if-no-js,.no-js.wp-core-ui .hide-if-no-js{display:none}#menu-management .menu-edit,#menu-settings-column .accordion-container,.comment-ays,.feature-filter,.imgedit-group,.manage-menus,.menu-item-handle,.popular-tags,.stuffbox,.widget-inside,.widget-top,.widgets-holder-wrap,.wp-editor-container,p.popular-tags,table.widefat{border:1px solid #ccd0d4;box-shadow:0 1px 1px rgba(0,0,0,.04)}.comment-ays,.feature-filter,.imgedit-group,.popular-tags,.stuffbox,.widgets-holder-wrap,.wp-editor-container,p.popular-tags,table.widefat{background:#fff}body,html{height:100%;margin:0;padding:0}body{background:#f1f1f1;color:#444;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;font-size:13px;line-height:1.4em;min-width:600px}body.iframe{min-width:0;padding-top:1px}body.modal-open{overflow:hidden}body.mobile.modal-open #wpwrap{overflow:hidden;position:fixed;height:100%}iframe,img{border:0}td{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit}a{color:#0073aa;transition-property:border,background,color;transition-duration:.05s;transition-timing-function:ease-in-out}a,div{outline:0}a:active,a:hover{color:#006799}.wp-person a:focus .gravatar,a:focus,a:focus .media-icon img{color:#124964;box-shadow:0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8);outline:1px solid transparent}#adminmenu a:focus{box-shadow:none;outline:1px solid transparent;outline-offset:-1px}.screen-reader-text:focus{box-shadow:none;outline:0}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}.wp-die-message,p{font-size:13px;line-height:1.5;margin:1em 0}blockquote{margin:1em}dd,li{margin-bottom:6px}h1,h2,h3,h4,h5,h6{display:block;font-weight:600}h1{color:#23282d;font-size:2em;margin:.67em 0}h2,h3{color:#23282d;font-size:1.3em;margin:1em 0}.update-core-php h2{margin-top:2em}.update-messages h2,.update-php h2,h4{font-size:1em;margin:1.33em 0}h5{font-size:.83em;margin:1.67em 0}h6{font-size:.67em;margin:2.33em 0}ol,ul{padding:0}ul{list-style:none}ol{list-style-type:decimal;margin-right:2em}ul.ul-disc{list-style:disc outside}ul.ul-square{list-style:square outside}ol.ol-decimal{list-style:decimal outside}ol.ol-decimal,ul.ul-disc,ul.ul-square{margin-right:1.8em}ol.ol-decimal>li,ul.ul-disc>li,ul.ul-square>li{margin:0 0 .5em}.ltr{direction:ltr}.code,code{font-family:Consolas,Monaco,monospace;direction:ltr;unicode-bidi:embed}code,kbd{padding:3px 5px 2px 5px;margin:0 1px;background:#eaeaea;background:rgba(0,0,0,.07);font-size:13px}.subsubsub{list-style:none;margin:8px 0 0;padding:0;font-size:13px;float:right;color
|
2020-07-04 12:44:03 +02:00
|
|
|
*/.ui-draggable-handle,.ui-sortable-handle{touch-action:none}.accordion-section{border-bottom:1px solid #ddd;margin:0}.accordion-section.open .accordion-section-content,.no-js .accordion-section .accordion-section-content{display:block}.accordion-section.open:hover{border-bottom-color:#ddd}.accordion-section-content{display:none;padding:10px 20px 15px;overflow:hidden;background:#fff}.accordion-section-title{margin:0;padding:12px 15px 15px;position:relative;border-right:1px solid #ddd;border-left:1px solid #ddd;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.js .accordion-section-title{cursor:pointer}.js .accordion-section-title:after{position:absolute;top:12px;left:10px;z-index:1}.accordion-section-title:focus{outline:1px solid transparent}.accordion-section-title:focus:after,.accordion-section-title:hover:after{border-color:#a0a5aa transparent;outline:1px solid transparent}.cannot-expand .accordion-section-title{cursor:auto}.cannot-expand .accordion-section-title:after{display:none}.control-section .accordion-section-title,.customize-pane-child .accordion-section-title{border-right:none;border-left:none;padding:10px 14px 11px 10px;line-height:1.55;background:#fff}.control-section .accordion-section-title:after,.customize-pane-child .accordion-section-title:after{top:calc(50% - 10px)}.js .control-section .accordion-section-title:focus,.js .control-section .accordion-section-title:hover,.js .control-section.open .accordion-section-title,.js .control-section:hover .accordion-section-title{color:#23282d;background:#f5f5f5}.control-section.open .accordion-section-title{border-bottom:1px solid #ddd}.network-admin .edit-site-actions{margin-top:0}.my-sites{display:block;overflow:auto;zoom:1}.my-sites li{display:block;padding:8px 3%;min-height:130px;margin:0}@media only screen and (max-width:599px){.my-sites li{min-height:0}}@media only screen and (min-width:600px){.my-sites.striped li{background-color:#fff;position:relative}.my-sites.striped li:after{content:"";width:1px;height:100%;position:absolute;top:0;left:0;background:#ccc}}@media only screen and (min-width:600px) and (max-width:699px){.my-sites li{float:right;width:44%}.my-sites.striped li{background-color:#fff}.my-sites.striped li:nth-of-type(2n+1){clear:right}.my-sites.striped li:nth-of-type(2n+2):after{content:none}.my-sites li:nth-of-type(4n+1),.my-sites li:nth-of-type(4n+2){background-color:#f9f9f9}}@media only screen and (min-width:700px) and (max-width:1199px){.my-sites li{float:right;width:27.333333%;background-color:#fff}.my-sites.striped li:nth-of-type(3n+3):after{content:none}.my-sites li:nth-of-type(6n+1),.my-sites li:nth-of-type(6n+2),.my-sites li:nth-of-type(6n+3){background-color:#f9f9f9}}@media only screen and (min-width:1200px) and (max-width:1399px){.my-sites li{float:right;width:21%;padding:8px 2%;background-color:#fff}.my-sites.striped li:nth-of-type(4n+1){clear:right}.my-sites.striped li:nth-of-type(4n+4):after{content:none}.my-sites li:nth-of-type(8n+1),.my-sites li:nth-of-type(8n+2),.my-sites li:nth-of-type(8n+3),.my-sites li:nth-of-type(8n+4){background-color:#f9f9f9}}@media only screen and (min-width:1400px) and (max-width:1599px){.my-sites li{float:right;width:16%;padding:8px 2%;background-color:#fff}.my-sites.striped li:nth-of-type(5n+1){clear:right}.my-sites.striped li:nth-of-type(5n+5):after{content:none}.my-sites li:nth-of-type(10n+1),.my-sites li:nth-of-type(10n+2),.my-sites li:nth-of-type(10n+3),.my-sites li:nth-of-type(10n+4),.my-sites li:nth-of-type(10n+5){background-color:#f9f9f9}}@media only screen and (min-width:1600px){.my-sites li{float:right;width:12.666666%;padding:8px 2%;background-color:#fff}.my-sites.striped li:nth-of-type(6n+1){clear:right}.my-sites.striped li:nth-of-type(6n+6):after{content:none}.my-sites li:nth-of-type(12n+1),.my-sites li:nth-of-type(12n+2),.my-sites li:nth-of-type(12n+3),.my-sites li:nth-of-type(12n+4),.my-sites li:nth-of-type(12n+5),.my-sites li:nth-of-type(12n+6){background-color:#f9f9f9}}.my-sites li a{text-decoration:none}@media print,(-webkit-min-device-pixel-rat
|