Address feedback from AWS accessibility

Author: mullermp

templates/default/fulldoc/html/css/style.css

@@ -85,7 +85,6 @@ body {
 @media (max-width: 320px) {
   body { height: 100%; overflow: hidden; overflow-wrap: break-word; }
   #main { height: 100%; overflow: auto; }
-  #search { display: none; }
 }
 
 #main img { max-width: 100%; }
@@ -389,6 +388,16 @@ ul.fullTree li:last-child { padding-bottom: 0; }
   text-align: center;
 }
 
+.visually-hidden {
+  position: absolute;
+  top: auto;
+  overflow: hidden;
+  clip: rect(1px, 1px, 1px,  1px);
+  width: 1px;
+  height: 1px;
+  white-space: nowrap;
+}
+
 #menu { font-size: 1.3em; color: #bbb; }
 #menu .title, #menu a { font-size: 0.7em; }
 #menu .title a { font-size: 1em; }

templates/default/fulldoc/html/js/full_list.js

@@ -108,7 +108,7 @@ function enableSearch() {
     }
   });
 
-  $('#full_list').after("<div id='noresults' role='status' style='display:none'></div>");
+  $('#full_list').after("<div id='noresults' role='status' style='visually-hidden'></div>");
 }
 
 function ignoredKeyPress(event) {
@@ -136,7 +136,7 @@ function clearSearch() {
 function performSearch(searchString) {
   clearSearchTimeout();
   $('#full_list, #content').addClass('insearch');
-  $('#noresults').text('').hide();
+  $('#noresults').text('').addClass('visually-hidden');
   partialSearch(searchString, 0);
 }
 
@@ -173,11 +173,12 @@ function searchDone() {
   highlight();
   var found = $('#full_list li:visible').size();
   if (found === 0) {
-    $('#noresults').text('No results were found.').hide().fadeIn();
+    $('#noresults').text('No results were found.');
   } else {
     // This is read out to screen readers
-    $('#noresults').text('There are ' + found + ' results.').hide().fadeIn();
+    $('#noresults').text('There are ' + found + ' results.');
   }
+  $('#noresults').removeClass('visually-hidden');
   $('#content').removeClass('insearch');
 }
 

templates/default/fulldoc/html/setup.rb

@@ -232,7 +232,7 @@ def class_list(root = Registry.root, tree = TreeContext.new)
     out << "<li id='object_#{child.path}' class='#{tree.classes.join(' ')}'>"
     out << "<div class='item' style='padding-left:#{tree.indent}'>"
     accessible_props = "aria-label='#{name} child nodes' aria-expanded='false' aria-controls='object_#{child.path}'"
-    out << "<a tabindex='0' class='toggle' #{accessible_props}></a> " if has_children
+    out << "<a tabindex='0' class='toggle' role='button' #{accessible_props}></a> " if has_children
     out << linkify(child, name)
     out << " &lt; #{child.superclass.name}" if child.is_a?(CodeObjects::ClassObject) && child.superclass
     out << "<small class='search_info'>"