diff --git a/benefits/core/templates/core/base.html b/benefits/core/templates/core/base.html index 84b33abde9..ef55cef6fe 100644 --- a/benefits/core/templates/core/base.html +++ b/benefits/core/templates/core/base.html @@ -1,4 +1,3 @@ - {% load i18n %} {% load static %} {% get_current_language as LANGUAGE_CODE %} @@ -70,22 +69,16 @@ {% endblock nav-buttons %}
- {% block headline %} - {% endblock headline %} -
- {% block explanatory-text-wrapper %} -
- {% block explanatory-text %} - {% endblock explanatory-text %} +
+ {% block headline %} + {% endblock headline %} + {% block inner-content %} + {% endblock inner-content %}
- {% endblock explanatory-text-wrapper %} -
- {% block inner-content %} - {% endblock inner-content %}
{% block call-to-action %} -
-
+
+
{% block call-to-action-button %} {% endblock call-to-action-button %}
diff --git a/benefits/core/templates/core/help.html b/benefits/core/templates/core/help.html index ef33259045..1db33735a6 100644 --- a/benefits/core/templates/core/help.html +++ b/benefits/core/templates/core/help.html @@ -9,13 +9,8 @@ {% block main-content %}
-
+

{% translate "Help" %}

-
-
- -
-

{% translate "What is Cal-ITP Benefits?" %}

{% blocktranslate trimmed %} @@ -137,11 +132,7 @@

{% translate "Questions?" %}

provider. {% endblocktranslate %}

-
-
-
-
{% if agency %} {% include "core/includes/agency-links.html" %} {% else %} @@ -152,8 +143,8 @@

{% translate "Questions?" %}

-
-
+
+
{% translate "Go Back" as button_text %} {% include "core/includes/button--origin.html" with button_text=button_text %}
diff --git a/benefits/core/templates/core/includes/eligibility-item.html b/benefits/core/templates/core/includes/eligibility-item.html new file mode 100644 index 0000000000..1db071dadc --- /dev/null +++ b/benefits/core/templates/core/includes/eligibility-item.html @@ -0,0 +1,8 @@ +
  • +

    + {% block heading %} + {% endblock heading %} +

    + {% block body %} + {% endblock body %} +
    • diff --git a/benefits/core/templates/core/includes/form.html b/benefits/core/templates/core/includes/form.html index 718a1dd94e..17dce922e3 100644 --- a/benefits/core/templates/core/includes/form.html +++ b/benefits/core/templates/core/includes/form.html @@ -3,41 +3,35 @@ {% url form.action_url as form_action %} -
    + {% csrf_token %} -
    -
    - {% for field in form %} -
    -
    - {# djlint:off #} - {% if field.label %} - - {% endif %} - {# djlint:on #} - - {{ field }} - - {% if field.help_text %}{{ field.help_text }}{% endif %} -
    -
    - {% endfor %} -
    +
    + {% for field in form %} +
    + {# djlint:off #} + {% if field.label %} + + {% endif %} + {# djlint:on #} + + {{ field }} + + {% if field.help_text %}{{ field.help_text }}{% endif %} +
    + {% endfor %}
    {% if form.submit_value %} -
    -
    - -
    +
    +
    {% endif %} @@ -94,6 +88,8 @@ {% endcomment %} +
    {% include "core/includes/recaptcha-text.html" %}
    + {% endif %} - {% endif %} diff --git a/benefits/core/templates/core/includes/media-item.html b/benefits/core/templates/core/includes/media-item.html deleted file mode 100644 index 4e76377234..0000000000 --- a/benefits/core/templates/core/includes/media-item.html +++ /dev/null @@ -1,16 +0,0 @@ -
  • -
    - {% block icon %} - {% endblock icon %} -
    -
    - {% block heading_wrapper %} - <{{ heading_tag|default:"h3" }} class="media-body--heading h3"> - {% block heading %} - {% endblock heading %} - - {% endblock heading_wrapper %} - {% block body %} - {% endblock body %} -
    -
    • diff --git a/benefits/core/templates/core/includes/recaptcha-text.html b/benefits/core/templates/core/includes/recaptcha-text.html new file mode 100644 index 0000000000..dbdf54c225 --- /dev/null +++ b/benefits/core/templates/core/includes/recaptcha-text.html @@ -0,0 +1,7 @@ +{% load i18n %} + +

    + {% blocktranslate trimmed %} + This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply. + {% endblocktranslate %} +

    diff --git a/benefits/core/templates/core/agency-index.html b/benefits/core/templates/core/index--agency-base.html similarity index 87% rename from benefits/core/templates/core/agency-index.html rename to benefits/core/templates/core/index--agency-base.html index 21182660fc..ac349ef589 100644 --- a/benefits/core/templates/core/agency-index.html +++ b/benefits/core/templates/core/index--agency-base.html @@ -1,4 +1,4 @@ -{% extends "core/landing.html" %} +{% extends "core/index-base.html" %} {% load i18n %} {% block title %} diff --git a/benefits/core/templates/core/index--cst.html b/benefits/core/templates/core/index--cst.html index 91c3f56285..c44930a9b7 100644 --- a/benefits/core/templates/core/index--cst.html +++ b/benefits/core/templates/core/index--cst.html @@ -1,4 +1,4 @@ -{% extends "core/agency-index.html" %} +{% extends "core/index--agency-base.html" %} {% load i18n %} {% block headline %} diff --git a/benefits/core/templates/core/index--mst.html b/benefits/core/templates/core/index--mst.html index a5eaed0a4f..7f76939af0 100644 --- a/benefits/core/templates/core/index--mst.html +++ b/benefits/core/templates/core/index--mst.html @@ -1,4 +1,4 @@ -{% extends "core/agency-index.html" %} +{% extends "core/index--agency-base.html" %} {% load i18n %} {% block headline %} diff --git a/benefits/core/templates/core/index--nevco.html b/benefits/core/templates/core/index--nevco.html index 5490f49a3a..3878f13e59 100644 --- a/benefits/core/templates/core/index--nevco.html +++ b/benefits/core/templates/core/index--nevco.html @@ -1,4 +1,4 @@ -{% extends "core/agency-index.html" %} +{% extends "core/index--agency-base.html" %} {% load i18n %} {% block headline %} diff --git a/benefits/core/templates/core/index--sacrt.html b/benefits/core/templates/core/index--sacrt.html index c4d1b5954f..73292461de 100644 --- a/benefits/core/templates/core/index--sacrt.html +++ b/benefits/core/templates/core/index--sacrt.html @@ -1,4 +1,4 @@ -{% extends "core/agency-index.html" %} +{% extends "core/index--agency-base.html" %} {% load i18n %} {% block headline %} diff --git a/benefits/core/templates/core/index--sbmtd.html b/benefits/core/templates/core/index--sbmtd.html index fc53e46e16..eb4a386a3b 100644 --- a/benefits/core/templates/core/index--sbmtd.html +++ b/benefits/core/templates/core/index--sbmtd.html @@ -1,5 +1,4 @@ -{% extends "core/agency-index.html" %} - +{% extends "core/index--agency-base.html" %} {% load i18n %} {% block headline %} diff --git a/benefits/core/templates/core/landing.html b/benefits/core/templates/core/index-base.html similarity index 100% rename from benefits/core/templates/core/landing.html rename to benefits/core/templates/core/index-base.html diff --git a/benefits/core/templates/core/index.html b/benefits/core/templates/core/index.html index 0277445985..748762cfbc 100644 --- a/benefits/core/templates/core/index.html +++ b/benefits/core/templates/core/index.html @@ -1,4 +1,4 @@ -{% extends "core/landing.html" %} +{% extends "core/index-base.html" %} {% load i18n %} {% block title %} diff --git a/benefits/core/templates/core/logged-out.html b/benefits/core/templates/core/logged-out.html index 2c3f1f1f61..45b366fb07 100644 --- a/benefits/core/templates/core/logged-out.html +++ b/benefits/core/templates/core/logged-out.html @@ -5,15 +5,7 @@ {% translate "Logged out" %} {% endblock page-title %} -{% block main-content %} -
    -
    -
    -

    - {% include "core/includes/icon.html" with name="happybus" %} - {% translate "You have successfully logged out. Thank you for using Cal-ITP Benefits!" %} -

    -
    -
    -
    -{% endblock main-content %} +{% block inner-content %} +
    {% include "core/includes/icon.html" with name="happybus" %}
    +

    {% translate "You have successfully logged out. Thank you for using Cal-ITP Benefits!" %}

    +{% endblock inner-content %} diff --git a/benefits/core/templates/core/widgets/flow-radio-select.html b/benefits/core/templates/core/widgets/flow-radio-select.html index 82df36212e..c7cafee68e 100644 --- a/benefits/core/templates/core/widgets/flow-radio-select.html +++ b/benefits/core/templates/core/widgets/flow-radio-select.html @@ -2,9 +2,9 @@ {% with id=widget.attrs.id %} - + -
    +
    {% for group, options, index in widget.optgroups %} {% if group %}
    @@ -13,7 +13,7 @@ {% endif %} {% for option in options %} -
    {% include option.template_name with widget=option %}
    +
    {% include option.template_name with widget=option %}
    {% endfor %} {% if group %} diff --git a/benefits/core/views.py b/benefits/core/views.py index 9035289780..1fe0423d1f 100644 --- a/benefits/core/views.py +++ b/benefits/core/views.py @@ -12,7 +12,7 @@ from .middleware import pageview_decorator, index_or_agencyindex_origin_decorator, user_error TEMPLATE_INDEX = "core/index.html" -TEMPLATE_AGENCY = "core/agency-index.html" +TEMPLATE_AGENCY = "core/index--agency-base.html" TEMPLATE_HELP = "core/help.html" TEMPLATE_LOGGED_OUT = "core/logged-out.html" diff --git a/benefits/eligibility/forms.py b/benefits/eligibility/forms.py index ae16efa3a9..cb1541ad75 100644 --- a/benefits/eligibility/forms.py +++ b/benefits/eligibility/forms.py @@ -28,7 +28,6 @@ def __init__(self, agency: models.TransitAgency, *args, **kwargs): super().__init__(*args, **kwargs) flows = agency.enrollment_flows.filter(supported_enrollment_methods__contains=models.EnrollmentMethods.DIGITAL) - self.classes = "col-lg-8" # second element is not used since we render the whole label using selection_label_template, # therefore set to None flow_field = self.fields["flow"] @@ -109,8 +108,8 @@ def __init__( self.title = title self.headline = headline self.blurb = blurb + self.classes = "eligibility-verification-form" - self.classes = "col-lg-6" sub_widget = widgets.FormControlTextInput(placeholder=sub_placeholder) if sub_pattern: sub_widget.attrs.update({"pattern": sub_pattern}) diff --git a/benefits/eligibility/templates/eligibility/confirm.html b/benefits/eligibility/templates/eligibility/confirm.html index 42b2743e7d..d7f264d5e2 100644 --- a/benefits/eligibility/templates/eligibility/confirm.html +++ b/benefits/eligibility/templates/eligibility/confirm.html @@ -10,23 +10,14 @@ {% endblock nav-buttons %} {% block headline %} -
    -

    {{ form.headline }}

    -
    +

    {{ form.headline }}

    {% endblock headline %} -{% block explanatory-text-wrapper %} -
    -
    - {% block explanatory-text %} -

    {{ form.blurb }}

    - {% endblock explanatory-text %} -
    -
    -{% endblock explanatory-text-wrapper %} - {% block inner-content %} -
    -
    {% include "core/includes/form.html" with form=form %}
    -
    +

    {{ form.blurb }}

    + {% include "core/includes/form.html" with form=form %} {% endblock inner-content %} + +{% comment %} Override with empty block to prevent rendering empty divs {% endcomment %} +{% block call-to-action %} +{% endblock call-to-action %} diff --git a/benefits/eligibility/templates/eligibility/includes/eligibility-item--contactless-card--start.html b/benefits/eligibility/templates/eligibility/includes/eligibility-item--contactless-card--start.html new file mode 100644 index 0000000000..d584afbc27 --- /dev/null +++ b/benefits/eligibility/templates/eligibility/includes/eligibility-item--contactless-card--start.html @@ -0,0 +1,16 @@ +{% extends "core/includes/eligibility-item.html" %} +{% load i18n %} + +{% block heading %} + {% translate "Your contactless card details" %} +{% endblock heading %} + +{% block body %} +

    + {% translate "Your contactless card must be a debit or credit card by Visa or Mastercard." %} + {% translate "Learn more about contactless cards" as text %} + {% include "core/includes/modal-trigger.html" with modal="modal--contactless" text=text period=True %} +

    + + {% include "eligibility/includes/modal--contactless.html" with id="modal--contactless" size="modal-lg" header="p-md-2 p-3" body="pb-md-3 mb-md-3 mx-md-3 py-0 pt-0 absolute-top" %} +{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--cst-agency-card.html b/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--cst-agency-card.html new file mode 100644 index 0000000000..24a9471f29 --- /dev/null +++ b/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--cst-agency-card.html @@ -0,0 +1,11 @@ +{% extends "core/includes/eligibility-item.html" %} + +{% load i18n %} + +{% block heading %} + {% translate "Your current Agency Card number" %} +{% endblock heading %} + +{% block body %} +

    {% translate "You do not need to have your physical CST Agency Card, but you will need to know the number." %}

    +{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--login-gov.html b/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--login-gov.html new file mode 100644 index 0000000000..d19e7e806a --- /dev/null +++ b/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--login-gov.html @@ -0,0 +1,23 @@ +{% extends "core/includes/eligibility-item.html" %} + +{% load i18n %} + +{% block heading %} + {% translate "A Login.gov account with identity verification" %} +{% endblock heading %} + +{% block body %} +

    + {% translate "You will be able to create an account using your email address if you do not already have one. We use your Login.gov account to verify your identity." %} + {% translate "Learn more about identity verification" as text %} + {% include "core/includes/modal-trigger.html" with modal="modal--identity-verification" text=text period=True %} +

    +

    {% translate "For this process you will need:" %}

    +
      +
    • {% translate "Your state-issued ID card" %}
      • +
    • {% translate "Your Social Security number" %}
      • +
    • {% translate "A phone number with a phone plan associated with your name" %}
      • +
    + + {% include "eligibility/includes/modal--login-gov-start-help.html" with size="modal-lg" id="modal--identity-verification" header="p-md-2 p-3" body="pb-md-3 mb-md-3 mx-md-3 py-0 pt-0 absolute-top" %} +{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--medicare.html b/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--medicare.html new file mode 100644 index 0000000000..d1da97a88f --- /dev/null +++ b/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--medicare.html @@ -0,0 +1,13 @@ +{% extends "core/includes/eligibility-item.html" %} + +{% load i18n %} + +{% block heading %} + {% translate "An online account with Medicare.gov" %} +{% endblock heading %} + +{% block body %} +

    + {% translate "If you do not have an account you will be able to create one using your red, white, and blue Medicare card. We use your Medicare.gov account to verify you qualify." %} +

    +{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--mst-agency-card.html b/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--mst-agency-card.html new file mode 100644 index 0000000000..d3da3ae5ba --- /dev/null +++ b/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--mst-agency-card.html @@ -0,0 +1,11 @@ +{% extends "core/includes/eligibility-item.html" %} + +{% load i18n %} + +{% block heading %} + {% translate "Your current Courtesy Card number" %} +{% endblock heading %} + +{% block body %} +

    {% translate "You do not need to have your physical MST Courtesy Card, but you will need to know the number." %}

    +{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--sbmtd-agency-card.html b/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--sbmtd-agency-card.html new file mode 100644 index 0000000000..7a1cef9f84 --- /dev/null +++ b/benefits/eligibility/templates/eligibility/includes/eligibility-item--identification--start--sbmtd-agency-card.html @@ -0,0 +1,11 @@ +{% extends "core/includes/eligibility-item.html" %} + +{% load i18n %} + +{% block heading %} + {% translate "Your current Reduced Fare Mobility ID number" %} +{% endblock heading %} + +{% block body %} +

    {% translate "You do not need to have your physical card, but you will need to know the number." %}

    +{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html b/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html deleted file mode 100644 index 99e20c191a..0000000000 --- a/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html +++ /dev/null @@ -1,22 +0,0 @@ -{% extends "core/includes/media-item.html" %} -{% load i18n %} - -{% block icon %} - {% include "core/includes/icon.html" with name="bankcardcheck" %} -{% endblock icon %} - -{% block heading %} - {% translate "Your contactless card details" %} -{% endblock heading %} - -{% block body %} -
    -

    - {% translate "Your contactless card must be a debit or credit card by Visa or Mastercard." %} - {% translate "Learn more about contactless cards" as text %} - {% include "core/includes/modal-trigger.html" with modal="modal--contactless" text=text period=True %} -

    -
    - - {% include "eligibility/includes/modal--contactless.html" with id="modal--contactless" size="modal-lg" header="p-md-2 p-3" body="pb-md-3 mb-md-3 mx-md-3 py-0 pt-0 absolute-top" %} -{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--cst-agency-card.html b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--cst-agency-card.html deleted file mode 100644 index 44d8a66fab..0000000000 --- a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--cst-agency-card.html +++ /dev/null @@ -1,13 +0,0 @@ -{% extends "eligibility/includes/media-item--idcardcheck.html" %} - -{% load i18n %} - -{% block heading %} - {% translate "Your current Agency Card number" %} -{% endblock heading %} - -{% block body %} -
    -

    {% translate "You do not need to have your physical CST Agency Card, but you will need to know the number." %}

    -
    -{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--login-gov.html b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--login-gov.html deleted file mode 100644 index 635c397de9..0000000000 --- a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--login-gov.html +++ /dev/null @@ -1,27 +0,0 @@ -{% extends "eligibility/includes/media-item--idcardcheck.html" %} - -{% load i18n %} - -{% block heading %} - {% translate "A Login.gov account with identity verification" %} -{% endblock heading %} - -{% block body %} -
    -

    - {% translate "You will be able to create an account using your email address if you do not already have one. We use your Login.gov account to verify your identity." %} - {% translate "Learn more about identity verification" as text %} - {% include "core/includes/modal-trigger.html" with modal="modal--identity-verification" text=text period=True %} -

    -
    -

    {% translate "For this process you will need:" %}

    -
      -
    • {% translate "Your state-issued ID card" %}
      • -
    • {% translate "Your Social Security number" %}
      • -
    • {% translate "A phone number with a phone plan associated with your name" %}
      • -
    -
    -
    - - {% include "eligibility/includes/modal--login-gov-start-help.html" with size="modal-lg" id="modal--identity-verification" header="p-md-2 p-3" body="pb-md-3 mb-md-3 mx-md-3 py-0 pt-0 absolute-top" %} -{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--medicare.html b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--medicare.html deleted file mode 100644 index d42a2cb336..0000000000 --- a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--medicare.html +++ /dev/null @@ -1,15 +0,0 @@ -{% extends "eligibility/includes/media-item--idcardcheck.html" %} - -{% load i18n %} - -{% block heading %} - {% translate "An online account with Medicare.gov" %} -{% endblock heading %} - -{% block body %} -
    -

    - {% translate "If you do not have an account you will be able to create one using your red, white, and blue Medicare card. We use your Medicare.gov account to verify you qualify." %} -

    -
    -{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--mst-agency-card.html b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--mst-agency-card.html deleted file mode 100644 index 42895acb55..0000000000 --- a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--mst-agency-card.html +++ /dev/null @@ -1,13 +0,0 @@ -{% extends "eligibility/includes/media-item--idcardcheck.html" %} - -{% load i18n %} - -{% block heading %} - {% translate "Your current Courtesy Card number" %} -{% endblock heading %} - -{% block body %} -
    -

    {% translate "You do not need to have your physical MST Courtesy Card, but you will need to know the number." %}

    -
    -{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--sbmtd-agency-card.html b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--sbmtd-agency-card.html deleted file mode 100644 index 4d5313f44a..0000000000 --- a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--sbmtd-agency-card.html +++ /dev/null @@ -1,13 +0,0 @@ -{% extends "eligibility/includes/media-item--idcardcheck.html" %} - -{% load i18n %} - -{% block heading %} - {% translate "Your current Reduced Fare Mobility ID number" %} -{% endblock heading %} - -{% block body %} -
    -

    {% translate "You do not need to have your physical card, but you will need to know the number." %}

    -
    -{% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck.html b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck.html deleted file mode 100644 index b7c7a61bf8..0000000000 --- a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck.html +++ /dev/null @@ -1,7 +0,0 @@ -{% extends "core/includes/media-item.html" %} - -{% load i18n %} - -{% block icon %} - {% include "core/includes/icon.html" with name="idcardcheck" %} -{% endblock icon %} diff --git a/benefits/eligibility/templates/eligibility/index--cst.html b/benefits/eligibility/templates/eligibility/index--cst.html index 90af4cf8a9..1a625226c1 100644 --- a/benefits/eligibility/templates/eligibility/index--cst.html +++ b/benefits/eligibility/templates/eligibility/index--cst.html @@ -2,8 +2,8 @@ {% load i18n %} -{% block explanatory-text %} -

    +{% block form-text %} +

    {% translate "Cal-ITP doesn’t save any of your information. All CST transit benefits reduce fares by 50% for bus service on fixed routes." %}

    -{% endblock explanatory-text %} +{% endblock form-text %} diff --git a/benefits/eligibility/templates/eligibility/index--mst.html b/benefits/eligibility/templates/eligibility/index--mst.html index 2acbb986c4..4d255e3098 100644 --- a/benefits/eligibility/templates/eligibility/index--mst.html +++ b/benefits/eligibility/templates/eligibility/index--mst.html @@ -2,8 +2,8 @@ {% load i18n %} -{% block explanatory-text %} -

    +{% block form-text %} +

    {% translate "Cal-ITP doesn’t save any of your information. All MST transit benefits reduce fares by 50% for bus service on fixed routes." %}

    -{% endblock explanatory-text %} +{% endblock form-text %} diff --git a/benefits/eligibility/templates/eligibility/index--nevco.html b/benefits/eligibility/templates/eligibility/index--nevco.html index aee7d4b3d6..11fd84c36b 100644 --- a/benefits/eligibility/templates/eligibility/index--nevco.html +++ b/benefits/eligibility/templates/eligibility/index--nevco.html @@ -2,8 +2,8 @@ {% load i18n %} -{% block explanatory-text %} -

    +{% block form-text %} +

    {% translate "Cal-ITP doesn’t save any of your information. All Nevada County Connects transit benefits reduce fares by 50% for bus service on fixed routes." %}

    -{% endblock explanatory-text %} +{% endblock form-text %} diff --git a/benefits/eligibility/templates/eligibility/index--sacrt.html b/benefits/eligibility/templates/eligibility/index--sacrt.html index b8667df4ef..5f0cdc0ab8 100644 --- a/benefits/eligibility/templates/eligibility/index--sacrt.html +++ b/benefits/eligibility/templates/eligibility/index--sacrt.html @@ -2,11 +2,11 @@ {% load i18n %} -{% block explanatory-text %} +{% block form-text %}

    {% translate "Cal-ITP doesn’t save any of your information. All SacRT transit benefits reduce fares by 50% for bus service on fixed routes." %}

    -

    +

    {% translate "With the new Tap2Ride fare system launching in 2025, SacRT riders that are eligible for discount fares can enroll below. The discount benefit will be available on all SacRT buses beginning in early 2025 and will include light rail tap devices later in the year." %}

    -{% endblock explanatory-text %} +{% endblock form-text %} diff --git a/benefits/eligibility/templates/eligibility/index--sbmtd.html b/benefits/eligibility/templates/eligibility/index--sbmtd.html index 4ebfc12eab..056eee5b7a 100644 --- a/benefits/eligibility/templates/eligibility/index--sbmtd.html +++ b/benefits/eligibility/templates/eligibility/index--sbmtd.html @@ -2,8 +2,8 @@ {% load i18n %} -{% block explanatory-text %} -

    +{% block form-text %} +

    {% translate "Cal-ITP doesn’t save any of your information. All SBMTD transit benefits reduce fares by 50% for bus service on fixed routes." %}

    -{% endblock explanatory-text %} +{% endblock form-text %} diff --git a/benefits/eligibility/templates/eligibility/index.html b/benefits/eligibility/templates/eligibility/index.html index 3468b1906e..9d2af0ed65 100644 --- a/benefits/eligibility/templates/eligibility/index.html +++ b/benefits/eligibility/templates/eligibility/index.html @@ -15,21 +15,12 @@ {% endblock nav-buttons %} {% block headline %} -
    -

    {% translate "Choose the transit benefit you would like to enroll in" %}

    -
    +

    {% translate "Choose the transit benefit you would like to enroll in" %}

    {% endblock headline %} -{% block explanatory-text-wrapper %} -
    -
    - {% block explanatory-text %} - {% endblock explanatory-text %} -
    -
    -{% endblock explanatory-text-wrapper %} - {% block inner-content %} + {% block form-text %} + {% endblock form-text %} {% include "core/includes/form.html" with form=form %} {% endblock inner-content %} + +{% comment %} Override with empty block to prevent rendering empty divs {% endcomment %} +{% block call-to-action %} +{% endblock call-to-action %} diff --git a/benefits/eligibility/templates/eligibility/start--calfresh.html b/benefits/eligibility/templates/eligibility/start--calfresh.html index a9da5608fc..55ca7fb63c 100644 --- a/benefits/eligibility/templates/eligibility/start--calfresh.html +++ b/benefits/eligibility/templates/eligibility/start--calfresh.html @@ -5,23 +5,17 @@ {% translate "CalFresh benefit overview" %} {% endblock page-title %} -{% block headline %} -
    -

    {% translate "You selected a CalFresh Cardholder transit benefit." %}

    -
    -{% endblock headline %} +{% block headline-text %} + {% translate "You selected a CalFresh Cardholder transit benefit." %} +{% endblock headline-text %} -{% block media-item %} - {% include "eligibility/includes/media-item--idcardcheck--start--login-gov.html" %} -{% endblock media-item %} +{% block eligibility-item %} + {% include "eligibility/includes/eligibility-item--identification--start--login-gov.html" %} +{% endblock eligibility-item %} -{% block call-to-action %} -
    -
    - {% translate "Get started with" as button_text %} - -
    -
    -{% endblock call-to-action %} +{% block call-to-action-button %} + {% translate "Get started with" as button_text %} + +{% endblock call-to-action-button %} diff --git a/benefits/eligibility/templates/eligibility/start--cst-agency-card.html b/benefits/eligibility/templates/eligibility/start--cst-agency-card.html index 1310be9b63..7d4460cd11 100644 --- a/benefits/eligibility/templates/eligibility/start--cst-agency-card.html +++ b/benefits/eligibility/templates/eligibility/start--cst-agency-card.html @@ -5,20 +5,14 @@ {% translate "Agency card overview" %} {% endblock page-title %} -{% block headline %} -
    -

    {% translate "You selected an Agency Card transit benefit." %}

    -
    -{% endblock headline %} +{% block headline-text %} + {% translate "You selected an Agency Card transit benefit." %} +{% endblock headline-text %} -{% block media-item %} - {% include "eligibility/includes/media-item--idcardcheck--start--cst-agency-card.html" %} -{% endblock media-item %} +{% block eligibility-item %} + {% include "eligibility/includes/eligibility-item--identification--start--cst-agency-card.html" %} +{% endblock eligibility-item %} -{% block call-to-action %} -
    -
    - {% translate "Continue" %} -
    -
    -{% endblock call-to-action %} +{% block call-to-action-button %} + {% translate "Continue" %} +{% endblock call-to-action-button %} diff --git a/benefits/eligibility/templates/eligibility/start--medicare.html b/benefits/eligibility/templates/eligibility/start--medicare.html index f57f9cec17..59f31166c1 100644 --- a/benefits/eligibility/templates/eligibility/start--medicare.html +++ b/benefits/eligibility/templates/eligibility/start--medicare.html @@ -5,20 +5,14 @@ {% translate "Medicare benefit overview" %} {% endblock page-title %} -{% block headline %} -
    -

    {% translate "You selected a Medicare Cardholder transit benefit." %}

    -
    -{% endblock headline %} +{% block headline-text %} + {% translate "You selected a Medicare Cardholder transit benefit." %} +{% endblock headline-text %} -{% block media-item %} - {% include "eligibility/includes/media-item--idcardcheck--start--medicare.html" %} -{% endblock media-item %} +{% block eligibility-item %} + {% include "eligibility/includes/eligibility-item--identification--start--medicare.html" %} +{% endblock eligibility-item %} -{% block call-to-action %} -
    -
    - {% translate "Continue to Medicare.gov" %} -
    -
    -{% endblock call-to-action %} +{% block call-to-action-button %} + {% translate "Continue to Medicare.gov" %} +{% endblock call-to-action-button %} diff --git a/benefits/eligibility/templates/eligibility/start--mst-agency-card.html b/benefits/eligibility/templates/eligibility/start--mst-agency-card.html index 5ddfb88b6a..5fe24ca473 100644 --- a/benefits/eligibility/templates/eligibility/start--mst-agency-card.html +++ b/benefits/eligibility/templates/eligibility/start--mst-agency-card.html @@ -5,20 +5,14 @@ {% translate "Agency card overview" %} {% endblock page-title %} -{% block headline %} -
    -

    {% translate "You selected a Courtesy Card transit benefit." %}

    -
    -{% endblock headline %} +{% block headline-text %} + {% translate "You selected a Courtesy Card transit benefit." %} +{% endblock headline-text %} -{% block media-item %} - {% include "eligibility/includes/media-item--idcardcheck--start--mst-agency-card.html" %} -{% endblock media-item %} +{% block eligibility-item %} + {% include "eligibility/includes/eligibility-item--identification--start--mst-agency-card.html" %} +{% endblock eligibility-item %} -{% block call-to-action %} -
    -
    - {% translate "Continue" %} -
    -
    -{% endblock call-to-action %} +{% block call-to-action-button %} + {% translate "Continue" %} +{% endblock call-to-action-button %} diff --git a/benefits/eligibility/templates/eligibility/start--sbmtd-agency-card.html b/benefits/eligibility/templates/eligibility/start--sbmtd-agency-card.html index 75af35f45d..ccccdeae3d 100644 --- a/benefits/eligibility/templates/eligibility/start--sbmtd-agency-card.html +++ b/benefits/eligibility/templates/eligibility/start--sbmtd-agency-card.html @@ -6,19 +6,13 @@ {% endblock page-title %} {% block headline %} -
    -

    {% translate "You selected a Reduced Fare Mobility ID transit benefit." %}

    -
    + {% translate "You selected a Reduced Fare Mobility ID transit benefit." %} {% endblock headline %} -{% block media-item %} - {% include "eligibility/includes/media-item--idcardcheck--start--sbmtd-agency-card.html" %} -{% endblock media-item %} +{% block eligibility-item %} + {% include "eligibility/includes/eligibility-item--identification--start--sbmtd-agency-card.html" %} +{% endblock eligibility-item %} -{% block call-to-action %} -
    -
    - {% translate "Continue" %} -
    -
    -{% endblock call-to-action %} +{% block call-to-action-button %} + {% translate "Continue" %} +{% endblock call-to-action-button %} diff --git a/benefits/eligibility/templates/eligibility/start--senior.html b/benefits/eligibility/templates/eligibility/start--senior.html index 31ad0b4439..2a9292048c 100644 --- a/benefits/eligibility/templates/eligibility/start--senior.html +++ b/benefits/eligibility/templates/eligibility/start--senior.html @@ -5,23 +5,17 @@ {% translate "Older Adult benefit overview" %} {% endblock page-title %} -{% block headline %} -
    -

    {% translate "You selected an Older Adult transit benefit." %}

    -
    -{% endblock headline %} +{% block headline-text %} + {% translate "You selected an Older Adult transit benefit." %} +{% endblock headline-text %} -{% block media-item %} - {% include "eligibility/includes/media-item--idcardcheck--start--login-gov.html" %} -{% endblock media-item %} +{% block eligibility-item %} + {% include "eligibility/includes/eligibility-item--identification--start--login-gov.html" %} +{% endblock eligibility-item %} -{% block call-to-action %} -
    -
    - {% translate "Get started with" as button_text %} - -
    -
    -{% endblock call-to-action %} +{% block call-to-action-button %} + {% translate "Get started with" as button_text %} + +{% endblock call-to-action-button %} diff --git a/benefits/eligibility/templates/eligibility/start--veteran.html b/benefits/eligibility/templates/eligibility/start--veteran.html index 06233a9d0e..7c80726218 100644 --- a/benefits/eligibility/templates/eligibility/start--veteran.html +++ b/benefits/eligibility/templates/eligibility/start--veteran.html @@ -5,23 +5,17 @@ {% translate "Veterans benefit overview" %} {% endblock page-title %} -{% block headline %} -
    -

    {% translate "You selected a Veteran transit benefit." %}

    -
    -{% endblock headline %} +{% block headline-text %} + {% translate "You selected a Veteran transit benefit." %} +{% endblock headline-text %} -{% block media-item %} - {% include "eligibility/includes/media-item--idcardcheck--start--login-gov.html" %} -{% endblock media-item %} +{% block eligibility-item %} + {% include "eligibility/includes/eligibility-item--identification--start--login-gov.html" %} +{% endblock eligibility-item %} -{% block call-to-action %} -
    -
    - {% translate "Get started with" as button_text %} - -
    -
    -{% endblock call-to-action %} +{% block call-to-action-button %} + {% translate "Get started with" as button_text %} + +{% endblock call-to-action-button %} diff --git a/benefits/eligibility/templates/eligibility/start.html b/benefits/eligibility/templates/eligibility/start.html index 44dfe02d0c..984f1cef34 100644 --- a/benefits/eligibility/templates/eligibility/start.html +++ b/benefits/eligibility/templates/eligibility/start.html @@ -10,16 +10,21 @@ {% include "core/includes/button--previous-page.html" with url=url %} {% endblock nav-buttons %} +{% block headline %} +

    + {% block headline-text %} + {% endblock headline-text %} +

    +{% endblock headline %} + {% block inner-content %} -
    -

    {% translate "You will need a few items to continue:" %}

    -
      - {% block media-item %} - {% endblock media-item %} - {% include "eligibility/includes/media-item--bankcardcheck--start.html" %} -
    -
    +

    {% translate "You will need a few items to continue:" %}

    +
      + {% block eligibility-item %} + {% endblock eligibility-item %} + {% include "eligibility/includes/eligibility-item--contactless-card--start.html" %} +
    {% endblock inner-content %} -{% block call-to-action %} -{% endblock call-to-action %} +{% block call-to-action-button %} +{% endblock call-to-action-button %} diff --git a/benefits/eligibility/templates/eligibility/unverified--cst-agency-card.html b/benefits/eligibility/templates/eligibility/unverified--cst-agency-card.html index 9f51e3ba92..8e1a64fded 100644 --- a/benefits/eligibility/templates/eligibility/unverified--cst-agency-card.html +++ b/benefits/eligibility/templates/eligibility/unverified--cst-agency-card.html @@ -1,15 +1,6 @@ -{% extends "eligibility/unverified.html" %} +{% extends "eligibility/unverified-error-agency-base.html" %} {% load i18n %} -{% block unverified-headline %} - {% translate "Your card information may not have been entered correctly." %} -{% endblock unverified-headline %} - {% block unverified-body %} {% translate "The number and last name must be entered exactly as they appear on your CST Agency Card. Please check your card and try again, or contact your transit agency for help." %} {% endblock unverified-body %} - -{% block unverified-call-to-action %} - {% translate "Try again" as button_text %} -
    {% include "core/includes/button--origin.html" with button_text=button_text %}
    -{% endblock unverified-call-to-action %} diff --git a/benefits/eligibility/templates/eligibility/unverified--mst-agency-card.html b/benefits/eligibility/templates/eligibility/unverified--mst-agency-card.html index b1b710d38a..683285f9b0 100644 --- a/benefits/eligibility/templates/eligibility/unverified--mst-agency-card.html +++ b/benefits/eligibility/templates/eligibility/unverified--mst-agency-card.html @@ -1,15 +1,6 @@ -{% extends "eligibility/unverified.html" %} +{% extends "eligibility/unverified-error-agency-base.html" %} {% load i18n %} -{% block unverified-headline %} - {% translate "Your card information may not have been entered correctly." %} -{% endblock unverified-headline %} - {% block unverified-body %} {% translate "The number and last name must be entered exactly as they appear on your MST Courtesy Card. Please check your card and try again, or contact your transit agency for help." %} {% endblock unverified-body %} - -{% block unverified-call-to-action %} - {% translate "Try again" as button_text %} -
    {% include "core/includes/button--origin.html" with button_text=button_text %}
    -{% endblock unverified-call-to-action %} diff --git a/benefits/eligibility/templates/eligibility/unverified--sbmtd-agency-card.html b/benefits/eligibility/templates/eligibility/unverified--sbmtd-agency-card.html index 828fa18030..92cf826c67 100644 --- a/benefits/eligibility/templates/eligibility/unverified--sbmtd-agency-card.html +++ b/benefits/eligibility/templates/eligibility/unverified--sbmtd-agency-card.html @@ -1,15 +1,6 @@ -{% extends "eligibility/unverified.html" %} +{% extends "eligibility/unverified-error-agency-base.html" %} {% load i18n %} -{% block unverified-headline %} - {% translate "Your card information may not have been entered correctly." %} -{% endblock unverified-headline %} - {% block unverified-body %} {% translate "The number and last name must be entered exactly as they appear on your SBMTD Reduced Fare Mobility ID card. Please check your card and try again, or contact your transit agency for help." %} {% endblock unverified-body %} - -{% block unverified-call-to-action %} - {% translate "Try again" as button_text %} -
    {% include "core/includes/button--origin.html" with button_text=button_text %}
    -{% endblock unverified-call-to-action %} diff --git a/benefits/eligibility/templates/eligibility/unverified-error-agency-base.html b/benefits/eligibility/templates/eligibility/unverified-error-agency-base.html new file mode 100644 index 0000000000..ef7edf8181 --- /dev/null +++ b/benefits/eligibility/templates/eligibility/unverified-error-agency-base.html @@ -0,0 +1,33 @@ +{% extends "error-base.html" %} +{% load i18n %} + +{% block page-title %} + {% translate "Unable to confirm eligibility" %} +{% endblock page-title %} + +{% block nav-buttons %} + {% if authentication and authentication.sign_out_link_template %} + {% include authentication.sign_out_link_template %} + {% endif %} +{% endblock nav-buttons %} + +{% block icon %} + {% include "core/includes/icon.html" with name="idcardquestion" %} +{% endblock icon %} + +{% block headline-text %} + {% translate "Your card information may not have been entered correctly." %} +{% endblock headline-text %} + +{% block paragraphs %} +

    + {% block unverified-body %} + {% endblock unverified-body %} +

    + {% include "core/includes/agency-links.html" %} +{% endblock paragraphs %} + +{% block call-to-action-button %} + {% translate "Try again" as button_text %} + {% include "core/includes/button--origin.html" with button_text=button_text %} +{% endblock call-to-action-button %} diff --git a/benefits/eligibility/templates/eligibility/unverified.html b/benefits/eligibility/templates/eligibility/unverified.html index 1fe235f7c5..ce11fea5a4 100644 --- a/benefits/eligibility/templates/eligibility/unverified.html +++ b/benefits/eligibility/templates/eligibility/unverified.html @@ -1,43 +1,32 @@ -{% extends "core/base.html" %} +{% extends "error-base.html" %} {% load i18n %} {% block page-title %} {% translate "Unable to confirm eligibility" %} {% endblock page-title %} -{% block main-content %} +{% block nav-buttons %} {% if authentication and authentication.sign_out_link_template %} {% include authentication.sign_out_link_template %} {% endif %} +{% endblock nav-buttons %} -
    -

    - {% include "core/includes/icon.html" with name="idcardquestion" %} - {% block unverified-headline %} - {% translate "Your eligibility could not be verified." %} - {% endblock unverified-headline %} -

    +{% block icon %} + {% include "core/includes/icon.html" with name="idcardquestion" %} +{% endblock icon %} -
    -
    -

    - {% block unverified-body %} - {% translate "That’s okay! You may still be eligible for our program." %} - {% blocktranslate with short_name=agency.short_name %}Please reach out to {{ short_name }} for assistance.{% endblocktranslate %} - {% endblock unverified-body %} -

    -
    -
    +{% block headline-text %} + {% translate "Your eligibility could not be verified." %} +{% endblock headline-text %} -
    -
    {% include "core/includes/agency-links.html" %}
    -
    +{% block paragraphs %} +

    + {% translate "That’s okay! You may still be eligible for our program." %} + {% blocktranslate with short_name=agency.short_name %}Please reach out to {{ short_name }} for assistance.{% endblocktranslate %} +

    + {% include "core/includes/agency-links.html" %} +{% endblock paragraphs %} -
    - {% block unverified-call-to-action %} -
    {% include "core/includes/button--index.html" %}
    - {% endblock unverified-call-to-action %} -
    - -
    -{% endblock main-content %} +{% block call-to-action-button %} + {% include "core/includes/button--index.html" %} +{% endblock call-to-action-button %} diff --git a/benefits/enrollment/templates/enrollment/includes/alert-box--warning--calfresh.html b/benefits/enrollment/templates/enrollment/includes/alert-box--warning--calfresh.html index 4b09f735c1..4cbe1e4f49 100644 --- a/benefits/enrollment/templates/enrollment/includes/alert-box--warning--calfresh.html +++ b/benefits/enrollment/templates/enrollment/includes/alert-box--warning--calfresh.html @@ -2,7 +2,7 @@ {% load i18n %} {% block alert-wrapper %} - {% with alert_class="alert-box--warning media-list-icon-left-margin" %}{{ block.super }}{% endwith %} + {% with alert_class="alert-box--warning" %}{{ block.super }}{% endwith %} {% endblock alert-wrapper %} {% block alert-heading %} diff --git a/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index--calfresh.html b/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index--calfresh.html deleted file mode 100644 index 3fe204c17b..0000000000 --- a/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index--calfresh.html +++ /dev/null @@ -1,22 +0,0 @@ -{% extends "core/includes/media-item.html" %} -{% load i18n %} - -{% block icon %} - {% include "core/includes/icon.html" with name="bankcardcheck" %} -{% endblock icon %} - -{% block heading %} - {% translate "The next step is to connect your contactless card to your transit benefit" %} -{% endblock heading %} - -{% block body %} -
    -

    - {% translate "You will be directed to our payment partner, " %} - {% include "core/includes/modal-trigger.html" with modal="modal--littlepay" text="Littlepay" period=True %} - {% translate "We don’t store your information, and you won’t be charged." %} -

    -
    - - {% include "enrollment/includes/modal--littlepay.html" with id="modal--littlepay" size="modal-md" header="p-md-2 p-3" body="pb-md-3 mb-md-3 mx-md-3 py-0 pt-0 absolute-top" %} -{% endblock body %} diff --git a/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html b/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html deleted file mode 100644 index 4b70b49154..0000000000 --- a/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html +++ /dev/null @@ -1,27 +0,0 @@ -{% extends "core/includes/media-item.html" %} -{% load i18n %} - -{% block icon %} - {% include "core/includes/icon.html" with name="bankcardcheck" %} -{% endblock icon %} - -{% block heading_wrapper %} - {% with heading_tag="h2" %}{{ block.super }}{% endwith %} -{% endblock heading_wrapper %} - -{% block heading %} - {% translate "The next step is to enroll the contactless card you will use to tap to ride for a reduced fare." %} -{% endblock heading %} - -{% block body %} -
    -

    - {% translate "You will be directed to our partner, " %} - Littlepay{% translate ", to enter your contactless card details." %} - {% translate "We don’t store your information, and you won’t be charged." %} -

    -

    {% translate "Please use a debit or credit card by Visa or Mastercard." %}

    -
    - - {% include "enrollment/includes/modal--littlepay.html" with id="modal--littlepay" size="modal-md" header="p-md-2 p-3" body="pb-md-3 mb-md-3 mx-md-3 py-0 pt-0 absolute-top" %} -{% endblock body %} diff --git a/benefits/enrollment/templates/enrollment/index--agency-card.html b/benefits/enrollment/templates/enrollment/index--agency-card.html index 5c59d63ed2..b0cf4ca230 100644 --- a/benefits/enrollment/templates/enrollment/index--agency-card.html +++ b/benefits/enrollment/templates/enrollment/index--agency-card.html @@ -2,9 +2,5 @@ {% load i18n %} {% block headline %} -
    -

    - {% translate "We found your record!
    Now let’s enroll your contactless card." %} -

    -
    +

    {% translate "We found your record! Now let’s enroll your contactless card." %}

    {% endblock headline %} diff --git a/benefits/enrollment/templates/enrollment/index--calfresh.html b/benefits/enrollment/templates/enrollment/index--calfresh.html index 59ec637977..becf49dcc7 100644 --- a/benefits/enrollment/templates/enrollment/index--calfresh.html +++ b/benefits/enrollment/templates/enrollment/index--calfresh.html @@ -1,14 +1,16 @@ {% extends "enrollment/index.html" %} {% load i18n %} -{% block media-items %} -
    -
      - {% include "enrollment/includes/media-item--bankcardcheck--index--calfresh.html" %} -
    -
    -{% endblock media-items %} - -{% block additional-info %} -
    {% include "enrollment/includes/alert-box--warning--calfresh.html" %}
    -{% endblock additional-info %} +{% block paragraphs %} +

    {% translate "The next step is to connect your contactless card to your transit benefit" %}

    + +

    + {% translate "You will be directed to our payment partner, " %} + {% include "core/includes/modal-trigger.html" with modal="modal--littlepay" text="Littlepay" period=True %} + {% translate "We don’t store your information, and you won’t be charged." %} +

    + + {% include "enrollment/includes/modal--littlepay.html" with id="modal--littlepay" size="modal-md" header="p-md-2 p-3" body="pb-md-3 mb-md-3 mx-md-3 py-0 pt-0 absolute-top" %} + + {% include "enrollment/includes/alert-box--warning--calfresh.html" %} +{% endblock paragraphs %} diff --git a/benefits/enrollment/templates/enrollment/index.html b/benefits/enrollment/templates/enrollment/index.html index e51ebe47fb..bef519dd24 100644 --- a/benefits/enrollment/templates/enrollment/index.html +++ b/benefits/enrollment/templates/enrollment/index.html @@ -12,23 +12,24 @@ {% endblock nav-buttons %} {% block headline %} -
    -

    - {% translate "Your eligibility is confirmed!
    You’re almost there." %} -

    -
    +

    {% translate "Your eligibility is confirmed! You’re almost there." %}

    {% endblock headline %} {% block inner-content %} - {% block media-items %} -
    -
      - {% include "enrollment/includes/media-item--bankcardcheck--index.html" %} -
    -
    - {% endblock media-items %} - {% block additional-info %} - {% endblock additional-info %} + {% block paragraphs %} +

    + {% translate "The next step is to enroll the contactless card you will use to tap to ride for a reduced fare." %} +

    + +

    + {% translate "You will be directed to our partner, " %} + Littlepay{% translate ", to enter your contactless card details." %} + {% translate "We don’t store your information, and you won’t be charged." %} +

    +

    {% translate "Please use a debit or credit card by Visa or Mastercard." %}

    + + {% include "enrollment/includes/modal--littlepay.html" with id="modal--littlepay" size="modal-md" header="p-md-2 p-3" body="pb-md-3 mb-md-3 mx-md-3 py-0 pt-0 absolute-top" %} + {% endblock paragraphs %} {% comment %} This Javascript code is partially generated by this template and so it must come before the forms, which are rendered at just before the {% endblock inner-content %} diff --git a/benefits/enrollment/templates/enrollment/reenrollment-error--calfresh.html b/benefits/enrollment/templates/enrollment/reenrollment-error--calfresh.html index f9a3391c63..012d6b36f2 100644 --- a/benefits/enrollment/templates/enrollment/reenrollment-error--calfresh.html +++ b/benefits/enrollment/templates/enrollment/reenrollment-error--calfresh.html @@ -1,10 +1,10 @@ {% extends "enrollment/reenrollment-error-base.html" %} {% load i18n %} -{% block error-message %} +{% block paragraphs %}

    {% translate "Your CalFresh Cardholder transit benefit does not expire until" %} {{ enrollment.expires|date }}. {% translate "You can re-enroll for this benefit beginning on" %} {{ enrollment.reenrollment|date }}. {% translate "Please try again then." %}

    -{% endblock error-message %} +{% endblock paragraphs %} diff --git a/benefits/enrollment/templates/enrollment/reenrollment-error-base.html b/benefits/enrollment/templates/enrollment/reenrollment-error-base.html index 720bc81318..2aaebac875 100644 --- a/benefits/enrollment/templates/enrollment/reenrollment-error-base.html +++ b/benefits/enrollment/templates/enrollment/reenrollment-error-base.html @@ -1,31 +1,27 @@ -{% extends "core/base.html" %} +{% extends "error-base.html" %} {% load i18n %} {% block page-title %} {% translate "Enrollment error" %} {% endblock page-title %} -{% block main-content %} +{% block nav-buttons %} {% if authentication and authentication.sign_out_link_template %} {% include authentication.sign_out_link_template %} {% endif %} +{% endblock nav-buttons %} -
    -

    - {% include "core/includes/icon.html" with name="calendarcheck" %} - {% translate "You are still enrolled in this benefit" %} -

    +{% block icon %} + {% include "core/includes/icon.html" with name="calendarcheck" %} +{% endblock icon %} -
    -
    - {% block error-message %} - {% endblock error-message %} -
    -
    +{% block headline-text %} + {% translate "You are still enrolled in this benefit" %} +{% endblock headline-text %} -
    -
    {% include "core/includes/button--index.html" %}
    -
    +{% block paragraphs %} +{% endblock paragraphs %} -
    -{% endblock main-content %} +{% block call-to-action-button %} + {% include "core/includes/button--origin.html" %} +{% endblock call-to-action-button %} diff --git a/benefits/enrollment/templates/enrollment/retry.html b/benefits/enrollment/templates/enrollment/retry.html index b4d6dabebc..a9ae4e657d 100644 --- a/benefits/enrollment/templates/enrollment/retry.html +++ b/benefits/enrollment/templates/enrollment/retry.html @@ -1,37 +1,30 @@ -{% extends "core/base.html" %} +{% extends "error-base.html" %} {% load i18n %} {% block page-title %} {% translate "Unable to enroll card" %} {% endblock page-title %} -{% block main-content %} +{% block nav-buttons %} {% if authentication and authentication.sign_out_link_template %} {% include authentication.sign_out_link_template %} {% endif %} +{% endblock nav-buttons %} -
    -

    - {% include "core/includes/icon.html" with name="bankcardquestion" %} - {% translate "The card information may not have been entered correctly." %} -

    +{% block icon %} + {% include "core/includes/icon.html" with name="bankcardquestion" %} +{% endblock icon %} -
    -
    -

    {% translate "Please check the details on your card and try again, or contact your transit agency for help." %}

    -
    -
    +{% block headline-text %} + {% translate "The card information may not have been entered correctly." %} +{% endblock headline-text %} -
    -
    {% include "core/includes/agency-links.html" %}
    -
    +{% block paragraphs %} +

    {% translate "Please check the details on your card and try again, or contact your transit agency for help." %}

    + {% include "core/includes/agency-links.html" %} +{% endblock paragraphs %} -
    -
    - {% translate "Try again" as button_text %} - {% include "core/includes/button--origin.html" with button_text=button_text %} -
    -
    - -
    -{% endblock main-content %} +{% block call-to-action-button %} + {% translate "Try again" as button_text %} + {% include "core/includes/button--origin.html" with button_text=button_text %} +{% endblock call-to-action-button %} diff --git a/benefits/enrollment/templates/enrollment/success.html b/benefits/enrollment/templates/enrollment/success.html index 8c87ce0288..f1382d3fb5 100644 --- a/benefits/enrollment/templates/enrollment/success.html +++ b/benefits/enrollment/templates/enrollment/success.html @@ -11,59 +11,53 @@ {% translate "Success" %} {% endblock page-title %} -{% block headline %} -
    -

    - {% block headline-message %} - {% blocktranslate trimmed %} - You can now use your contactless card to tap to ride with a reduced fare! - {% endblocktranslate %} - {% endblock headline-message %} -

    -
    -{% endblock headline %} - -{% block inner-content %} -
    -
    -
    - {# djlint:off #} - {% if enrollment.supports_expiration %} -

    {% translate "Your benefit will expire on" %} {{ enrollment.expires|date }}.

    -

    - {% else %} -

    - {% endif %} - {% block success-message %} - {% endblock success-message %} -

    - {# djlint:on #} -

    - {% block thank-you-message %} - {% translate "Thank you for using Cal-ITP Benefits!" %} - {% endblock thank-you-message %} -

    +{% block main-content %} +
    +
    +
    +

    + {% blocktranslate trimmed %} + You can now use your contactless card to tap to ride with a reduced fare! + {% endblocktranslate %} +

    -
    - +
    +
    +
    + {# djlint:off #} + {% if enrollment.supports_expiration %} +

    {% translate "Your benefit will expire on" %} {{ enrollment.expires|date }}.

    +

    + {% else %} +

    + {% endif %} + {% block success-message %} + {% endblock success-message %} +

    + {# djlint:on #} +

    + {% block thank-you-message %} + {% translate "Thank you for using Cal-ITP Benefits!" %} + {% endblock thank-you-message %} +

    +
    +
    + +
    +
    + {% if authentication and authentication.logged_in and authentication.sign_out_button_template %} +
    +

    + {% translate "If you are on a public or shared computer, don’t forget to sign out of " %} + {% include authentication.sign_out_button_template %} +

    +
    + {% endif %}
    -{% endblock inner-content %} - -{% block call-to-action %} - {% if authentication and authentication.logged_in and authentication.sign_out_button_template %} -
    -
    -

    - {% translate "If you are on a public or shared computer, don’t forget to sign out of " %} - {% include authentication.sign_out_button_template %} -

    -
    -
    - {% endif %} -{% endblock call-to-action %} +{% endblock main-content %} diff --git a/benefits/enrollment/templates/enrollment/system_error.html b/benefits/enrollment/templates/enrollment/system_error.html index 42382a6314..441804c14b 100644 --- a/benefits/enrollment/templates/enrollment/system_error.html +++ b/benefits/enrollment/templates/enrollment/system_error.html @@ -1,44 +1,32 @@ -{% extends "core/base.html" %} +{% extends "error-base.html" %} {% load i18n %} -{% block classes %} - {{ block.super | add:" system-enrollment-error" }} -{% endblock classes %} - {% block page-title %} {% translate "Enrollment system down" %} {% endblock page-title %} -{% block main-content %} -
    -

    - {% include "core/includes/icon.html" with name="bankcardquestion" %} - {% translate "Our enrollment system is not working right now." %} -

    +{% block icon %} + {% include "core/includes/icon.html" with name="bankcardquestion" %} +{% endblock icon %} -
    -
    -

    - {% translate "We’re working to solve the problem. Please wait 48 hours and try to enroll again, or contact your transit agency for help." %} -

    -
    -
    +{% block headline-text %} + {% translate "Our enrollment system is not working right now." %} +{% endblock headline-text %} -
    -
    {% include "core/includes/agency-links.html" %}
    -
    +{% block paragraphs %} +

    + {% translate "We’re working to solve the problem. Please wait 48 hours and try to enroll again, or contact your transit agency for help." %} +

    + {% include "core/includes/agency-links.html" %} +{% endblock paragraphs %} -
    -
    - {% if authentication and authentication.sign_out_link_template %} - {% translate "Sign out of" as button_text %} - - {% else %} - {% include "core/includes/button--origin.html" %} - {% endif %} -
    -
    -
    -{% endblock main-content %} +{% block call-to-action-button %} + {% if authentication and authentication.sign_out_link_template %} + {% translate "Sign out of" as button_text %} + + {% else %} + {% include "core/includes/button--origin.html" %} + {% endif %} +{% endblock call-to-action-button %} diff --git a/benefits/in_person/forms.py b/benefits/in_person/forms.py index e2b09b31b4..d57d9eeed5 100644 --- a/benefits/in_person/forms.py +++ b/benefits/in_person/forms.py @@ -26,7 +26,7 @@ def __init__(self, agency: models.TransitAgency, *args, **kwargs): super().__init__(*args, **kwargs) flows = agency.enrollment_flows.filter(supported_enrollment_methods__contains=models.EnrollmentMethods.IN_PERSON) - self.classes = "checkbox-parent" + self.classes = "in-person-eligibility-form" flow_field = self.fields["flow"] verified_field = self.fields["verified"] diff --git a/benefits/locale/en/LC_MESSAGES/django.po b/benefits/locale/en/LC_MESSAGES/django.po index fa5d49cf72..4112057c9c 100644 --- a/benefits/locale/en/LC_MESSAGES/django.po +++ b/benefits/locale/en/LC_MESSAGES/django.po @@ -6,19 +6,13 @@ msgid "" msgstr "" "Report-Msgid-Bugs-To: https://github.com/cal-itp/benefits/issues \n" -"POT-Creation-Date: 2024-11-12 10:35-0800\n" +"POT-Creation-Date: 2024-12-16 21:57-0800\n" "Language: English\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" "Content-Transfer-Encoding: 8bit\n" "Plural-Forms: nplurals=2; plural=(n != 1);\n" -msgid "Get started" -msgstr "" - -msgid "Get Started" -msgstr "" - msgid "" "The Benefits tool is provided by California Integrated Travel Project (Cal-" "ITP), which is a new program from the California Department of " @@ -320,6 +314,20 @@ msgid "" "JavaScript. Please enable JavaScript for this website and" msgstr "" +msgid "" +"This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service " +"apply." +msgstr "" + +msgid "Get started" +msgstr "" + +msgid "Get Started" +msgstr "" + msgid "Get a reduced fare on CST public transportation when you tap to ride" msgstr "" @@ -337,19 +345,19 @@ msgstr "" msgid "Get a reduced fare on Santa Barbara MTD buses when you tap to ride" msgstr "" -msgid "Choose transit agency" +msgid "Cal-ITP Benefits connects your transit benefit to your contactless card" msgstr "" -msgid "Get a reduced fare on public transportation when you tap to ride" +msgid "A person holds a contactless debit card next to a card reader on a bus." msgstr "" -msgid "Choose your Provider" +msgid "Choose transit agency" msgstr "" -msgid "Cal-ITP Benefits connects your transit benefit to your contactless card" +msgid "Get a reduced fare on public transportation when you tap to ride" msgstr "" -msgid "A person holds a contactless debit card next to a card reader on a bus." +msgid "Choose your Provider" msgstr "" msgid "Logged out" @@ -670,18 +678,12 @@ msgstr "" msgid "You will need a few items to continue:" msgstr "" -msgid "Your card information may not have been entered correctly." -msgstr "" - msgid "" "The number and last name must be entered exactly as they appear on your CST " "Agency Card. Please check your card and try again, or contact your transit " "agency for help." msgstr "" -msgid "Try again" -msgstr "" - msgid "" "The number and last name must be entered exactly as they appear on your MST " "Courtesy Card. Please check your card and try again, or contact your transit " @@ -697,6 +699,12 @@ msgstr "" msgid "Unable to confirm eligibility" msgstr "" +msgid "Your card information may not have been entered correctly." +msgstr "" + +msgid "Try again" +msgstr "" + msgid "Your eligibility could not be verified." msgstr "" @@ -719,6 +727,12 @@ msgid "" "card issued by Visa or Mastercard and use that card to pay for transit." msgstr "" +msgid "Learn more about Littlepay" +msgstr "" + +msgid "We found your record! Now let’s enroll your contactless card." +msgstr "" + msgid "" "The next step is to connect your contactless card to your transit benefit" msgstr "" @@ -729,6 +743,12 @@ msgstr "" msgid "We don’t store your information, and you won’t be charged." msgstr "" +msgid "Eligibility confirmation" +msgstr "" + +msgid "Your eligibility is confirmed! You’re almost there." +msgstr "" + msgid "" "The next step is to enroll the contactless card you will use to tap to ride " "for a reduced fare." @@ -743,18 +763,6 @@ msgstr "" msgid "Please use a debit or credit card by Visa or Mastercard." msgstr "" -msgid "Learn more about Littlepay" -msgstr "" - -msgid "We found your record!
    Now let’s enroll your contactless card." -msgstr "" - -msgid "Eligibility confirmation" -msgstr "" - -msgid "Your eligibility is confirmed!
    You’re almost there." -msgstr "" - msgid "Please wait..." msgstr "" diff --git a/benefits/locale/es/LC_MESSAGES/django.po b/benefits/locale/es/LC_MESSAGES/django.po index 2b65597837..9c07c43d1a 100644 --- a/benefits/locale/es/LC_MESSAGES/django.po +++ b/benefits/locale/es/LC_MESSAGES/django.po @@ -6,19 +6,13 @@ msgid "" msgstr "" "Report-Msgid-Bugs-To: https://github.com/cal-itp/benefits/issues \n" -"POT-Creation-Date: 2024-11-12 10:35-0800\n" +"POT-Creation-Date: 2024-12-16 21:57-0800\n" "Language: Español\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" "Content-Transfer-Encoding: 8bit\n" "Plural-Forms: nplurals=2; plural=(n != 1);\n" -msgid "Get started" -msgstr "Comenzar" - -msgid "Get Started" -msgstr "Comenzar" - msgid "" "The Benefits tool is provided by California Integrated Travel Project (Cal-" "ITP), which is a new program from the California Department of " @@ -434,6 +428,25 @@ msgstr "" "Para funcionar correctamente, este sitio web requiere un navegador que " "admita JavaScript. Por favor, active JavaScript por este sitio web y" +msgid "" +"This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service " +"apply." +msgstr "" +"Este sitio está protegido por reCAPTCHA y se aplican la Política de privacidad y las Condiciones de " +"servicio de Google." + +msgid "Get started" +msgstr "Comenzar" + +msgid "Get Started" +msgstr "Comenzar" + msgid "Get a reduced fare on CST public transportation when you tap to ride" msgstr "" "Obtenga una tarifa reducida en el transporte público CST cuando toque para " @@ -461,6 +474,15 @@ msgstr "" "Obtenga una tarifa reducida en los autobuses del Santa Barbara MTD cuando " "toque para viajar" +msgid "Cal-ITP Benefits connects your transit benefit to your contactless card" +msgstr "" +"Cal-ITP Benefits conecta su beneficio de tránsito con su tarjeta sin contacto" + +msgid "A person holds a contactless debit card next to a card reader on a bus." +msgstr "" +"Una persona sostiene una tarjeta de débito junto a un lector de tarjetas en " +"un autobús." + msgid "Choose transit agency" msgstr "Elija la agencia de tránsito" @@ -471,15 +493,6 @@ msgstr "" msgid "Choose your Provider" msgstr "Elija su Proveedor" -msgid "Cal-ITP Benefits connects your transit benefit to your contactless card" -msgstr "" -"Cal-ITP Benefits conecta su beneficio de tránsito con su tarjeta sin contacto" - -msgid "A person holds a contactless debit card next to a card reader on a bus." -msgstr "" -"Una persona sostiene una tarjeta de débito junto a un lector de tarjetas en " -"un autobús." - msgid "Logged out" msgstr "Cierre sesión" @@ -855,11 +868,6 @@ msgstr "Ha seleccionado un beneficio de tránsito para veteranos." msgid "You will need a few items to continue:" msgstr "Necesitará algunos artículos para continuar:" -msgid "Your card information may not have been entered correctly." -msgstr "" -"Es posible que la información de su tarjeta no se haya ingresado " -"correctamente." - msgid "" "The number and last name must be entered exactly as they appear on your CST " "Agency Card. Please check your card and try again, or contact your transit " @@ -869,9 +877,6 @@ msgstr "" "tarjeta de agencia de CST. Verifique su tarjeta e inténtelo de nuevo, o " "contacte a su agencia de tránsito para obtener ayuda." -msgid "Try again" -msgstr "Inténtelo de nuevo" - msgid "" "The number and last name must be entered exactly as they appear on your MST " "Courtesy Card. Please check your card and try again, or contact your transit " @@ -893,6 +898,14 @@ msgstr "" msgid "Unable to confirm eligibility" msgstr "No se pudo confirmar la elegibilidad" +msgid "Your card information may not have been entered correctly." +msgstr "" +"Es posible que la información de su tarjeta no se haya ingresado " +"correctamente." + +msgid "Try again" +msgstr "Inténtelo de nuevo" + msgid "Your eligibility could not be verified." msgstr "No se pudo verificar su elegibilidad." @@ -919,6 +932,13 @@ msgstr "" "o crédito sin contacto emitida por Visa o Mastercard y use esa tarjeta para " "pagar el transporte público." +msgid "Learn more about Littlepay" +msgstr "Más información sobre Littlepay" + +msgid "We found your record! Now let’s enroll your contactless card." +msgstr "" +"¡Encontramos su registro! Ahora inscribamos su tarjeta de pago sin contacto." + msgid "" "The next step is to connect your contactless card to your transit benefit" msgstr "" @@ -931,6 +951,12 @@ msgstr "Será dirigido a nuestro socio de pagos, " msgid "We don’t store your information, and you won’t be charged." msgstr "No almacenamos su información y no se le cobrará." +msgid "Eligibility confirmation" +msgstr "Confirmación de elegibilidad" + +msgid "Your eligibility is confirmed! You’re almost there." +msgstr "¡Su elegibilidad está confirmada! Ya falta poco." + msgid "" "The next step is to enroll the contactless card you will use to tap to ride " "for a reduced fare." @@ -947,20 +973,6 @@ msgstr ", para introducir los datos de su tarjeta de pago sin contacto." msgid "Please use a debit or credit card by Visa or Mastercard." msgstr "Utilice una tarjeta de débito o crédito de Visa o Mastercard." -msgid "Learn more about Littlepay" -msgstr "Más información sobre Littlepay" - -msgid "We found your record!
    Now let’s enroll your contactless card." -msgstr "" -"¡Encontramos su registro!
    Ahora inscribamos su tarjeta de pago sin " -"contacto." - -msgid "Eligibility confirmation" -msgstr "Confirmación de elegibilidad" - -msgid "Your eligibility is confirmed!
    You’re almost there." -msgstr "¡Su elegibilidad está confirmada!
    Ya falta poco." - msgid "Please wait..." msgstr "Espere por favor..." diff --git a/benefits/oauth/templates/oauth/system_error.html b/benefits/oauth/templates/oauth/system_error.html index 0118b6082a..e51223a03f 100644 --- a/benefits/oauth/templates/oauth/system_error.html +++ b/benefits/oauth/templates/oauth/system_error.html @@ -1,31 +1,17 @@ -{% extends "core/base.html" %} +{% extends "error-base.html" %} {% load i18n %} {% block page-title %} {% translate "Service is down" %} {% endblock page-title %} -{% block main-content %} -
    -

    - {% include "core/includes/icon.html" with name="sadbus" %} - {% translate "There was a problem with the service that checks your identity." %} -

    +{% block headline-text %} + {% translate "There was a problem with the service that checks your identity." %} +{% endblock headline-text %} -
    -
    -

    - {% translate "We’re working to solve the problem. Please wait 24 hours and try to enroll again, or contact your transit agency for help." %} -

    -
    -
    - -
    -
    {% include "core/includes/agency-links.html" %}
    -
    - -
    -
    {% include "core/includes/button--origin.html" %}
    -
    -
    -{% endblock main-content %} +{% block paragraphs %} +

    + {% translate "We’re working to solve the problem. Please wait 24 hours and try to enroll again, or contact your transit agency for help." %} + {% include "core/includes/agency-links.html" %} +

    +{% endblock paragraphs %} diff --git a/benefits/static/css/admin/styles.css b/benefits/static/css/admin/styles.css index 700dc970b6..827fe39612 100644 --- a/benefits/static/css/admin/styles.css +++ b/benefits/static/css/admin/styles.css @@ -85,21 +85,27 @@ input[type="password"]:focus, text-transform: unset; } -/* Eligibility Page */ -.checkbox-parent .form-group:last-of-type .col-12 { +/* Eligibility Page: In-person Enrollment */ +/* Checkbox form fields should show the checkbox first, then label */ +.form-field-container.in-person-eligibility-form + .form-group:has(input[type="checkbox"]) { display: flex; flex-direction: row-reverse; justify-content: start; - column-gap: 0.5rem; + gap: 0.5rem; margin-top: 2rem; } -.checkbox-parent, -.checkbox-parent .form-group .col-12, -.checkbox-parent .form-group .col-12 #id_flow { +.form-field-container.in-person-eligibility-form { display: flex; flex-direction: column; - row-gap: 1rem; + gap: 1rem; +} + +.form-field-container.in-person-eligibility-form + .form-group:has(div):has(label) + div { + margin-top: 1rem; } /* Enrollment Page*/ diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index 5ba38a040c..0ce2e7acdb 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -14,6 +14,11 @@ html { scroll-padding-top: 101px; /* Header Height (80px) + Skip Nav Height (21px) = 101px */ } +/* reCAPTCHA: Do not display badge */ +.grecaptcha-badge { + display: none; +} + body { font-size: 100%; color: var(--text-primary-color); @@ -53,6 +58,8 @@ li { margin: 0; } +/* Utility Classes */ + @media (min-width: 992px) { /* Utility Class: Padding bottom 64px on Desktop */ /* Pair with pb-4 on Form pages to get 24px on Mobile, 64px on Desktop */ @@ -77,6 +84,10 @@ li { letter-spacing: calc(var(--bs-body-font-size) * var(--letter-spacing-5)); } +.list-disc { + list-style-type: disc; +} + /* Links */ /* Same sizes for all screen widths: 18px */ a:not(.btn):not(.card) { @@ -102,6 +113,11 @@ a:visited:not(.btn) { color: var(--selected-color); } +:root { + --external-link-icon-size: var(--font-size-24px); + --external-link-icon-size-small: var(--font-size-18px); +} + a[target="_blank"]::after { content: " "; background-color: currentColor; @@ -115,12 +131,19 @@ a[target="_blank"]::after { display: inline-block; position: relative; - width: 24px; - height: 24px; + width: var(--external-link-icon-size); + height: var(--external-link-icon-size); margin-left: 2px; vertical-align: text-bottom; } +.form-text a[target="_blank"]::after { + width: var(--external-link-icon-size-small); + height: var(--external-link-icon-size-small); + mask-size: contain; + -webkit-mask-size: contain; +} + /* Headlines */ /* All headlines */ h1, @@ -146,7 +169,6 @@ h4, @media (min-width: 992px) { :root { --h1-font-size: var(--font-size-35px); - --h1-text-align: center; --h1-letter-spacing-percent: var(--letter-spacing-5); --font-size-35px: 2.1875rem; } @@ -155,8 +177,7 @@ h4, h1, .h1 { font-size: var(--h1-font-size); - text-align: var(--h1-text-align); - padding-top: calc(70rem / 16); + padding-top: calc(72rem / 16); line-height: var(--heading-line-height); letter-spacing: calc(var(--h1-font-size) * var(--h1-letter-spacing-percent)); } @@ -181,7 +202,7 @@ h2, } /* H2: 18px, up to Small width */ - /* Only used on Landing Page, Eligibility Start */ + /* Only used on Landing Page */ .h2-sm-p { font-size: var(--bs-body-font-size); font-weight: var(--bs-body-font-weight); @@ -387,24 +408,24 @@ footer .footer-links li a.footer-link:visited { :root { --login-gov-button-font-size: var(--font-size-20px); - --login-gov-button-max-width: 310px; + --login-gov-button-padding: 0.5rem; + --login-gov-button-line-height: 1; } @media (min-width: 992px) { :root { --login-gov-button-font-size: var(--font-size-16px); - --login-gov-button-max-width: 289px; + --login-gov-button-padding: 1rem; + --login-gov-button-line-height: 1.5; } } .login { cursor: pointer; - line-height: 1; - text-transform: none; - letter-spacing: 0; font-size: var(--login-gov-button-font-size) !important; font-family: "Public Sans", Roboto, system-ui; - max-width: var(--login-gov-button-max-width); + line-height: var(--login-gov-button-line-height); + text-transform: none; text-decoration: none; } @@ -424,6 +445,13 @@ footer .footer-links li a.footer-link:visited { line-height: 1; } +/* Sign in with Login.gov (white logo) on System Enrollment Error, Eligibility Start */ + +.btn.btn-lg.btn-primary.login { + border-width: calc(4rem / 16); + padding: var(--login-gov-button-padding); +} + @media (min-width: 992px) { .login .fallback-text { margin: 0 0 0 5px; @@ -432,13 +460,6 @@ footer .footer-links li a.footer-link:visited { } } -/* Sign in with Login.gov (white logo) on Eligibility Start, System Enrollment Error */ - -.eligibility-start .btn.btn-lg.btn-primary.login, -.system-enrollment-error .btn.btn-lg.btn-primary.login { - padding: 10px 0; -} - .login .fallback-text.white-logo { background-image: url("/static/img/login-gov-logo-rev.svg"); width: 130.9887px; @@ -513,18 +534,10 @@ footer .footer-links li a.footer-link:visited { } /* Forms: Text Inputs */ -/* Form Container: Must use .form-container parent to use these styles */ - -:root { - --form-input-gap: calc(24rem / 16); -} +/* Form Field Container: Must use .form-field-container parent to use these styles */ -.form-container .form-group:not(:first-child) { - padding-top: var(--form-input-gap); -} - -.form-container .form-control-label, -.form-container .required-label { +.form-field-container .form-control-label, +.form-field-container .required-label { font-size: var(--font-size-16px); font-weight: var(--medium-font-weight); line-height: var(--form-field-text-line-height); @@ -532,7 +545,7 @@ footer .footer-links li a.footer-link:visited { padding-bottom: calc(12rem / 16); } -.form-container .form-control { +.form-field-container .form-control { border-width: var(--border-width); border-radius: var(--border-radius); border-color: var(--primary-color); @@ -542,8 +555,8 @@ footer .footer-links li a.footer-link:visited { /* Input height should be 60px */ } -.form-container .form-control:focus, -.form-container .form-control:focus-visible { +.form-field-container .form-control:focus, +.form-field-container .form-control:focus-visible { outline: 3px solid var(--focus-color) !important; outline-offset: 2px !important; box-shadow: none !important; @@ -552,7 +565,13 @@ footer .footer-links li a.footer-link:visited { .form-text { font-size: var(--font-size-14px); line-height: var(--form-field-text-line-height); - letter-spacing: var(--letter-spacing-5); + letter-spacing: calc(var(--font-size-14px) * var(--letter-spacing-5)); +} + +.form-field-container.eligibility-verification-form { + display: flex; + flex-direction: column; + gap: 1.5rem; } /* Forms: Radio Buttons */ @@ -560,27 +579,12 @@ footer .footer-links li a.footer-link:visited { :root { --radio-button-size: calc(24rem / 16); --radio-input-color: var(--standout-color); - --radio-input-gap: calc(24rem / 16); -} - -@media (min-width: 992px) { - :root { - --radio-input-gap: calc(15rem / 16); - } } .radio-label { cursor: pointer; } -.radio-input-group { - gap: var(--radio-input-gap); -} - -.radio-input-group:not(:first-child) { - padding-top: calc(24rem / 16); -} - .radio-input { cursor: pointer; -webkit-appearance: none; @@ -603,60 +607,6 @@ footer .footer-links li a.footer-link:visited { outline-offset: 1px !important; } -/* Media List */ - -:root { - --media-item-icon-size: calc(64rem / 16); - --media-item-gap: calc(24rem / 16); - --media-item-icon-margin: calc(24rem / 16); - --media-title-margin-top: calc(24rem / 16); -} - -@media (min-width: 992px) { - :root { - --media-item-icon-size: calc(90rem / 16); - --media-item-gap: calc(24rem / 16); - --media-item-icon-margin: calc(32rem / 16); - --media-title-margin-top: calc(64rem / 16); - } -} - -.media-body--details p:not(:first-of-type) { - /* All the p within .media-body--details, except for the first p - Any media item with more than one p */ - padding-top: calc(24rem / 16); -} - -.media-title { - margin-top: var(--media-title-margin-top); - margin-bottom: calc(24rem / 16); -} - -.media-list { - gap: var(--media-item-gap); - margin-bottom: calc(64rem / 16); -} - -.media-list .media .media-line .icon { - width: var(--media-item-icon-size); - height: var(--media-item-icon-size); - margin-right: var(--media-item-icon-margin); -} - -.media-list-icon-left-margin { - margin-left: calc( - var(--media-item-icon-size) + var(--media-item-icon-margin) - ); -} - -.media-list .media .media-body--details, -.media-list .media .media-body--items li:first-child { - padding-top: calc(5rem / 16); -} - -.media-list .media .media-body--items li { - list-style-type: disc; -} - /* Cards */ :root { diff --git a/benefits/static/img/icon/bankcardcheck.svg b/benefits/static/img/icon/bankcardcheck.svg deleted file mode 100644 index 689607feca..0000000000 --- a/benefits/static/img/icon/bankcardcheck.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/benefits/static/img/icon/idcardcheck.svg b/benefits/static/img/icon/idcardcheck.svg deleted file mode 100644 index 58e10289a5..0000000000 --- a/benefits/static/img/icon/idcardcheck.svg +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - - - - - - - - - diff --git a/benefits/templates/200-user-error.html b/benefits/templates/200-user-error.html index 0121b2cce4..1cf471aebc 100644 --- a/benefits/templates/200-user-error.html +++ b/benefits/templates/200-user-error.html @@ -1,13 +1,13 @@ -{% extends "error.html" %} +{% extends "error-base.html" %} {% load i18n %} -{% block title %} +{% block page-title %} {% translate "Start over" %} -{% endblock title %} +{% endblock page-title %} -{% block headline %} +{% block headline-text %} {% translate "You may have reached this page on accident." %} -{% endblock headline %} +{% endblock headline-text %} {% block paragraphs %}

    @@ -15,7 +15,7 @@

    {% endblock paragraphs %} -{% block button %} +{% block call-to-action-button %} {% translate "Start Here" as button_text %} {% include "core/includes/button--index.html" with button_text=button_text %} -{% endblock button %} +{% endblock call-to-action-button %} diff --git a/benefits/templates/400.html b/benefits/templates/400.html index 32060fc02d..29b8e5570f 100644 --- a/benefits/templates/400.html +++ b/benefits/templates/400.html @@ -1,13 +1,13 @@ -{% extends "error.html" %} +{% extends "error-base.html" %} {% load i18n %} -{% block title %} +{% block page-title %} {% translate "Service is down" %} -{% endblock title %} +{% endblock page-title %} -{% block headline %} +{% block headline-text %} {% translate "Sorry! Service for this site is down." %} -{% endblock headline %} +{% endblock headline-text %} {% block paragraphs %}

    {% translate "We should be back in operation soon. Please refresh the page in a few minutes." %}

    diff --git a/benefits/templates/404.html b/benefits/templates/404.html index 0a563a6135..7cf2613f2e 100644 --- a/benefits/templates/404.html +++ b/benefits/templates/404.html @@ -1,13 +1,13 @@ -{% extends "error.html" %} +{% extends "error-base.html" %} {% load i18n %} -{% block title %} +{% block page-title %} {% translate "Page not found" %} -{% endblock title %} +{% endblock page-title %} -{% block headline %} +{% block headline-text %} {% translate "Sorry! We can’t find that page." %} -{% endblock headline %} +{% endblock headline-text %} {% block paragraphs %}

    {% translate "The page you are looking for might be somewhere else or may not exist anymore." %}

    diff --git a/benefits/templates/500.html b/benefits/templates/500.html index f1e2805e45..86bf39a193 100644 --- a/benefits/templates/500.html +++ b/benefits/templates/500.html @@ -1,13 +1,13 @@ -{% extends "error.html" %} +{% extends "error-base.html" %} {% load i18n %} -{% block title %} +{% block page-title %} {% translate "Service is down" %} -{% endblock title %} +{% endblock page-title %} -{% block headline %} +{% block headline-text %} {% translate "We’re working on fixing a problem." %} -{% endblock headline %} +{% endblock headline-text %} {% block paragraphs %}

    diff --git a/benefits/templates/error-base.html b/benefits/templates/error-base.html new file mode 100644 index 0000000000..779394c2d4 --- /dev/null +++ b/benefits/templates/error-base.html @@ -0,0 +1,19 @@ +{% extends "core/base.html" %} + +{% block inner-content %} +

    + {% block icon %} + {% include "core/includes/icon.html" with name="sadbus" %} + {% endblock icon %} +
    +

    + {% block headline-text %} + {% endblock headline-text %} +

    + {% block paragraphs %} + {% endblock paragraphs %} +{% endblock inner-content %} + +{% block call-to-action-button %} + {% include "core/includes/button--origin.html" %} +{% endblock call-to-action-button %} diff --git a/benefits/templates/error.html b/benefits/templates/error.html deleted file mode 100644 index 1fba99da63..0000000000 --- a/benefits/templates/error.html +++ /dev/null @@ -1,32 +0,0 @@ -{% extends "core/base.html" %} -{% load i18n %} - -{% block page-title %} - {% block title %} - {% endblock title %} -{% endblock page-title %} - -{% block main-content %} -
    -

    - {% include "core/includes/icon.html" with name="sadbus" %} - {% block headline %} - {% endblock headline %} -

    - -
    -
    - {% block paragraphs %} - {% endblock paragraphs %} -
    -
    - -
    -
    - {% block button %} - {% include "core/includes/button--origin.html" %} - {% endblock button %} -
    -
    -
    -{% endblock main-content %} diff --git a/tests/pytest/conftest.py b/tests/pytest/conftest.py index 620622ba4f..3af0afb683 100644 --- a/tests/pytest/conftest.py +++ b/tests/pytest/conftest.py @@ -175,7 +175,7 @@ def model_TransitAgency(model_PemData, model_TransitProcessor): eligibility_api_id="test123", eligibility_api_private_key=model_PemData, eligibility_api_public_key=model_PemData, - index_template_override="core/agency-index.html", + index_template_override="core/index--agency-base.html", eligibility_index_template_override="eligibility/index.html", logo_large="agencies/cst-lg.png", logo_small="agencies/cst-sm.png", diff --git a/tests/pytest/core/test_models.py b/tests/pytest/core/test_models.py index afbb4f0b3f..c92436d508 100644 --- a/tests/pytest/core/test_models.py +++ b/tests/pytest/core/test_models.py @@ -31,7 +31,7 @@ def mock_requests_get_pem_data(mocker): @pytest.mark.parametrize( "input_template,expected_path", [ - ("error.html", f"{settings.BASE_DIR}/benefits/templates/error.html"), + ("error-base.html", f"{settings.BASE_DIR}/benefits/templates/error-base.html"), ("core/index.html", f"{settings.BASE_DIR}/benefits/core/templates/core/index.html"), ("eligibility/start.html", f"{settings.BASE_DIR}/benefits/eligibility/templates/eligibility/start.html"), ("", None),