Merge pull request #406 from tdtds/improve_a11y

improve accessibility

Author: Ken Johnson

app/assets/javascripts/bootstrap-timepicker.js

@@ -745,14 +745,14 @@
                 case 'modal':
                     template = '<div class="bootstrap-timepicker modal hide fade in" style="top: 30%; margin-top: 0; width: 200px; margin-left: -100px;" data-backdrop="'+ (this.modalBackdrop ? 'true' : 'false') +'">'+
                                    '<div class="modal-header">'+
-                                       '<a href="#" class="close" data-dismiss="modal">×</a>'+
+                                       '<a href="#" class="close" aria-label="dismiss" data-dismiss="modal">×</a>'+
                                        '<h4>Pick a Time</h4>'+
                                    '</div>'+
                                    '<div class="modal-content">'+
                                         templateContent +
                                    '</div>'+
                                    '<div class="modal-footer">'+
-                                       '<a href="#" class="btn btn-primary" data-dismiss="modal">Ok</a>'+
+                                       '<a href="#" class="btn btn-primary" aria-label=dismiss" data-dismiss="modal">Ok</a>'+
                                    '</div>'+
                                '</div>';
 

app/views/admin/get_all_users.html.erb

@@ -26,7 +26,7 @@
               <%= u.email%>
             </td>
             <td>
-              <%= u.admin ? %{<span class="fs1" aria-hidden="true" data-icon="&#xe0fe;"}.html_safe : nil %>
+              <%= u.admin ? %{<span class="fs1" aria-label="check" data-icon="&#xe0fe;"}.html_safe : nil %>
             </td>
             <td>
               <%= link_to "Edit", "#", {:onClick => "javascript:openEditModal(#{u.id});", :role => "button", :style => "width:70px", :class => "btn btn-inverse", "data-toggle" => "modal"}%>

app/views/admin/get_user.html.erb

@@ -1,6 +1,6 @@
 <!-- Begin Modal -->
     <div class="modal-header">
-      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
+      <button type="button" class="close" data-dismiss="modal" aria-label="dismiss">
         ×
       </button>
       <h4 id="myModalLabel1">

app/views/dashboard/home.html.erb

@@ -10,12 +10,12 @@
             <!-- Begin Title Buttons-->
             <div class="tools pull-right">
               <div class="btn-group">
-                <a id="change_to_bar_graph" class="btn btn-small">
-                  <span data-icon="&#xe14b;"></span>
-                </a>
-                <a id="change_to_pie_charts" class="btn btn-small">
-                  <span data-icon="&#xe096;"></span>
-                </a>
+                <button id="change_to_bar_graph" class="btn btn-small">
+                  <span aria-label="change to bar graph" data-icon="&#xe14b;"></span>
+                </button>
+                <button id="change_to_pie_charts" class="btn btn-small">
+                  <span aria-label="change to pie charts" data-icon="&#xe096;"></span>
+                </button>
               </div>
             </div>
             <!-- End Title Buttons-->

app/views/layouts/shared/_header.html.erb

@@ -3,14 +3,14 @@
 
       <span style="color:#eee;margin-left:10px;">
         Font Size:
-        <a data-no-turbolink='true' href="/dashboard/home?font=8pt" style="font-size:10pt;color:#eee;">A</a>
-        <a data-no-turbolink='true' href="/dashboard/home?font=200%25" style="font-size:18pt;color:#eee;">A</a>
+        <a data-no-turbolink='true' href="/dashboard/home?font=8pt" style="font-size:10pt;color:#eee" aria-label="small font">A</a>
+        <a data-no-turbolink='true' href="/dashboard/home?font=200%25" style="font-size:18pt;color:#eee;" aria-label="large font">A</a>
       </span>
 
       <div class="user-profile">
-        <a data-toggle="dropdown" class="dropdown-toggle">
+        <button data-toggle="dropdown" class="dropdown-toggle">
           <img src=" <%= image_path('profile_color.jpg')%>"  alt="profile">
-        </a>
+        </button>
         <span class="caret"></span>
         <ul class="dropdown-menu pull-right">
           <li>

app/views/layouts/shared/_messages.html.erb

@@ -2,17 +2,17 @@
   <% name = name.to_sym %>
   <% if name == :error %>
     <div class="alert alert-error">
-      <a class="close" data-dismiss="alert" href="#">×</a>
+      <a class="close" aria-label="dismiss" data-dismiss="alert" href="#">×</a>
           <%= content_tag :div, msg, :id => "flash_notice" %>
     </div>
   <% elsif name == :success %>
     <div class="alert alert-success">
-      <a class="close" data-dismiss="alert" href="#">×</a>
+      <a class="close" aria-label="dismiss" data-dismiss="alert" href="#">×</a>
           <%= content_tag :div, msg, :id => "flash_notice" %>
     </div>
   <% elsif name == :info %>
     <div class="alert alert-info">
-      <a class="close" data-dismiss="alert" href="#">×</a>
+      <a class="close" aria-label="dismiss" data-dismiss="alert" href="#">×</a>
         <%= content_tag :div, msg, :id => "flash_notice" %>
     </div>
   <% end %>