WordPress.org

Make WordPress Core

Ticket #21283: 21283.diff

File 21283.diff, 4.5 KB (added by lessbloat, 6 years ago)
  • wp-includes/class-wp-customize-section.php

     
    8080        protected function render() {
    8181                ?>
    8282                <li id="customize-section-<?php echo esc_attr( $this->id ); ?>" class="control-section customize-section">
    83                         <h3 class="customize-section-title" title="<?php echo esc_attr( $this->description ); ?>"><?php echo esc_html( $this->title ); ?></h3>
     83                        <h3 class="customize-section-title" tabindex="0" title="<?php echo esc_attr( $this->description ); ?>"><?php echo esc_html( $this->title ); ?></h3>
    8484                        <ul class="customize-section-content">
    8585                                <?php
    8686                                foreach ( $this->controls as $control )
  • wp-admin/customize.php

     
    8383                        $cannot_expand = ! ( $screenshot || $wp_customize->theme()->get('Description') );
    8484                ?>
    8585
    86                 <div class="wp-full-overlay-sidebar-content">
     86                <div class="wp-full-overlay-sidebar-content" tabindex="-1">
    8787                        <div id="customize-info" class="customize-section<?php if ( $cannot_expand ) echo ' cannot-expand'; ?>">
    88                                 <div class="customize-section-title">
     88                                <div class="customize-section-title" tabindex="0">
    8989                                        <span class="preview-notice"><?php
    9090                                                /* translators: %s is the theme name in the Customize/Live Preview pane */
    9191                                                echo sprintf( __( 'You are previewing %s' ), '<strong class="theme-name">' . $wp_customize->theme()->display('Name') . '</strong>' );
  • wp-admin/js/customize-controls.js

     
    824824                }());
    825825
    826826                // Temporary accordion code.
    827                 $('.customize-section-title').click( function( event ) {
     827                var accordianFrozen = false;
     828                $('.customize-section-title').bind('click focus', function( event ) {
    828829                        var clicked = $( this ).parents( '.customize-section' );
    829830
    830                         if ( clicked.hasClass('cannot-expand') )
     831                        if ( clicked.hasClass('cannot-expand') || accordianFrozen )
    831832                                return;
     833                       
     834                        // Don't want to fire focus and click at same time
     835                        accordianFrozen = true;
     836                        setTimeout(function () {
     837                                accordianFrozen = false;
     838                        }, 400);
     839                       
     840                        // Scroll up if on #customize-section-title_tagline
     841                        if ('customize-section-title_tagline' === clicked.attr('id'))
     842                                $('.wp-full-overlay-sidebar-content').scrollTop(0);
    832843
    833844                        $( '.customize-section' ).not( clicked ).removeClass( 'open' );
    834845                        clicked.toggleClass( 'open' );
     
    839850                $('#save').click( function( event ) {
    840851                        previewer.save();
    841852                        event.preventDefault();
     853                }).keydown( function( event ) {
     854                        if ( 13 === event.which ) // enter
     855                                previewer.save();
     856                        event.preventDefault();
    842857                });
     858               
     859                $('.back').keydown( function( event ) {
     860                        if ( 9 === event.which ) // tab
     861                                return;
     862                        var thisHref = $(this).attr('href');
     863                        if ( 13 === event.which ) // enter
     864                                window.location = thisHref;
     865                        event.preventDefault();
     866                });
    843867
    844868                $('.collapse-sidebar').click( function( event ) {
    845869                        overlay.toggleClass( 'collapsed' ).toggleClass( 'expanded' );
     
    958982                });
    959983
    960984                api.trigger( 'ready' );
     985               
     986                // Make sure left column gets focus
     987                $('.back').focus();
     988                setTimeout(function () {
     989                        $('.back').focus();
     990                }, 800);
     991
    961992        });
    962993
    963994})( wp, jQuery );
     995 No newline at end of file
  • wp-admin/css/customize-controls.css

     
    6767
    6868.control-section:hover .customize-section-title,
    6969.control-section .customize-section-title:hover,
    70 .control-section.open .customize-section-title {
     70.control-section.open .customize-section-title,
     71.customize-section-title:focus {
    7172        color: #fff;
    7273        text-shadow: 0 -1px 0 #333;
    7374        background: #808080;
     
    126127        color: #999;
    127128}
    128129
     130#customize-info .customize-section-title:focus .preview-notice {
     131        color: #ccc;
     132        text-shadow: 0 -1px 0 #333;
     133}
     134
    129135#customize-info .theme-name {
    130136        font-size: 20px;
    131137        font-weight: 200;
     
    135141        text-shadow: 0 1px 0 #fff;
    136142}
    137143
     144#customize-info .customize-section-title:focus .theme-name {
     145        color: #fff;
     146        text-shadow: 0 -1px 0 #333;
     147}
     148
    138149#customize-info .theme-screenshot {
    139150        width: 258px;
    140151        border: 1px solid #ccc;