fix(logingov-modals): use modal-info, use standard padding between grafs

benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html

@@ -23,5 +23,5 @@
         </div>
     </div>
 
-    {% include "eligibility/includes/modal--senior-start-help.html" with id="identity-verification-help" %}
+    {% include "eligibility/includes/modal--senior-start-help.html" with size="modal-lg" id="identity-verification-help" %}
 {% endblock body %}

benefits/eligibility/templates/eligibility/includes/modal--senior-help.html

@@ -1,21 +1,23 @@
-{% extends "core/includes/modal.html" %}
+{% extends "core/includes/modal-info.html" %}
 {% load i18n %}
 {% load static %}
 
 {% block modal-content %}
-    <h2 class="px-lg-3">
+    <h2>
         {% translate "eligibility.pages.index.senior.help.headline" %}
         <img class="icon" width="197" height="26" src="{% static "img/login-gov-logo.svg" %}" alt="{% translate "core.logos.login_gov" context "image alt text" %}" />
     </h2>
-    <h3 class="pt-4 pt-lg-3 px-lg-3">{% translate "eligibility.pages.index.senior.help.sub_headline[0]" %}</h3>
-    <p class="pt-1 pt-lg-3 px-lg-3">{% translate "eligibility.pages.index.senior.help.p[0]" %}</p>
+    <div class="row">
+        <h3 class="pt-4">{% translate "eligibility.pages.index.senior.help.sub_headline[0]" %}</h3>
+        <p class="pt-1">{% translate "eligibility.pages.index.senior.help.p[0]" %}</p>
 
-    <h3 class="pt-4 pt-lg-3 px-lg-3">{% translate "eligibility.pages.index.senior.help.sub_headline[1]" %}</h3>
-    <p class="pt-1 pt-lg-3 px-lg-3">{% translate "eligibility.pages.index.senior.help.p[1]" %}</p>
+        <h3 class="pt-4">{% translate "eligibility.pages.index.senior.help.sub_headline[1]" %}</h3>
+        <p class="pt-1">{% translate "eligibility.pages.index.senior.help.p[1]" %}</p>
 
-    <p class="py-4 py-lg-3 px-lg-3">{% translate "eligibility.pages.index.senior.help.p[2]" %}</p>
+        <p class="pt-4">{% translate "eligibility.pages.index.senior.help.p[2]" %}</p>
 
-    <p class="d-block d-sm-none">
-        <a href="#" data-bs-dismiss="modal" aria-label="Close">{% translate "core.modals.back" %}</a>
-    </p>
+        <p class="pt-4 d-block d-sm-none">
+            <a href="#" data-bs-dismiss="modal" aria-label="Close">{% translate "core.modals.back" %}</a>
+        </p>
+    </div>
 {% endblock modal-content %}

benefits/eligibility/templates/eligibility/includes/modal--senior-start-help.html

@@ -1,18 +1,20 @@
-{% extends "core/includes/modal.html" %}
+{% extends "core/includes/modal-info.html" %}
 {% load i18n %}
 {% load static %}
 
 {% block modal-content %}
-    <h2 class="px-lg-3">
+    <h2>
         {% translate "eligibility.pages.start.senior.help.headline" %}
         <img class="icon" width="197" height="26" src="{% static "img/login-gov-logo.svg" %}" alt="{% translate "core.logos.login_gov" context "image alt text" %}" />
     </h2>
-    <p class="pt-1 pt-lg-3 px-lg-3">{% translate "eligibility.pages.start.senior.help.p[0]" %}</p>
-    <p class="pt-1 pt-lg-3 px-lg-3">{% translate "eligibility.pages.start.senior.help.p[1]" %}</p>
-    <p class="py-4 py-lg-3 px-lg-3">{% translate "eligibility.pages.start.senior.help.p[2]" %}</p>
-    <p class="py-4 py-lg-3 px-lg-3">{% translate "eligibility.pages.start.senior.help.p[3]" %}</p>
-    <p class="py-4 py-lg-3 px-lg-3">{% translate "eligibility.pages.start.senior.help.p[4]" %}</p>
-    <p class="pt-4 d-block d-sm-none">
-        <a href="#" data-bs-dismiss="modal" aria-label="Close">{% translate "core.modals.back" %}</a>
-    </p>
+    <div class="row">
+        <p class="pt-3">{% translate "eligibility.pages.start.senior.help.p[0]" %}</p>
+        <p class="pt-4">{% translate "eligibility.pages.start.senior.help.p[1]" %}</p>
+        <p class="pt-4">{% translate "eligibility.pages.start.senior.help.p[2]" %}</p>
+        <p class="pt-4">{% translate "eligibility.pages.start.senior.help.p[3]" %}</p>
+        <p class="pt-4">{% translate "eligibility.pages.start.senior.help.p[4]" %}</p>
+        <p class="pt-4 d-block d-sm-none">
+            <a href="#" data-bs-dismiss="modal" aria-label="Close">{% translate "core.modals.back" %}</a>
+        </p>
+    </div>
 {% endblock modal-content %}

benefits/eligibility/templates/eligibility/includes/selection-label--senior.html

@@ -13,5 +13,5 @@
         <span class="fallback-text color-logo">Login.gov</span>
     </button>.
 
-    {% include "eligibility/includes/modal--senior-help.html" with id="login-gov-help" %}
+    {% include "eligibility/includes/modal--senior-help.html" with id="login-gov-help" size="modal-lg" %}
 {% endblock description %}