make h1 readable by screen readers in rubrics page

added a screenreader html property to the H1 tag
to make it readable for the screen reader and
bypass the display none property.

fixes EVAL-1940
flag=none

test plan:
- click on the admin option in the main navigation
  left panel.
- click on the rubrics tab.
- enable mac voice over.
- notice the voice over detects the header tag
  is present.
- use the element inspector of the web browser to
  check that the h1 tag contains
  the class "screenreader-only".

Change-Id: Ie385073af771dfef699bba82d1c82fbd8bd29b09
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/272978
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Syed Hussain <shussain@instructure.com>
Reviewed-by: Aaron Shafovaloff <ashafovaloff@instructure.com>
QA-Review: Syed Hussain <shussain@instructure.com>
Product-Review: Syed Hussain <shussain@instructure.com>

app/views/rubrics/index.html.erb

@@ -41,7 +41,7 @@
   </style>
 
 <% js_bundle 'rubrics_index' %>
-<h1>
+<h1 class="screenreader-only">
   <% case @context.class.to_s %>
     <% when 'Course' %>
       <%= t 'course_rubrics', "Course Rubrics" %>