VACMS-17436: Update links for manage your health care section (#2174)

--------- Co-authored-by: Chris Kim
department-of-veterans-affairs · Jul 12, 2024 · 1e1d357 · 1e1d357
1 parent 7c12360
commit 1e1d357
Show file tree

Hide file tree

Showing 2 changed files with 49 additions and 4 deletions.
diff --git a/src/site/assets/sass/style.scss b/src/site/assets/sass/style.scss
@@ -54,6 +54,18 @@
   word-wrap: break-word;
 }
 
+.health-online-desktop-link {
+  @media (max-width: 767px) {
+    display: none !important;
+  }
+}
+
+.health-online-mobile-link {
+  @media (min-width: 768px) {
+    display: none !important;
+  }
+}
+
 // START: Styles for mobile app promo banner
 #alert-with-additional-info {
 

diff --git a/src/site/layouts/health_care_region_page.drupal.liquid b/src/site/layouts/health_care_region_page.drupal.liquid
@@ -57,17 +57,17 @@
           {% if fieldAdministration.entity.entityId != '1039' %}
           <section>
             {% if fieldAdministration.entity.entityId == '1040' %}
-              <h3>Manage your VA health online</h3>
+              <h2>Manage your VA health online</h2>
             {% else %}
-              <h3>Manage your health online</h3>
+              <h2>Manage your health online</h2>
             {% endif %}
             <div class="vads-u-display--flex medium-screen:vads-u-flex-direction--row vads-u-flex-direction--column">
               <div class="vads-u-margin-right--0 medium-screen:vads-u-margin-right--3">
                 <div class="vads-facility-hub-cta vads-u-display--flex vads-u-align-items--center">
                   <va-icon
                     class="vads-u-color--link-default vads-facility-hub-cta-circle vads-u-margin-right--1"
                     size="3"
-                    icon="medication"
+                    icon="pill"
                   ></va-icon>
                   <va-link
                     disable-analytics
@@ -80,7 +80,7 @@
                   <va-icon
                     class="vads-u-color--link-default vads-facility-hub-cta-circle vads-u-margin-right--1"
                     size="3"
-                    icon="chat"
+                    icon="forum"
                   ></va-icon>
                   <va-link
                     disable-analytics
@@ -102,6 +102,17 @@
                     text="Schedule and manage health appointments"
                   ></va-link>
                 </div>
+                <div class="vads-facility-hub-cta vads-u-display--flex vads-u-align-items--center health-online-desktop-link">
+                  <va-icon
+                    class="vads-u-color--link-default vads-facility-hub-cta-circle vads-u-margin-right--1"
+                    size="3"
+                    icon="chat"
+                  ></va-icon>
+                  <va-link
+                    href="https://mobile.va.gov/app/va-health-chat"
+                    text="Download VA Health Chat"
+                  ></va-link>
+                </div>
               </div>
               <div>
                 <div class="vads-facility-hub-cta vads-u-display--flex vads-u-align-items--center">
@@ -143,6 +154,28 @@
                     text="Order hearing aid batteries and accessories"
                   ></va-link>
                 </div>
+                <div class="vads-facility-hub-cta vads-u-display--flex vads-u-align-items--center health-online-mobile-link">
+                  <va-icon
+                    class="vads-u-color--link-default vads-facility-hub-cta-circle vads-u-margin-right--1"
+                    size="3"
+                    icon="chat"
+                  ></va-icon>
+                  <va-link
+                    href="https://mobile.va.gov/app/va-health-chat"
+                    text="Download VA Health Chat"
+                  ></va-link>
+                </div>
+                <div class="vads-facility-hub-cta vads-u-display--flex vads-u-align-items--center">
+                  <va-icon
+                    class="vads-u-color--link-default vads-facility-hub-cta-circle vads-u-margin-right--1"
+                    size="3"
+                    icon="phone"
+                  ></va-icon>
+                  <va-link
+                    href="https://www.va.gov/health/connect-to-va-care/index.asp"
+                    text="Connect to VA care"
+                  ></va-link>
+                </div>
               </div>
             </div>
           </section>