Ticket #21283: 21283.diff

Index: wp-includes/class-wp-customize-section.php
===================================================================
--- wp-includes/class-wp-customize-section.php  (revision 21762)
+++ wp-includes/class-wp-customize-section.php  (working copy)
@@ -80,7 +80,7 @@
        protected function render() {
                ?>
                <li id="customize-section-<?php echo esc_attr( $this->id ); ?>" class="control-section customize-section">
-                       <h3 class="customize-section-title" title="<?php echo esc_attr( $this->description ); ?>"><?php echo esc_html( $this->title ); ?></h3>
+                       <h3 class="customize-section-title" tabindex="0" title="<?php echo esc_attr( $this->description ); ?>"><?php echo esc_html( $this->title ); ?></h3>
                        <ul class="customize-section-content">
                                <?php
                                foreach ( $this->controls as $control )
Index: wp-admin/customize.php
===================================================================
--- wp-admin/customize.php      (revision 21762)
+++ wp-admin/customize.php      (working copy)
@@ -83,9 +83,9 @@
                        $cannot_expand = ! ( $screenshot || $wp_customize->theme()->get('Description') );
                ?>
 
-               <div class="wp-full-overlay-sidebar-content">
+               <div class="wp-full-overlay-sidebar-content" tabindex="-1">
                        <div id="customize-info" class="customize-section<?php if ( $cannot_expand ) echo ' cannot-expand'; ?>">
-                               <div class="customize-section-title">
+                               <div class="customize-section-title" tabindex="0">
                                        <span class="preview-notice"><?php
                                                /* translators: %s is the theme name in the Customize/Live Preview pane */
                                                echo sprintf( __( 'You are previewing %s' ), '<strong class="theme-name">' . $wp_customize->theme()->display('Name') . '</strong>' );
Index: wp-admin/js/customize-controls.js
===================================================================
--- wp-admin/js/customize-controls.js   (revision 21762)
+++ wp-admin/js/customize-controls.js   (working copy)
@@ -824,11 +824,22 @@
                }());
 
                // Temporary accordion code.
-               $('.customize-section-title').click( function( event ) {
+               var accordianFrozen = false;
+               $('.customize-section-title').bind('click focus', function( event ) {
                        var clicked = $( this ).parents( '.customize-section' );
 
-                       if ( clicked.hasClass('cannot-expand') )
+                       if ( clicked.hasClass('cannot-expand') || accordianFrozen )
                                return;
+                       
+                       // Don't want to fire focus and click at same time
+                       accordianFrozen = true;
+                       setTimeout(function () {
+                               accordianFrozen = false;
+                       }, 400);
+                       
+                       // Scroll up if on #customize-section-title_tagline
+                       if ('customize-section-title_tagline' === clicked.attr('id'))
+                               $('.wp-full-overlay-sidebar-content').scrollTop(0);
 
                        $( '.customize-section' ).not( clicked ).removeClass( 'open' );
                        clicked.toggleClass( 'open' );
@@ -839,7 +850,20 @@
                $('#save').click( function( event ) {
                        previewer.save();
                        event.preventDefault();
+               }).keydown( function( event ) {
+                       if ( 13 === event.which ) // enter
+                               previewer.save();
+                       event.preventDefault();
                });
+               
+               $('.back').keydown( function( event ) {
+                       if ( 9 === event.which ) // tab
+                               return;
+                       var thisHref = $(this).attr('href');
+                       if ( 13 === event.which ) // enter
+                               window.location = thisHref;
+                       event.preventDefault();
+               });
 
                $('.collapse-sidebar').click( function( event ) {
                        overlay.toggleClass( 'collapsed' ).toggleClass( 'expanded' );
@@ -958,6 +982,13 @@
                });
 
                api.trigger( 'ready' );
+               
+               // Make sure left column gets focus
+               $('.back').focus();
+               setTimeout(function () {
+                       $('.back').focus();
+               }, 800);
+
        });
 
 })( wp, jQuery );
\ No newline at end of file
Index: wp-admin/css/customize-controls.css
===================================================================
--- wp-admin/css/customize-controls.css (revision 21762)
+++ wp-admin/css/customize-controls.css (working copy)
@@ -67,7 +67,8 @@
 
 .control-section:hover .customize-section-title,
 .control-section .customize-section-title:hover,
-.control-section.open .customize-section-title {
+.control-section.open .customize-section-title,
+.customize-section-title:focus {
        color: #fff;
        text-shadow: 0 -1px 0 #333;
        background: #808080;
@@ -126,6 +127,11 @@
        color: #999;
 }
 
+#customize-info .customize-section-title:focus .preview-notice {
+       color: #ccc;
+       text-shadow: 0 -1px 0 #333;
+}
+
 #customize-info .theme-name {
        font-size: 20px;
        font-weight: 200;
@@ -135,6 +141,11 @@
        text-shadow: 0 1px 0 #fff;
 }
 
+#customize-info .customize-section-title:focus .theme-name {
+       color: #fff;
+       text-shadow: 0 -1px 0 #333;
+}
+
 #customize-info .theme-screenshot {
        width: 258px;
        border: 1px solid #ccc;