Fixes #9913: Removed aria-hidden and using is-active for targeting active tabs

Changes:
- Removed aria hidden from scss
- Added `display: block` to `is-active` state
- Safely Removed `aria-hidden` attribute as doing nothing now!

diff --git a/js/foundation.tabs.js b/js/foundation.tabs.js
index 898cdf5062a31f0f78c6b757eafb53c123f5a05d..1bdab9d0aa273fa9b88a94d4349e832c9f6801c1 100644 (file)
--- a/js/foundation.tabs.js
+++ b/js/foundation.tabs.js
@@ -65,7 +65,6 @@ class Tabs {
 
       $tabContent.attr({
         'role': 'tabpanel',
-        'aria-hidden': !isActive,
         'aria-labelledby': linkId
       });
 
@@ -280,7 +279,6 @@ class Tabs {
 
       $targetContent
         .addClass(`${this.options.panelActiveClass}`)
-        .attr({'aria-hidden': ''});
   }
 
   /**
@@ -296,7 +294,6 @@ class Tabs {
 
     $(`#${$target_anchor.attr('aria-controls')}`)
       .removeClass(`${this.options.panelActiveClass}`)
-      .attr({ 'aria-hidden': 'true' });
   }
 
   /**

diff --git a/scss/components/_tabs.scss b/scss/components/_tabs.scss
index f1c393fcd8dc4e2c44dbd1b0daa122675e3cb3a9..56d962dd73d5ef3ec48233876cb2e89bf90b9365 100644 (file)
--- a/scss/components/_tabs.scss
+++ b/scss/components/_tabs.scss
@@ -138,7 +138,7 @@ $tab-content-padding: 1rem !default;
   display: none;
   padding: $padding;
 
-  &[aria-hidden=""] {
+  &.is-active {
     display: block;
   }
 }