From 3ec1c95062459e46d37f4e44c545f8eef84a79d0 Mon Sep 17 00:00:00 2001 From: Ian Stewart Date: Fri, 24 Oct 2014 15:15:20 +0000 Subject: [PATCH] Twenty Fifteen: valid HTML for accessible child page menu expanding and collapsing -- now with even better accessiblity. Props afercia, davidakennedy, iamtakashi, fixes #30083. Built from https://develop.svn.wordpress.org/trunk@30013 git-svn-id: http://core.svn.wordpress.org/trunk@30013 1a063a9b-81f0-0310-95a4-ce76da25c4cd --- wp-content/themes/twentyfifteen/css/ie.css | 4 ---- wp-content/themes/twentyfifteen/functions.php | 4 ++-- wp-content/themes/twentyfifteen/js/functions.js | 4 ++-- wp-content/themes/twentyfifteen/style.css | 12 +++--------- wp-includes/version.php | 2 +- 5 files changed, 8 insertions(+), 18 deletions(-) diff --git a/wp-content/themes/twentyfifteen/css/ie.css b/wp-content/themes/twentyfifteen/css/ie.css index 267c0031be..3d60101a3c 100644 --- a/wp-content/themes/twentyfifteen/css/ie.css +++ b/wp-content/themes/twentyfifteen/css/ie.css @@ -132,10 +132,6 @@ textarea { margin-top: 0; } -.dropdown-toggle { - margin-top: -21px; -} - .social-navigation { margin: 9.0909%; max-width: 660px; diff --git a/wp-content/themes/twentyfifteen/functions.php b/wp-content/themes/twentyfifteen/functions.php index fd49484461..776f06a252 100644 --- a/wp-content/themes/twentyfifteen/functions.php +++ b/wp-content/themes/twentyfifteen/functions.php @@ -219,8 +219,8 @@ function twentyfifteen_scripts() { wp_enqueue_script( 'twentyfifteen-script', get_template_directory_uri() . '/js/functions.js', array( 'jquery' ), '20141010', true ); wp_localize_script( 'twentyfifteen-script', 'screenReaderText', array( - 'expand' => '' . esc_html__( 'Expand', 'twentyfifteen' ) . '', - 'collapse' => '' . esc_html__( 'Collapse', 'twentyfifteen' ) . '', + 'expand' => '' . esc_html__( 'expand child menu', 'twentyfifteen' ) . '', + 'collapse' => '' . esc_html__( 'collapse child menu', 'twentyfifteen' ) . '', ) ); } add_action( 'wp_enqueue_scripts', 'twentyfifteen_scripts' ); diff --git a/wp-content/themes/twentyfifteen/js/functions.js b/wp-content/themes/twentyfifteen/js/functions.js index 6738430f03..f74718c075 100644 --- a/wp-content/themes/twentyfifteen/js/functions.js +++ b/wp-content/themes/twentyfifteen/js/functions.js @@ -9,13 +9,13 @@ $( 'html' ).removeClass( 'no-js' ); // Add dropdown toggle that display child menu items. - $( '.main-navigation .page_item_has_children > a, .main-navigation .menu-item-has-children > a' ).append( '' ); + $( '.main-navigation .page_item_has_children > a, .main-navigation .menu-item-has-children > a' ).after( '' ); $( '.dropdown-toggle' ).click( function( e ) { var _this = $( this ); e.preventDefault(); _this.toggleClass( 'toggle-on' ); - _this.parent().next( '.children, .sub-menu' ).toggleClass( 'toggled-on' ); + _this.next( '.children, .sub-menu' ).toggleClass( 'toggled-on' ); _this.attr( 'aria-expanded', _this.attr( 'aria-expanded' ) === 'false' ? 'true' : 'false' ); _this.html( _this.html() === screenReaderText.expand ? screenReaderText.collapse : screenReaderText.expand ); } ); diff --git a/wp-content/themes/twentyfifteen/style.css b/wp-content/themes/twentyfifteen/style.css index ba6205b6f6..f5f9cf0c4f 100644 --- a/wp-content/themes/twentyfifteen/style.css +++ b/wp-content/themes/twentyfifteen/style.css @@ -692,17 +692,12 @@ a:focus { -moz-box-sizing: content-box; box-sizing: content-box; content: ""; - display: block; - font-size: 15px; - font-size: 1.5rem; height: 42px; padding: 0; position: absolute; - top: 50%; + text-transform: lowercase; /* Stop screen readers to read the text as capital letters */ + top: 3px; right: 0; - -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); width: 42px; } @@ -2552,9 +2547,7 @@ span > video { } .main-navigation ul { - border-top: 1px solid #eaeaea; border-top: 1px solid rgba(51, 51, 51, 0.1); - border-bottom: 1px solid #eaeaea; border-bottom: 1px solid rgba(51, 51, 51, 0.1); } @@ -5078,6 +5071,7 @@ span > video { .dropdown-toggle { height: 32px; + top: 4px; width: 32px; } diff --git a/wp-includes/version.php b/wp-includes/version.php index f69f8f3052..9a15884185 100644 --- a/wp-includes/version.php +++ b/wp-includes/version.php @@ -4,7 +4,7 @@ * * @global string $wp_version */ -$wp_version = '4.1-alpha-30012'; +$wp_version = '4.1-alpha-30013'; /** * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.