From 96976034b3eda265d1da8b310b13823b8f49895d Mon Sep 17 00:00:00 2001 From: jgonzo Date: Mon, 29 Feb 2016 15:35:01 -0800 Subject: [PATCH] Implement new accessibility updates with add_theme_support. Add mobile nav styling support --- includes/functions/theme-functions.php | 5 +- style.css | 83 ++++++++++++++++++++++++++ 2 files changed, 87 insertions(+), 1 deletion(-) diff --git a/includes/functions/theme-functions.php b/includes/functions/theme-functions.php index 56f62ec..ae967a7 100755 --- a/includes/functions/theme-functions.php +++ b/includes/functions/theme-functions.php @@ -29,6 +29,9 @@ function trestle_add_theme_support() { // Add support for footer widgets if specified in Trestle settings. add_theme_support( 'genesis-footer-widgets', trestle_get_option( 'footer_widgets_number' ) ); + //* Add Accessibility support + add_theme_support( 'genesis-accessibility', array( 'headings', 'drop-down-menu', 'search-form', 'skip-links', 'rems' ) ); + } add_action( 'after_setup_theme', 'trestle_remove_genesis_css_enqueue' ); @@ -482,4 +485,4 @@ function trestle_is_current_or_descendant_post( $post_id = '', $target_id = '' ) return false; -} +} \ No newline at end of file diff --git a/style.css b/style.css index 571cba2..e9f2130 100755 --- a/style.css +++ b/style.css @@ -24,6 +24,7 @@ - Objects - Forms & Buttons - Tables + - Screen Reader Text - Structure and Layout - Site Containers - Bubble Layout @@ -641,6 +642,81 @@ td { padding: 0.6rem 0; } +/* ## Screen reader text +--------------------------------------------- */ + +.screen-reader-text, +.screen-reader-text span, +.screen-reader-shortcut { + position: absolute !important; + clip: rect(0, 0, 0, 0); + height: 1px; + width: 1px; + border: 0; + overflow: hidden; + color: #333; + background: #fff; +} + +.screen-reader-text:focus, +.screen-reader-shortcut:focus, +.genesis-nav-menu .search input[type="submit"]:focus, +.widget_search input[type="submit"]:focus { + clip: auto !important; + height: auto; + width: auto; + display: block; + font-size: 1em; + font-weight: bold; + padding: 15px 23px 14px; + z-index: 100000; /* Above WP toolbar. */ + text-decoration: none; + box-shadow: 0 0 2px 2px rgba(0,0,0,.6); +} + +.more-link { + position: relative; +} + +/* # Skip Links +---------------------------------------------------------------------------------------------------- */ +.genesis-skip-link li { + height: 0; + width: 0; + list-style: none; +} + +/* ## Accessible Menu +--------------------------------------------- */ + +.menu .menu-item:focus { + position: static; +} + +.menu .menu-item > a:focus + ul.sub-menu, +.menu .menu-item.sfHover > ul.sub-menu { + left: auto; + opacity: 1; +} + +/* hide sub-menus */ +ul.sub-menu, +.genesis-nav-menu [class*="current-"] > ul.sub-menu.open, +.genesis-nav-menu [class*="current_"] > ul.sub-menu.open { + display: none !important; +} + +.genesis-nav-menu ul.sub-menu.open, +.genesis-nav-menu ul.sub-menu.open { + display: block !important; +} + + +/* hide arrow indicators */ +span.sf-sub-indicator { + display: none; +} + /* Structure and Layout ---------------------------------------------------------------------------------------------------- */ @@ -2212,6 +2288,13 @@ Media Queries padding-right: 0; } + /* show sub-menus */ + ul.sub-menu, + .genesis-nav-menu ul.sub-menu.open, + .genesis-nav-menu ul.sub-menu.open { + display: block !important; + } + /* Header --------------------------------------------- */