Changeset 31925

Timestamp:

03/30/2015 03:08:30 AM (11 years ago)

Author:

azaozz

Message:

Press This: fix accessibility for the post options "sidebar". Fix size of the Add Category button.
Part props afercis, joedolson. Fixes #31575.

Location:

trunk/src/wp-admin

Files:

• css/press-this.css (modified) (3 diffs)
• includes/class-wp-press-this.php (modified) (1 diff)
• js/press-this.js (modified) (4 diffs)

trunk/src/wp-admin/css/press-this.css

@@ -855 +855 @@
 .add-cat-toggle {
         float: right;
-        margin-top: -33px;
+        margin-top: -45px;
+        line-height: 20px;
+        padding: 12px 10px 8px;
 }
 
@@ -864 +866 @@
 
 .add-cat-toggle.is-toggled {
-        margin-top: -36px;
+        padding: 10px;
 }
 
@@ -1186 +1188 @@
 }
 
-.options-open,
-.options-close {
+.options,
+.options.open .on-closed,
+.options.closed .on-open {
         display: none;
 }
 
 @media (max-width: 900px) {
-        .options-open,
-        .options-close {
+        .options {
                 display: block;
         }
 }
 
-.options-open.is-hidden,
-.options-close.is-hidden,
 .options-panel-back.is-hidden {
         display: none;
 }
 
-.options-open:focus .dashicons {
+.options:focus .dashicons {
         color: #fff;
         text-decoration: none;
 }
 
-.options-open .dashicons {
+.options .dashicons {
         margin-top: 3px;
 }
 
-.options-close {
+.options {
         color: #2ea2cc;
 }

trunk/src/wp-admin/includes/class-wp-press-this.php

@@ -1202 +1202 @@
                         </a>
                 </h1>
-                <button type="button" class="options-open button-subtle">
-                        <span class="dashicons dashicons-tag"></span><span class="screen-reader-text"><?php _e( 'Show post options' ); ?></span>
+                <button type="button" class="options button-subtle closed">
+                        <span class="dashicons dashicons-tag on-closed"></span>
+                        <span class="screen-reader-text on-closed"><?php _e( 'Show post options' ); ?></span>
+                        <span aria-hidden="true" class="on-open"><?php _e( 'Done' ); ?></span>
+                        <span class="screen-reader-text on-open"><?php _e( 'Hide post options' ); ?></span>
                 </button>
-                <button type="button" class="options-close button-subtle is-hidden"><?php _e( 'Done' ); ?></button>
         </div>
 

trunk/src/wp-admin/js/press-this.js

@@ -489 +489 @@
                         sidebarIsOpen = true;
 
-                        $( '.options-open, .press-this-actions, #scanbar' ).addClass( isHidden );
-                        $( '.options-close, .options-panel-back' ).removeClass( isHidden );
+                        $( '.options' ).removeClass( 'closed' ).addClass( 'open' );
+                        $( '.press-this-actions, #scanbar' ).addClass( isHidden );
+                        $( '.options-panel-back' ).removeClass( isHidden );
 
                         $( '.options-panel' ).removeClass( offscreenHidden )
-                                .one( 'transitionend', function() {
+                                .one( transitionEndEvent, function() {
                                         $( '.post-option:first' ).focus();
                                 } );
@@ -501 +502 @@
                         sidebarIsOpen = false;
 
-                        $( '.options-close, .options-panel-back' ).addClass( isHidden );
-                        $( '.options-open, .press-this-actions, #scanbar' ).removeClass( isHidden );
+                        $( '.options' ).removeClass( 'open' ).addClass( 'closed' );
+                        $( '.options-panel-back' ).addClass( isHidden );
+                        $( '.press-this-actions, #scanbar' ).removeClass( isHidden );
 
                         $( '.options-panel' ).addClass( isOffScreen )
-                                .one( 'transitionend', function() {
+                                .one( transitionEndEvent, function() {
                                         $( this ).addClass( isHidden );
                                         // Reset to options list
@@ -621 +623 @@
                         monitorCatList();
 
-                        $( '.options-open' ).on( 'click.press-this', openSidebar );
-                        $( '.options-close' ).on( 'click.press-this', closeSidebar );
+                        $( '.options' ).on( 'click.press-this', function() {
+                                if ( $( this ).hasClass( 'open' ) ) {
+                                        closeSidebar();
+                                } else {
+                                        openSidebar();
+                                }
+                        });
 
                         // Close the sidebar when focus moves outside of it.
@@ -633 +640 @@
                                                 ( node.nodeName === 'BODY' ||
                                                         ( ! $node.closest( '.options-panel' ).length &&
-                                                        ! $node.closest( '.options-open' ).length ) ) ) {
+                                                        ! $node.closest( '.options' ).length ) ) ) {
 
                                                 closeSidebar();