department-of-veterans-affairs · Mottie · Jan 31, 2025 · Jan 31, 2025
@@ -82,7 +82,9 @@ const ITFBanner = props => {
     <div className="itf-inner vads-l-grid-container vads-u-padding-left--0 vads-u-padding-bottom--5">
       <div className="usa-content">
         {message}
-        <div className="vads-u-margin-top--2">{itfExpander}</div>
+        <div className="vads-u-margin-top--2 vads-u-padding-bottom--2">
+          {itfExpander}
+        </div>
         <VaButtonPair
           class="vads-u-margin-top--2"
           continue

@@ -90,7 +90,7 @@ export const PrimaryPhone = ({
       <form onSubmit={handlers.onSubmit}>
         <div name="topScrollElement" />
         <VaRadio
-          class="vads-u-margin-y--2"
+          class="vads-u-margin-top--2 vads-u-margin-bottom--4"
           label={content.label}
           label-header-level={onReviewPage ? 4 : 3}
           hint="We may need to contact you if we have questions about your Supplemental Claim."

@@ -7,7 +7,10 @@ export const content = {
     'If you want to limit what we can request from your non-VA medical provider(s), describe the limitation (for example, you want your doctor to release only treatment dates or certain types of disabilities)',
 
   info: (
-    <va-additional-info trigger="What does &quot;limiting consent&quot; mean?">
+    <va-additional-info
+      class="vads-u-margin-bottom--4"
+      trigger="What does &quot;limiting consent&quot; mean?"
+    >
       <p>
         If you choose to limit consent, you’re limiting the type or amount of
         information that your doctor or medical facility can release to us. It

@@ -6,7 +6,7 @@ export const evidenceWillUploadTitle =
 export const evidenceWillUploadInfo = (
   <va-additional-info
     trigger="Types of supporting evidence"
-    class="vads-u-margin-top--2"
+    class="vads-u-margin-top--2 vads-u-margin-bottom--4"
     uswds
   >
     <div>

@@ -81,7 +81,7 @@ livingSituationReviewField.propTypes = {
 export const domesticViolenceInfo = (
   <va-additional-info
     trigger="Are you experiencing domestic violence?"
-    class="vads-u-margin-bottom--4"
+    class="vads-u-margin-y--4"
   >
     If you need help because of domestic violence, call the National Domestic
     Violence hotline <va-telephone contact="8007997233" /> (

@@ -17,7 +17,7 @@ export const content = {
         appeals process for the issues you have selected. You’re likely to get a
         faster decision on your claim when you switch to the new process.
       </p>
-      <p>
+      <p className="vads-u-margin-bottom--4">
         If you want to continue your claim in the old appeals process, don’t
         submit a Supplemental Claim. Check your decision notice for more details
         about the appeals process.

@@ -7,7 +7,10 @@ export const optionForMstHint =
   'This option is for an indicator on your health record and will not affect the status or decision for your claim.';
 
 export const supportInfo = (
-  <va-additional-info trigger="How can I find support?">
+  <va-additional-info
+    trigger="How can I find support?"
+    class="vads-u-margin-bottom--4"
+  >
     <div>
       <p className="vads-u-margin-top--0">
         <va-link

@@ -8,6 +8,7 @@ export default {
       title: content.textAreaTitle,
       hint: content.textAreaHint,
       labelHeaderLevel: 3,
+      classNames: 'vads-u-margin-bottom--4',
       required: () => true,
       errorMessages: {
         required: content.errorMessage,

@@ -19,6 +19,7 @@ export default {
     [EVIDENCE_VA]: yesNoUI({
       title: requestVaRecordsTitleOld,
       enableAnalytics: true,
+      classNames: 'vads-u-margin-bottom--4',
       labelHeaderLevel: '3',
       labels: {
         Y: 'Yes',

@@ -22,6 +22,7 @@ export default {
       ...checkboxGroupUI({
         title: facilityTypeTitle,
         enableAnalytics: true,
+        classNames: 'vads-u-margin-bottom--6',
         required: true,
         labelHeaderLevel: '3',
         labels: facilityTypeChoices,

@@ -11,6 +11,7 @@ export default {
   uiSchema: {
     housingRisk: yesNoUI({
       title: housingRiskTitle,
+      classNames: 'vads-u-margin-bottom--4',
       enableAnalytics: true,
       labelHeaderLevel: '3',
       labels: {

@@ -22,6 +22,7 @@ export default {
       ...radioUI({
         title: optionIndicatorLabel,
         hint: optionIndicatorHint,
+        classNames: 'vads-u-margin-bottom--4',
         enableAnalytics: true,
         labelHeaderLevel: '3',
         labels: optionIndicatorChoices,

@@ -17,7 +17,10 @@ export default {
       'ui:description': pointOfContactTitle,
     },
     pointOfContactName: textUI(pointOfContactNameLabel),
-    pointOfContactPhone: phoneUI(pointOfContactPhoneLabel),
+    pointOfContactPhone: phoneUI({
+      title: pointOfContactPhoneLabel,
+      classNames: 'vads-u-margin-bottom--4',
+    }),
   },
   schema: {
     type: 'object',

@@ -180,6 +180,7 @@ const AddIssue = ({
         <VaTextInput
           id="issue-name"
           name="issue-name"
+          class="vads-u-margin-bottom--4"
           type="text"
           label={content.name.label}
           required
@@ -188,13 +189,10 @@ const AddIssue = ({
           onBlur={handlers.onInputBlur}
           error={((submitted || inputDirty) && showIssueNameError) || null}
           message-aria-describedby={content.name.hintText}
-          uswds
         >
           {content.name.hint}
         </VaTextInput>
 
-        <br role="presentation" />
-
         <VaMemorableDate
           name="decision-date"
           label={content.date.label}
@@ -211,7 +209,7 @@ const AddIssue = ({
           month-select={false}
           uswds
         />
-        <p>
+        <p className="vads-u-margin-top--6">
           <va-button
             id="cancel"
             secondary

@@ -94,7 +94,7 @@
    uiSchema,
  } = props;

  const files = formData || [];
  const [progress, setProgress] = useState(0);
  const [uploadRequest, setUploadRequest] = useState(null);
  const [isUploading, setIsUploading] = useState(hasSomeUploading(files));
@@ -402,7 +402,7 @@
      </VaModal>
      {files.length > 0 && (
        <ul className="schemaform-file-list">
          {files.map((file, index) => {
            const errors =
              errorSchema?.[index]?.__errors ||
              [file.errorMessage].filter(error => error);
@@ -644,7 +644,9 @@
       showButtons && (
         <div
           id="upload-wrap"
-          className={showUpload ? '' : 'vads-u-display--none'}
+          className={
+            showUpload ? 'vads-u-margin-bottom--2' : 'vads-u-display--none'
+          }
         >
           {/* eslint-disable jsx-a11y/label-has-associated-control */}
           <label

@@ -88,9 +88,7 @@ const VeteranInformation = ({ formData }) => {
         </p>
       </div>
 
-      <br role="presentation" />
-
-      <p>
+      <p className="vads-u-margin-top--2 vads-u-margin-bottom--4">
         <strong>Note:</strong> If you need to update your personal information,
         you can call us at <va-telephone contact={CONTACTS.VA_BENEFITS} />.
         We’re here Monday through Friday, 8:00 a.m. to 9:00 p.m.{' '}

@@ -171,7 +171,10 @@ NoneSelectedAlert.propTypes = {
 };
 
 export const ContestableIssuesAdditionalInfo = (
-  <va-additional-info trigger="Why isn’t my issue listed here?" uswds>
+  <va-additional-info
+    trigger="Why isn’t my issue listed here?"
+    class="vads-u-margin-top--3 vads-u-margin-bottom--4"
+  >
     If you don’t see your issue or decision listed here, it may not be in our
     system yet. This can happen if it’s a more recent claim decision. If you
     have a decision date, you can add a new issue now.