API-000 final css adjust (#502)

* ux adjustments * more changes * replace custom style
department-of-veterans-affairs · Aug 6, 2024 · 27e34cd · 27e34cd
1 parent b7bcd30
commit 27e34cd
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 9 deletions.
diff --git a/styles/core.scss b/styles/core.scss
@@ -90,7 +90,7 @@ $dslogon-blue: #003e73;
         margin-bottom: 1em;
 
         h2 {
-            margin-top: 0;
+            margin-top: 24px;
         }
     }
 
@@ -331,7 +331,7 @@ span.sidelines {
     }
 
     .container {
-      padding: 2em 0;
+      padding: 0 2em 0;
       color: $color-base;
     }
 
@@ -350,8 +350,8 @@ span.sidelines {
     }
 
     .help-info {
-      padding: 2em 0;
-  
+      padding: 0;
+
       p:first-of-type {
         margin-top: 0;
       }
@@ -392,7 +392,11 @@ span.sidelines {
       margin-bottom: 2em;
 
       p {
-        margin: 0.5em 0;
+        margin: 24px 0;
+      }
+
+      hr {
+        margin: 32px 0 24px;
       }
     }
 

diff --git a/views/login_selection.ejs b/views/login_selection.ejs
@@ -81,12 +81,12 @@
           <a class="usa-button mhv-signin vads-u-margin-y--1p5 vads-u-padding-y--2" href="<%-  mhv_login_link -%>">My HealtheVet</a>
         </div>
         <div class="row" id="loginNote">
-          <p class="vads-u-font-size--base vads-u-margin-top--3 vads-u-padding-x--2"><strong>Note:</strong> We're moving to a simpler and more modern sign-in experience. We'll remove the My HealtheVet option after <strong>January 31, 2025,</strong> and the DS Logon option after <strong>September 30, 2025.</strong><br>
+          <p class="vads-u-font-size--base vads-u-margin-top--2 vads-u-padding-x--2"><strong>Note:</strong> We're moving to a simpler and more modern sign-in experience. We'll remove the My HealtheVet option after <strong>January 31, 2025</strong> and the DS Logon option after <strong>September 30, 2025.</strong><br>
             <a href="https://www.va.gov/resources/creating-an-account-for-vagov">Learn more about creating a Login.gov or ID.me account</a>
           </p>
         </div>
         <div id="create-account">
-          <h2 class="vads-u-margin-top--3 center-text">Or create an account</h2>
+          <h2 class="vads-u-margin-top--2 center-text">Or create an account</h2>
           <div class="vads-u-display--flex vads-u-flex-direction--column">
             <% if (login_gov_signup_link_enabled) { %>
               <a href="<%= login_gov_signup_link %>" class="vads-c-action-link--blue vads-u-padding-y--2p5 vads-u-width--full logingov">
@@ -103,9 +103,9 @@
     <div class="row" id="need-help">
       <div class="columns small-12">
         <div class="help-info center-text">
-          <h2 class="vads-u-margin-top--0">Having trouble signing in?</h2>
+          <h2 class="vads-u-margin-top--2">Need Help?</h2>
           <p class="vads-u-font-size--base">Get answers to common questions about <a href="https://www.va.gov/resources/verifying-your-identity-on-vagov/">verifying your identity</a></p>
-          <p class="vads-u-font-size--base">Call our MyVA411 main information line for help at
+          <p class="vads-u-font-size--base vads-u-margin-bottom--0">Call our MyVA411 main information line for help at
             <a href="tel:+18006982411" aria-label="8 0 0. 6 9 8. 2 4 1 1">800-698-2411</a>
             <a aria-label="TTY. 7 1 1" href="tel:711">(TTY: 711)</a>. We're here 24/7.
           </p>