Improves filter checkbox labelling

fixes CNVS-13880

Added aria-labels to the checkboxes so their effect was clearer to
screenreaders.

Test Plan:
* Using a screenreader go the discussions page and navigate to the
  "Unread" and "Assignments" filter checkboxes
* Using a screenreader go to the announcements page and navigate to the
  "Unread" filter checkbox
* Using a screenreader go to the home page, select an announcement and navigate to the
  "Unread" filter checkbox
* Ensure that the checkboxes are descriptive of the function the
  checkbox performs from the screenreaders perspective

Change-Id: Ie27d2dd3905e55c64b59c05b22d56926bf6bb2b6
Reviewed-on: https://gerrit.instructure.com/45286
Tested-by: Jenkins <jenkins@instructure.com>
Reviewed-by: Brad Horrocks <bhorrocks@instructure.com>
Reviewed-by: Joel Hough <joel@instructure.com>
QA-Review: Steven Shepherd <sshepherd@instructure.com>
Product-Review: Aaron Cannon <acannon@instructure.com>

app/views/discussion_topics/show.html.erb

@@ -243,19 +243,19 @@
         <div class="headerBar" data-sticky>
           <div class="row-fluid form-inline" style="overflow: visible;">
             <div class="span9">
-              <label id="discussion-search-label" class="screenreader-only" for="discussion-search"><%= t("search_entries_placeholder", "Search entries or author") %></label>
               <input
                 id               = "discussion-search"
                 type             = "text"
-                aria-labelledby  = "discussion-search-label"
+                aria-label       = "<%= t("Search entries or author") %>"
-                placeholder      = "<%= t("search_entries_placeholder", "Search entries or author") %>"
+                placeholder      = "<%= t("Search entries or author") %>"
                 size             = 50
               >
 
               <input
                 type    = "checkbox"
                 id      = "onlyUnread"
-              ><label for="onlyUnread"><%= t('unread', 'Unread') %></label>
+                aria-label = "<%= t("filter replies by unread") %>"
+              ><label aria-hidden="true" for="onlyUnread"><%= t('unread', 'Unread') %></label>
 
               &nbsp; &nbsp;
               <button id="collapseAll" class="btn disableWhileFiltering" title="<%= t('collapse_replies', 'Collapse replies') %>" aria-label="<%= t('collapse_replies', 'Collapse replies') %>">

app/views/jst/DiscussionTopics/IndexView.handlebars

@@ -41,18 +41,20 @@
       </button>
     </div>
     <div class="headerBar-left form-inline index_view_filter_form">
-      <label class="hidden-inline-text" for="searchTerm">{{#t "search_title_body_or_author"}}Search title, body, or author{{/t}}</label>
       <input id="searchTerm"
-             placeholder="{{#t "search_title_body_or_author"}}Search title, body, or author{{/t}}"
+             placeholder="{{t "Search title, body, or author"}}"
+             aria-label="{{t "Search title, body, or author"}}"
              value="{{searchTerm}}"
              type="search">
       <span id="discussionsFilter">
         <input type="checkbox"
                id="onlyUnread"
-               {{#if onlyUnread}}checked{{/if}} /><label for="onlyUnread">{{#t "unread"}}Unread{{/t}}</label>
+               aria-label="{{t "filter discussions by unread"}}"
+               {{#if onlyUnread}}checked{{/if}} /><label aria-hidden="true" for="onlyUnread">{{#t "unread"}}Unread{{/t}}</label>
         <input type="checkbox"
                id="onlyGraded"
-               {{#if onlyGraded}}checked{{/if}}/><label for="onlyGraded">{{#t "assignments"}}Assignments{{/t}}</label>
+               aria-label="{{t "filter discussions by assignments"}}"
+               {{#if onlyGraded}}checked{{/if}}/><label aria-hidden="true" for="onlyGraded">{{#t "assignments"}}Assignments{{/t}}</label>
       </span>
     </div>
   </div>

app/views/jst/announcements/IndexView.handlebars

@@ -25,15 +25,16 @@
       {{/if}}
     </div>
     <div class="headerBar-left form-inline index_view_filter_form">
-      <label class="hidden-inline-text" for="searchTerm">{{#t "search_title_body_or_author"}}Search title, body, or author{{/t}}</label>
       <input id="searchTerm"
-             placeholder="{{#t "search_title_body_or_author"}}Search title, body, or author{{/t}}"
+             placeholder="{{t "Search title, body, or author"}}"
+             aria-label="{{t "Search title, body, or author"}}"
              value="{{searchTerm}}"
              type="search">
       <span id="discussionsFilter">
         <input type="checkbox"
                id="onlyUnread"
-               {{#if onlyUnread}}checked{{/if}} /><label for="onlyUnread">{{#t "unread"}}Unread{{/t}}</label>
+               aria-label="{{t "filter announcements by unread"}}"
+               {{#if onlyUnread}}checked{{/if}} /><label aria-hidden="true" for="onlyUnread">{{#t "unread"}}Unread{{/t}}</label>
       </span>
     </div>
   </div>