makes pre code blocks accessible via keyboard so they can be scrolled

rocketvalidator · Mar 17, 2020 · d2e1d90 · d2e1d90
1 parent d774f84
commit d2e1d90
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/docs/js/extra.js b/docs/js/extra.js
@@ -0,0 +1,11 @@
+// Makes code blocks accessible via keyboard,
+// so they can be scrolled without a mouse.
+//
+// More info:
+// https://dequeuniversity.com/rules/axe/3.5/scrollable-region-focusable
+// https://webaim.org/techniques/keyboard/tabindex
+
+var codeblocks = document.querySelectorAll('pre code');
+for (var i=0; i < codeblocks.length; i++) {
+    codeblocks[i].setAttribute("tabindex", "0");
+}
diff --git a/mkdocs.yml b/mkdocs.yml
@@ -5,8 +5,6 @@ nav:
 theme:
   name: material
   language: en
-  features:
-    - instant
   logo: img/rocket-icon-300x300.png
 extra:
   social:
@@ -28,3 +26,5 @@ markdown_extensions:
 extra_css:
     - css/extra.css
     - css/codehilite/borland.css
+extra_javascript:
+    - js/extra.js