feat: Restore all outlines for greater accessibility (#3829)

Restore all outlines on components that are focusable to increase accessibility of these components. BREAKING CHANGE: restoring the outlines changes the skin slightly and potentially break users. Fixes #3200.
videojs · Jan 18, 2017 · 29ffbfb · 29ffbfb
1 parent 57af15c
commit 29ffbfb
Show file tree

Hide file tree

Showing 5 changed files with 0 additions and 5 deletions.
diff --git a/src/css/_utilities.scss b/src/css/_utilities.scss
@@ -24,7 +24,6 @@
   border: 0;
   clip: rect(0 0 0 0);
   height: 1px;
-  margin: -1px;
   overflow: hidden;
   padding: 0;
   position: absolute;

diff --git a/src/css/components/_big-play.scss b/src/css/components/_big-play.scss
@@ -36,7 +36,6 @@
 
 .video-js:hover .vjs-big-play-button,
 .video-js .vjs-big-play-button:focus {
-  outline: 0;
   border-color: $primary-foreground-color;
 
   @include background-color-with-alpha($secondary-background-color, $secondary-background-transparency);

diff --git a/src/css/components/_control.scss b/src/css/components/_control.scss
@@ -2,7 +2,6 @@
 // It's used on both real buttons (play button)
 // and div buttons (menu buttons)
 .video-js .vjs-control {
-  outline: none;
   position: relative;
   text-align: center;
   margin: 0;

diff --git a/src/css/components/_slider.scss b/src/css/components/_slider.scss
@@ -1,5 +1,4 @@
 .video-js .vjs-slider {
-  outline: 0;
   position: relative;
   cursor: pointer;
   padding: 0;

diff --git a/src/css/components/menu/_menu.scss b/src/css/components/menu/_menu.scss
@@ -37,7 +37,6 @@
 
 .vjs-menu li.vjs-menu-item:focus,
 .vjs-menu li.vjs-menu-item:hover {
-  outline: 0;
   @include background-color-with-alpha($secondary-background-color, $secondary-background-transparency);
 }