twig: update aria-labelledby to aria-label for search section, add ro…

…le=search to search for accessibility. For #519

src/templates/partials/midd-header.twig

@@ -45,17 +45,15 @@
       </ul>
     </nav>
 
-    <section class="midd-search" aria-labelledby="midd-search-label">
-      <h2 class="sr-only" id="midd-search-label">Search</h2>
+    <section class="midd-search" aria-label="Search">
       <a href="/search" class="midd-search__handle" role="button" data-toggle-target=".js-midd-search" data-toggle-group="midd-header" data-toggle-focus=".js-midd-search-input" aria-expanded="false" aria-haspopup="true" aria-labelledby="midd-search__handle-label">
         {% include 'partials/icon.twig' with { name: 'search', class: 'midd-search__mag' } %}
         {% include 'partials/icon.twig' with { name: 'times', class: 'midd-search__times' } %}
         <span class="d-none d-sm-inline" id="midd-search__handle-label">Search</span>
       </a>
 
       <div class="midd-search__content js-midd-search">
-        <form action="https://www.middlebury.edu/search" method="GET">
-          <label for="midd-search-input" class="sr-only">Search</label>
+        <form action="https://www.middlebury.edu/search" method="GET" role="search">
           <div class="input-group">
             <input type="search" class="form-control form-control--sm midd-search__input js-midd-search-input" id="midd-search-input" placeholder="Search" name="q2" required/>
             <button type="submit" class="button button--sm midd-search__submit">