VACMS-17188 Remaining Find Forms links fixes and accessibility fixes

department-of-veterans-affairs · Mar 13, 2024 · 1a6fe99 · 1a6fe99
1 parent 7d38181
commit 1a6fe99
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 27 deletions.
diff --git a/src/site/layouts/va_form.drupal.liquid b/src/site/layouts/va_form.drupal.liquid
@@ -155,7 +155,6 @@
                     <i
                       aria-hidden="true"
                       class="fas fa-download fa-lg vads-u-margin-right--1 va-form-layout--remove-pointer-events"
-                      role="presentation"
                     > </i>
                     {% assign translatedDownloadText = vaForm.entity.fieldVaFormLanguage | deriveLanguageTranslation: 'downloadVaForm', vaForm.entity.fieldVaFormNumber %}
                     {{ translatedDownloadText }} (PDF)
@@ -180,11 +179,12 @@
                 {% for vaFormLinkTeaser in fieldVaFormLinkTeasers %}
                   <li>
                     <h3 class="vads-u-font-size--h4">
-                      <a
+                      <va-link
+                        disable-analytics
                         href="{{ vaFormLinkTeaser.entity.fieldLink.url.path }}"
-                        onclick="recordEvent({ event: 'nav-linkslist', 'links-list-header': '{{ vaFormLinkTeaser.entity.fieldLink.title | escape }}', 'links-list-section-header': '{{ linkTeasersHeader | escape }}' })">
-                        {{ vaFormLinkTeaser.entity.fieldLink.title }}
-                      </a>
+                        onclick="recordEvent({ event: 'nav-linkslist', 'links-list-header': '{{ vaFormLinkTeaser.entity.fieldLink.title | escape }}', 'links-list-section-header': '{{ linkTeasersHeader | escape }}' })"
+                        text="{{ vaFormLinkTeaser.entity.fieldLink.title }}"
+                      />
                     </h3>
                     <p class="vads-u-margin--0">{{ vaFormLinkTeaser.entity.fieldLinkSummary }}</p>
                   </li>
@@ -193,41 +193,43 @@
                 {% comment %} The default related links if custom links aren't defined {% endcomment %}
                 <li>
                   <h3 class="vads-u-font-size--h4">
-                    <a
+                    <va-link
+                      disable-analytics
                       href="/change-direct-deposit"
-                      onclick="recordEvent({ event: 'nav-linkslist', 'links-list-header': 'Change your direct deposit information', 'links-list-section-header': '{{ linkTeasersHeader | escape }}' })">
-                      Change your direct deposit information
-                    </a>
+                      onclick="recordEvent({ event: 'nav-linkslist', 'links-list-header': 'Change your direct deposit information', 'links-list-section-header': '{{ linkTeasersHeader | escape }}' })"
+                      text="Change your direct deposit information"
+                    />
                   </h3>
                   <p class="vads-u-margin--0">Find out how to update your direct deposit information online for disability compensation, pension, or education benefits. </p>
                 </li>
                 <li>
                   <h3 class="vads-u-font-size--h4">
-                    <a
+                    <va-link
+                      disable-analytics
                       href="/change-address"
-                      onclick="recordEvent({ event: 'nav-linkslist', 'links-list-header': 'Change your address', 'links-list-section-header': '{{ linkTeasersHeader | escape }}' })">
-                      Change your address
-                    </a>
+                      onclick="recordEvent({ event: 'nav-linkslist', 'links-list-header': 'Change your address', 'links-list-section-header': '{{ linkTeasersHeader | escape }}' })"
+                      text="Change your address"
+                    />
                   </h3>
                   <p class="vads-u-margin--0">Find out how to change your address and other information in your VA.gov profile for disability compensation, claims and appeals, VA health care, and other benefits.</p>
                 </li>
                 <li>
                   <h3 class="vads-u-font-size--h4">
-                    <a
+                    <va-link
                       href="/records/get-military-service-records/"
-                      onclick="recordEvent({ event: 'nav-linkslist', 'links-list-header': 'Request your military records, including DD214', 'links-list-section-header': '{{ linkTeasersHeader | escape }}' })">
-                      Request your military records, including DD214
-                    </a>
+                      onclick="recordEvent({ event: 'nav-linkslist', 'links-list-header': 'Request your military records, including DD214', 'links-list-section-header': '{{ linkTeasersHeader | escape }}' })"
+                      text="Request your military records, including DD214"
+                    />
                   </h3>
                   <p class="vads-u-margin--0">Submit an online request to get your DD214 or other military service records through the milConnect website.</p>
                 </li>
                 <li>
                   <h3 class="vads-u-font-size--h4">
-                    <a
+                    <va-link
                       href="/records/"
-                      onclick="recordEvent({ event: 'nav-linkslist', 'links-list-header': 'Get your VA records and documents online', 'links-list-section-header': '{{ linkTeasersHeader | escape }}' })">
-                      Get your VA records and documents online
-                    </a>
+                      onclick="recordEvent({ event: 'nav-linkslist', 'links-list-header': 'Get your VA records and documents online', 'links-list-section-header': '{{ linkTeasersHeader | escape }}' })"
+                      text="Get your VA records and documents online"
+                    />
                   </h3>
                   <p class="vads-u-margin--0">Learn how to access your VA records, benefit letters, and documents online.</p>
                 </li>

diff --git a/src/site/paragraphs/linkTeaser.drupal.liquid b/src/site/paragraphs/linkTeaser.drupal.liquid
@@ -37,11 +37,13 @@
   {% if header === "h3" %}
     {% if link.title != empty %}
         <h3 class="{{ headerClass }}">
-            <a href="{{link.url.path}}" class="vads-u-text-decoration--underline"
-            {% if linkTeaser.options["target"] %}target="{{ linkTeaser.options["target"] }}"{% endif %}
-            >
-            {{ link.title }}
-            </a>
+            <va-link
+                href="{{link.url.path}}"
+                text="{{ link.title }}"
+                {% if linkTeaser.options["target"] %}
+                    target="{{ linkTeaser.options["target"] }}"
+                {% endif %}
+            />
         </h3>
     {% endif %}
   {% else %}

diff --git a/src/site/paragraphs/lists_of_links.drupal.liquid b/src/site/paragraphs/lists_of_links.drupal.liquid
@@ -22,7 +22,7 @@
           <!-- See more articles link -->
           {% if vaParagraph.entity.fieldLink.url.path %}
             <li class="vads-u-padding-y--1">
-              <va-link active class="vads-u-text-decoration--none" href="{{ vaParagraph.entity.fieldLink.url.path }}" text="{{ vaParagraph.entity.fieldLink.title }}">
+              <va-link active href="{{ vaParagraph.entity.fieldLink.url.path }}" text="{{ vaParagraph.entity.fieldLink.title }}">
                 <i class="fa fa-chevron-right vads-u-padding-left--0p5 vads-u-font-size--sm" aria-hidden="true" role="presentation"></i>
               </va-link>
             </li>