From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Wed, 8 Jul 2020 12:32:21 +0000 (+0200)
Subject: wip #3757 @0.5
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=7a14b275860d1785190d13611d589192ea63908a;p=fluidbook-html5.git

wip #3757 @0.5
---

diff --git a/js/libs/fluidbook/fluidbook.accessibility.js b/js/libs/fluidbook/fluidbook.accessibility.js
index 8c4780e3..8f8c4ec7 100644
--- a/js/libs/fluidbook/fluidbook.accessibility.js
+++ b/js/libs/fluidbook/fluidbook.accessibility.js
@@ -45,4 +45,36 @@ FluidbookAccessibility.prototype = {
         }
         return '<section data-page="' + page + '">' + this.fluidbook.settings.accessibleTexts[page] + '</section>';
     },
-}
\ No newline at end of file
+};
+
+/*! outline.js v1.2.0 - https://github.com/lindsayevans/outline.js/ */
+(function(d){
+
+    var style_element = d.createElement('STYLE'),
+        dom_events = 'addEventListener' in d,
+        add_event_listener = function(type, callback){
+            // Basic cross-browser event handling
+            if(dom_events){
+                d.addEventListener(type, callback);
+            }else{
+                d.attachEvent('on' + type, callback);
+            }
+        },
+        set_css = function(css_text){
+            // Handle setting of <style> element contents in IE8
+            !!style_element.styleSheet ? style_element.styleSheet.cssText = css_text : style_element.innerHTML = css_text;
+        }
+    ;
+
+    d.getElementsByTagName('HEAD')[0].appendChild(style_element);
+
+    // Using mousedown instead of mouseover, so that previously focused elements don't lose focus ring on mouse move
+    add_event_listener('mousedown', function(){
+        set_css(':focus{outline:0}::-moz-focus-inner{border:0;}');
+    });
+
+    add_event_listener('keydown', function(){
+        set_css('');
+    });
+
+})(document);
\ No newline at end of file
diff --git a/style/accessibility.less b/style/accessibility.less
index 15be9b00..8fe914dd 100644
--- a/style/accessibility.less
+++ b/style/accessibility.less
@@ -9,7 +9,7 @@
 }
 
 :focus {
-  outline: 1px dotted currentColor;
+  outline: thin dotted;
 }
 
 #q:focus{