VOTE-1163/1162: Accessibility updates - logos and search AND regions (#…

…729)
usagov · Jun 3, 2024 · a4138df · a4138df
1 parent c411836
commit a4138df
Show file tree

Hide file tree

Showing 9 changed files with 14 additions and 14 deletions.
diff --git a/web/themes/custom/votegov/src/sass/uswds-overrides/usa-search.scss b/web/themes/custom/votegov/src/sass/uswds-overrides/usa-search.scss
@@ -13,7 +13,7 @@
   form {
     &:focus-within {
       .usa-input {
-        background-position: 5% 45%;
+        background-position: 2% 40%;
         background-color: $bg-light-cool;
         border-color: $base-primary;
         -webkit-transition: width .3s ease-in-out;

diff --git a/web/themes/custom/votegov/templates/block/block--system-branding-block.html.twig b/web/themes/custom/votegov/templates/block/block--system-branding-block.html.twig
@@ -17,7 +17,7 @@
   <div class="usa-logo">
     {% if site_name %}
       <a href="{{ path('<front>') }}" rel="home" title="{{ site_name }}">
-        <span>{{ source( directory ~ '/img/logo.svg' ) }}</span>
+        <img src="{{ theme_path }}/img/logo.svg" role="img" alt="{{ 'Vote.gov - Home' | t}}" />
       </a>
     {% endif %}
   </div>

diff --git a/web/themes/custom/votegov/templates/block/block-content--search.html.twig b/web/themes/custom/votegov/templates/block/block-content--search.html.twig
@@ -20,11 +20,11 @@
 
   <label class="usa-sr-only" for="search-field-en-small">{{ content.field_search_placeholder | field_value }}</label>
 
-  <input id="usa-search-input" class="usa-input" data-test="searchBox" id="search-field-en-small" type="search" name="query"
+  <input id="usa-search-input" class="usa-input" aria-label="{{ 'Submit' | t }}" data-test="searchBox" id="search-field-en-small" type="search" name="search"
          autocomplete="off"
          placeholder="{{ content.field_search_placeholder | field_value }} {{ affiliated_search != '1' ? '(in English)' | t }}">
 
-  <button class="usa-button usa-button--unstyled usa-button--search" data-test="searchBtn" type="submit" name="commit" data-disable-with="Search">
+  <button class="usa-button usa-button--unstyled usa-button--search" data-test="searchBtn" type="submit" name="submit" data-disable-with="Search">
     {{ source( directory ~ '/img/svg/arrow.svg' ) }}
   </button>
 </form>
diff --git a/web/themes/custom/votegov/templates/component/usagov-partner.html.twig b/web/themes/custom/votegov/templates/component/usagov-partner.html.twig
@@ -1,6 +1,6 @@
 <div class="vote-usagov-partner">
   {# USA.gov Links #}
-  <nav class="vote-usagov-partner__links" aria-label={{ "Election links" | t }}>
+  <nav class="vote-usagov-partner__links" aria-label={{ "External election resources" | t }}>
     {# USA.gov election info links #}
     {{ drupal_entity('block_content', '18') }}
   </nav>

diff --git a/web/themes/custom/votegov/templates/embedded-content/ec-placeholder--sitemap-menu.html.twig b/web/themes/custom/votegov/templates/embedded-content/ec-placeholder--sitemap-menu.html.twig
@@ -2,6 +2,6 @@
 {% set legacy_link %}
   <li class="usa-list usa-list--unstyled"><a href="{{ path('entity.node.canonical', { 'node': 63 }) }}">{{ drupal_field('title', 'node', 63) }}</a></li>
 {% endset %}
-<nav class="vote-sitemap vote-sitemap--menu">
+<div class="vote-sitemap vote-sitemap--menu">
   {{ htmlsitemap | default(legacy_link) }}
-</nav>
+</div>
diff --git a/web/themes/custom/votegov/templates/navigation/menu--main--votegov-mainnavigation.html.twig b/web/themes/custom/votegov/templates/navigation/menu--main--votegov-mainnavigation.html.twig
@@ -27,9 +27,9 @@ We call a macro which calls itself to render the full tree.
 @see https://twig.symfony.com/doc/1.x/tags/macro.html
 #}
 {% set attributes = attributes.addClass('menu') %}
-<nav aria-label="{{ 'Primary navigation' | t }}" class="usa-nav" data-test="mainNav">
+<nav aria-label="{{ 'Primary' | t }}" class="usa-nav" data-test="mainNav">
   {{ menus.menu_links(items, attributes, 0, 'basic-mega-nav-section-') }}
-  <section id="usa-search--expandable" aria-label="{{ 'Search component' | t }}">
+  <section id="usa-search--expandable" aria-label="{{ 'Search' | t }}">
     {{ drupal_entity('block_content', 2) }}
   </section>
 </nav>

diff --git a/web/themes/custom/votegov/templates/paragraph/paragraph--hero.html.twig b/web/themes/custom/votegov/templates/paragraph/paragraph--hero.html.twig
@@ -5,7 +5,7 @@
  */
 #}
 
-<section class="vote-hero" aria-label="{{ 'Introduction' | t }}">
+<section class="vote-hero">
   <div class="vote-hero__container">
     {% if content.field_media | render %}
       <div class="vote-hero__image">

diff --git a/web/themes/custom/votegov/templates/paragraph/paragraph--registration-tool.html.twig b/web/themes/custom/votegov/templates/paragraph/paragraph--registration-tool.html.twig
@@ -31,7 +31,7 @@
                placeholder="{{ content.field_placeholder | field_value }}" data-test="stateInput"
                aria-autocomplete="list" aria-expanded="true" aria-controls="vote-registration-tool__results">
         <div class="vote-registration-tool__list-container">
-          <nav id="vote-registration-tool__results" class="vote-registration-tool__nav" role="listbox"
+          <div id="vote-registration-tool__results" class="vote-registration-tool__nav" role="listbox"
                aria-label="{{ 'States and territories list' | t }}">
             <ul class="vote-registration-tool__list" data-test="stateList">
               {% set results = drupal_view_result('state_territory', 'block') %}
@@ -47,7 +47,7 @@
                 <span tabindex="0" data-key="">{{ "No matching results. Please check spelling." | t }}</span>
               </li>
             </ul>
-          </nav>
+          </div>
         </div>
       </form>
     </div>

diff --git a/web/themes/custom/votegov/templates/views/views-view--sitemap.html.twig b/web/themes/custom/votegov/templates/views/views-view--sitemap.html.twig
@@ -4,10 +4,10 @@
  * Theme override for a main view:sitemap template.
  */
 #}
-<nav class="vote-sitemap vote-sitemap--register">
+<div class="vote-sitemap vote-sitemap--register">
   {% if rows %}
       {{ rows }}
   {% elseif empty %}
       {{ empty }}
   {% endif %}
-</nav>
+</div>