Customizer: Add screen reader text to announce that panels and sections are expandable.

props joedolson, ocean90.
fixes #27591.
Built from https://develop.svn.wordpress.org/trunk@29240


git-svn-id: http://core.svn.wordpress.org/trunk@29024 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Sergey Biryukov 2014-07-19 02:37:16 +00:00
parent 53c599563c
commit 440be3565d

View File

@ -177,7 +177,10 @@ class WP_Customize_Section {
} }
?> ?>
<li id="accordion-section-<?php echo esc_attr( $this->id ); ?>" class="<?php echo esc_attr( $classes ); ?>"> <li id="accordion-section-<?php echo esc_attr( $this->id ); ?>" class="<?php echo esc_attr( $classes ); ?>">
<h3 class="accordion-section-title" tabindex="0"><?php echo esc_html( $this->title ); ?></h3> <h3 class="accordion-section-title" tabindex="0">
<?php echo esc_html( $this->title ); ?>
<span class="screen-reader-text"><?php _e( 'Press return or enter to expand' ); ?></span>
</h3>
<ul class="accordion-section-content"> <ul class="accordion-section-content">
<?php if ( ! empty( $this->description ) ) : ?> <?php if ( ! empty( $this->description ) ) : ?>
<li><p class="description customize-section-description"><?php echo $this->description; ?></p></li> <li><p class="description customize-section-description"><?php echo $this->description; ?></p></li>
@ -241,7 +244,10 @@ class WP_Customize_Panel extends WP_Customize_Section {
protected function render() { protected function render() {
?> ?>
<li id="accordion-section-<?php echo esc_attr( $this->id ); ?>" class="control-section control-panel accordion-section"> <li id="accordion-section-<?php echo esc_attr( $this->id ); ?>" class="control-section control-panel accordion-section">
<h3 class="accordion-section-title" tabindex="0"><?php echo esc_html( $this->title ); ?></h3> <h3 class="accordion-section-title" tabindex="0">
<?php echo esc_html( $this->title ); ?>
<span class="screen-reader-text"><?php _e( 'Press return or enter to open panel' ); ?></span>
</h3>
<span class="control-panel-back" tabindex="-1"><span class="screen-reader-text"><?php _e( 'Back' ); ?></span></span> <span class="control-panel-back" tabindex="-1"><span class="screen-reader-text"><?php _e( 'Back' ); ?></span></span>
<ul class="accordion-sub-container control-panel-content"> <ul class="accordion-sub-container control-panel-content">
<li class="accordion-section control-section<?php if ( empty( $this->description ) ) echo ' cannot-expand'; ?>"> <li class="accordion-section control-section<?php if ( empty( $this->description ) ) echo ' cannot-expand'; ?>">