From f9b886536707c7604ac60c44aba4d5905b7d1474 Mon Sep 17 00:00:00 2001
From: Chris Rodriguez <github@chrisrodriguez.me>
Date: Wed, 22 Jun 2016 11:25:02 -0400
Subject: [PATCH] Hiding focus outline on programmatically focusable els

---
 cms/static/sass/_base.scss           | 4 ++--
 lms/static/sass/base/_base.scss      | 5 +++++
 lms/static/sass/shared-v2/_base.scss | 5 +++++
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 8da5903138..3fd284bdea 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -36,8 +36,8 @@ body, input, button {
   font-family: 'Open Sans', sans-serif;
 }
 
-// we want to hide the outline on the focusable <main> element
-main {
+// removing the outline on any element that we make programmatically focusable
+[tabindex="-1"] {
     outline: none;
 }
 
diff --git a/lms/static/sass/base/_base.scss b/lms/static/sass/base/_base.scss
index 485b36c6a5..140dfd905b 100644
--- a/lms/static/sass/base/_base.scss
+++ b/lms/static/sass/base/_base.scss
@@ -20,6 +20,11 @@ body {
   background: $body-bg;
 }
 
+// removing the outline on any element that we make programmatically focusable
+[tabindex="-1"] {
+    outline: none;
+}
+
 h1, h2, h3, h4, h5, h6 {
   color: $base-font-color;
   font: normal 1.2em/1.2em $serif;
diff --git a/lms/static/sass/shared-v2/_base.scss b/lms/static/sass/shared-v2/_base.scss
index 379cd0a176..e96a278064 100644
--- a/lms/static/sass/shared-v2/_base.scss
+++ b/lms/static/sass/shared-v2/_base.scss
@@ -1,5 +1,10 @@
 // LMS base styles
 
+// removing the outline on any element that we make programmatically focusable
+[tabindex="-1"] {
+    outline: none;
+}
+
 .window-wrap {
     background-color: $lms-background-color;
 }