From d81de3eab702a68e2eb84e7f476e13480e84a9cc Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 19:35:58 +0000 Subject: [PATCH 01/18] feat(elig-index): create recaptcha-text, add spanish, add to elig index --- .../core/templates/core/includes/recaptcha-text.html | 7 +++++++ .../eligibility/templates/eligibility/index.html | 4 ++++ benefits/locale/en/LC_MESSAGES/django.po | 9 ++++++++- benefits/locale/es/LC_MESSAGES/django.po | 12 +++++++++++- 4 files changed, 30 insertions(+), 2 deletions(-) create mode 100644 benefits/core/templates/core/includes/recaptcha-text.html 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 000000000..8b6e19eed --- /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/eligibility/templates/eligibility/index.html b/benefits/eligibility/templates/eligibility/index.html index 428e2e8c8..f8e87f91d 100644 --- a/benefits/eligibility/templates/eligibility/index.html +++ b/benefits/eligibility/templates/eligibility/index.html @@ -40,3 +40,7 @@

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

{% endblock inner-content %} + +{% block call-to-action-button %} + {% include "core/includes/recaptcha-text.html" %} +{% endblock call-to-action-button %} diff --git a/benefits/locale/en/LC_MESSAGES/django.po b/benefits/locale/en/LC_MESSAGES/django.po index 1b40940fa..8f6758259 100644 --- a/benefits/locale/en/LC_MESSAGES/django.po +++ b/benefits/locale/en/LC_MESSAGES/django.po @@ -6,7 +6,7 @@ msgid "" msgstr "" "Report-Msgid-Bugs-To: https://github.com/cal-itp/benefits/issues \n" -"POT-Creation-Date: 2024-12-09 13:27-0800\n" +"POT-Creation-Date: 2024-12-11 11:19-0800\n" "Language: English\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -320,6 +320,13 @@ 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 a reduced fare on CST public transportation when you tap to ride" msgstr "" diff --git a/benefits/locale/es/LC_MESSAGES/django.po b/benefits/locale/es/LC_MESSAGES/django.po index 1f40c5888..9d5e17b74 100644 --- a/benefits/locale/es/LC_MESSAGES/django.po +++ b/benefits/locale/es/LC_MESSAGES/django.po @@ -6,7 +6,7 @@ msgid "" msgstr "" "Report-Msgid-Bugs-To: https://github.com/cal-itp/benefits/issues \n" -"POT-Creation-Date: 2024-12-09 13:27-0800\n" +"POT-Creation-Date: 2024-12-11 11:19-0800\n" "Language: Español\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -434,6 +434,16 @@ 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 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 " From 8a5d4cdaa2ba69ca00f1f4340a8ceea134d7d2b9 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 19:40:23 +0000 Subject: [PATCH 02/18] refactor(form): put recaptcha link in form instead --- benefits/core/templates/core/includes/form.html | 6 +++++- benefits/eligibility/templates/eligibility/confirm.html | 3 +++ benefits/eligibility/templates/eligibility/index.html | 5 ++--- 3 files changed, 10 insertions(+), 4 deletions(-) diff --git a/benefits/core/templates/core/includes/form.html b/benefits/core/templates/core/includes/form.html index 456227a63..8333cc30c 100644 --- a/benefits/core/templates/core/includes/form.html +++ b/benefits/core/templates/core/includes/form.html @@ -121,6 +121,10 @@ $("button[type=submit]", "#{{ form.id }}").on("click", recaptchaSubmit); {% endif %} - + +
+
{% include "core/includes/recaptcha-text.html" %}
+
+ {% endif %} diff --git a/benefits/eligibility/templates/eligibility/confirm.html b/benefits/eligibility/templates/eligibility/confirm.html index 42b2743e7..a405d05a3 100644 --- a/benefits/eligibility/templates/eligibility/confirm.html +++ b/benefits/eligibility/templates/eligibility/confirm.html @@ -30,3 +30,6 @@

{{ form.headline }}

{% include "core/includes/form.html" with form=form %}
{% endblock inner-content %} + +{% block call-to-action %} +{% endblock call-to-action %} diff --git a/benefits/eligibility/templates/eligibility/index.html b/benefits/eligibility/templates/eligibility/index.html index f8e87f91d..199f54906 100644 --- a/benefits/eligibility/templates/eligibility/index.html +++ b/benefits/eligibility/templates/eligibility/index.html @@ -41,6 +41,5 @@

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

{% endblock inner-content %} -{% block call-to-action-button %} - {% include "core/includes/recaptcha-text.html" %} -{% endblock call-to-action-button %} +{% block call-to-action %} +{% endblock call-to-action %} From 32c9297cc478f64db23d73b1a1b751c4f4c83b1b Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 19:47:53 +0000 Subject: [PATCH 03/18] fix(form): fix alignment of recaptcha, was slightly too wide --- benefits/core/templates/core/includes/form.html | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/benefits/core/templates/core/includes/form.html b/benefits/core/templates/core/includes/form.html index 8333cc30c..5b27ca3e9 100644 --- a/benefits/core/templates/core/includes/form.html +++ b/benefits/core/templates/core/includes/form.html @@ -123,8 +123,6 @@ {% endif %} -
-
{% include "core/includes/recaptcha-text.html" %}
-
+
{% include "core/includes/recaptcha-text.html" %}
{% endif %} From 7a81aab6660ed6a313496d1d771a777bb4269cc9 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 19:51:33 +0000 Subject: [PATCH 04/18] fix(elig-confirm): form does not need to be wrapped in container/row --- benefits/eligibility/templates/eligibility/confirm.html | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/benefits/eligibility/templates/eligibility/confirm.html b/benefits/eligibility/templates/eligibility/confirm.html index a405d05a3..f0a953cd1 100644 --- a/benefits/eligibility/templates/eligibility/confirm.html +++ b/benefits/eligibility/templates/eligibility/confirm.html @@ -26,9 +26,7 @@

{{ form.headline }}

{% endblock explanatory-text-wrapper %} {% block inner-content %} -
-
{% include "core/includes/form.html" with form=form %}
-
+ {% include "core/includes/form.html" with form=form %} {% endblock inner-content %} {% block call-to-action %} From d331ca6f0281b99fc2bec065029ea5a61f392564 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 20:15:00 +0000 Subject: [PATCH 05/18] feat(recaptcha-text): add text styling, add icon size styling --- benefits/core/templates/core/includes/recaptcha-text.html | 2 +- benefits/static/css/styles.css | 7 ++++++- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/benefits/core/templates/core/includes/recaptcha-text.html b/benefits/core/templates/core/includes/recaptcha-text.html index 8b6e19eed..f2ce11753 100644 --- a/benefits/core/templates/core/includes/recaptcha-text.html +++ b/benefits/core/templates/core/includes/recaptcha-text.html @@ -1,6 +1,6 @@ {% 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/static/css/styles.css b/benefits/static/css/styles.css index e791d7009..d6ceb5c15 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -125,6 +125,11 @@ a[target="_blank"]::after { vertical-align: text-bottom; } +.form-text a[target="_blank"]::after { + width: 18px; + height: 18px; +} + /* Headlines */ /* All headlines */ h1, @@ -552,7 +557,7 @@ 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)); } /* Forms: Radio Buttons */ From 129d10863bb9d64c55889c42c7de7080da46b033 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 20:16:36 +0000 Subject: [PATCH 06/18] fix(recaptcha-text): don't link the Google part, for En and Es --- .../core/includes/recaptcha-text.html | 2 +- benefits/locale/en/LC_MESSAGES/django.po | 11 ++++++----- benefits/locale/es/LC_MESSAGES/django.po | 19 +++++++++++-------- 3 files changed, 18 insertions(+), 14 deletions(-) diff --git a/benefits/core/templates/core/includes/recaptcha-text.html b/benefits/core/templates/core/includes/recaptcha-text.html index f2ce11753..6724120a4 100644 --- a/benefits/core/templates/core/includes/recaptcha-text.html +++ b/benefits/core/templates/core/includes/recaptcha-text.html @@ -2,6 +2,6 @@

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

diff --git a/benefits/locale/en/LC_MESSAGES/django.po b/benefits/locale/en/LC_MESSAGES/django.po index 8f6758259..d64f88b19 100644 --- a/benefits/locale/en/LC_MESSAGES/django.po +++ b/benefits/locale/en/LC_MESSAGES/django.po @@ -6,7 +6,7 @@ msgid "" msgstr "" "Report-Msgid-Bugs-To: https://github.com/cal-itp/benefits/issues \n" -"POT-Creation-Date: 2024-12-11 11:19-0800\n" +"POT-Creation-Date: 2024-12-11 12:16-0800\n" "Language: English\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -321,10 +321,11 @@ msgid "" msgstr "" msgid "" -"This site is protected by reCAPTCHA and the Google " -"Privacy Policy and Terms of Service apply." +"This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service " +"apply." msgstr "" msgid "Get a reduced fare on CST public transportation when you tap to ride" diff --git a/benefits/locale/es/LC_MESSAGES/django.po b/benefits/locale/es/LC_MESSAGES/django.po index 9d5e17b74..257b882ce 100644 --- a/benefits/locale/es/LC_MESSAGES/django.po +++ b/benefits/locale/es/LC_MESSAGES/django.po @@ -6,7 +6,7 @@ msgid "" msgstr "" "Report-Msgid-Bugs-To: https://github.com/cal-itp/benefits/issues \n" -"POT-Creation-Date: 2024-12-11 11:19-0800\n" +"POT-Creation-Date: 2024-12-11 12:16-0800\n" "Language: Español\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -435,14 +435,17 @@ msgstr "" "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." +"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." +"Este sitio está protegido por reCAPTCHA y se aplican la Política de privacidad y las Condiciones de " +"servicio de Google." msgid "Get a reduced fare on CST public transportation when you tap to ride" msgstr "" From 128d28a4119664a0617d6719050f5256ba0ad26b Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 20:18:32 +0000 Subject: [PATCH 07/18] feat(recaptcha): hide the badge with CSS --- benefits/static/css/styles.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index d6ceb5c15..145e6015a 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: Hide the badge */ +.grecaptcha-badge { + visibility: hidden; +} + body { font-size: 100%; color: var(--text-primary-color); From 29dad70fc05ab08f5ed51b98f794db6b646ac020 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 20:51:26 +0000 Subject: [PATCH 08/18] fix(recaptcha-text): add mt-0 to reset margin-top from bootstrap --- benefits/core/templates/core/includes/recaptcha-text.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/benefits/core/templates/core/includes/recaptcha-text.html b/benefits/core/templates/core/includes/recaptcha-text.html index 6724120a4..dbdf54c22 100644 --- a/benefits/core/templates/core/includes/recaptcha-text.html +++ b/benefits/core/templates/core/includes/recaptcha-text.html @@ -1,6 +1,6 @@ {% load i18n %} -

+

{% blocktranslate trimmed %} This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply. {% endblocktranslate %} From 7479af30a2d6fa6f3748c368a823d9c912024a4d Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 23:01:32 +0000 Subject: [PATCH 09/18] refactor: refactor form to allow for a mb-fix that shortens space under text for elig-confirm --- .../core/templates/core/includes/form.html | 63 +++++++++---------- benefits/eligibility/forms.py | 3 +- benefits/static/css/styles.css | 26 ++++---- 3 files changed, 43 insertions(+), 49 deletions(-) diff --git a/benefits/core/templates/core/includes/form.html b/benefits/core/templates/core/includes/form.html index 5b27ca3e9..695d9a9aa 100644 --- a/benefits/core/templates/core/includes/form.html +++ b/benefits/core/templates/core/includes/form.html @@ -3,41 +3,39 @@ {% 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 +92,8 @@ {% endcomment %} +
{% include "core/includes/recaptcha-text.html" %}
+ {% endif %} - -
{% include "core/includes/recaptcha-text.html" %}
- {% endif %} diff --git a/benefits/eligibility/forms.py b/benefits/eligibility/forms.py index 00baf1eff..3b7a74e46 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-6" # second element is not used since we render the whole label using selection_label_template, # therefore set to None flow_field = self.fields["flow"] @@ -110,7 +109,7 @@ def __init__( self.headline = headline self.blurb = blurb - self.classes = "col-lg-6" + self.classes = "mb-fix" sub_widget = widgets.FormControlTextInput(placeholder=sub_placeholder) if sub_pattern: sub_widget.attrs.update({"pattern": sub_pattern}) diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index 145e6015a..088962790 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -58,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 */ @@ -86,6 +88,10 @@ li { list-style-type: disc; } +.mb-fix { + margin-bottom: -40px; +} + /* Links */ /* Same sizes for all screen widths: 18px */ a:not(.btn):not(.card) { @@ -523,18 +529,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-container .form-group:not(:first-child) { - padding-top: var(--form-input-gap); -} +/* Form Field Container: Must use .form-container parent to use these styles */ -.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); @@ -542,7 +540,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); @@ -552,8 +550,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; From 5d34bb409333d4c67806257f16efea532b361ae9 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 23:06:43 +0000 Subject: [PATCH 10/18] fix: update comment to proper classname --- benefits/static/css/styles.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index 088962790..28dbe6fbf 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -529,7 +529,7 @@ footer .footer-links li a.footer-link:visited { } /* Forms: Text Inputs */ -/* Form Field Container: Must use .form-container parent to use these styles */ +/* Form Field Container: Must use .form-field-container parent to use these styles */ .form-field-container .form-control-label, .form-field-container .required-label { From 9cfd2c607fdda8d5c416b416469d745224f716a5 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 11 Dec 2024 23:32:38 +0000 Subject: [PATCH 11/18] refactor(css): use a footer style rather than negative margin hack --- benefits/eligibility/forms.py | 1 - benefits/eligibility/templates/eligibility/confirm.html | 4 ++++ benefits/static/css/styles.css | 8 ++++---- 3 files changed, 8 insertions(+), 5 deletions(-) diff --git a/benefits/eligibility/forms.py b/benefits/eligibility/forms.py index 3b7a74e46..0ef9dc6b1 100644 --- a/benefits/eligibility/forms.py +++ b/benefits/eligibility/forms.py @@ -109,7 +109,6 @@ def __init__( self.headline = headline self.blurb = blurb - self.classes = "mb-fix" 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 f0a953cd1..a441bf7e0 100644 --- a/benefits/eligibility/templates/eligibility/confirm.html +++ b/benefits/eligibility/templates/eligibility/confirm.html @@ -1,5 +1,9 @@ {% extends "core/base.html" %} +{% block classes %} + {{ block.super | add:" eligibility-confirm" }} +{% endblock classes %} + {% block page-title %} {{ form.title }} {% endblock page-title %} diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index 28dbe6fbf..135efdb23 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -88,10 +88,6 @@ li { list-style-type: disc; } -.mb-fix { - margin-bottom: -40px; -} - /* Links */ /* Same sizes for all screen widths: 18px */ a:not(.btn):not(.card) { @@ -301,6 +297,10 @@ footer { margin-top: 64px; } +.eligibility-confirm footer { + margin-top: 24px; +} + footer .footer-links li a.footer-link { color: var(--footer-link-color); font-weight: var(--footer-link-font-weight); From a4e9b6f15b0631970830be1c3766c9352f8909a6 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Mon, 16 Dec 2024 21:19:45 +0000 Subject: [PATCH 12/18] refactor(css): variable-ize external link icon size --- benefits/static/css/styles.css | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index 135efdb23..bf8c324f1 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -113,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; @@ -126,15 +131,15 @@ 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: 18px; - height: 18px; + width: var(--external-link-icon-size-small); + height: var(--external-link-icon-size-small); } /* Headlines */ From 1f2ee3e8995b34613e4438abe4b5a467f97b0ff2 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Mon, 16 Dec 2024 21:28:34 +0000 Subject: [PATCH 13/18] fix(css): contain icon size --- benefits/static/css/styles.css | 2 ++ 1 file changed, 2 insertions(+) diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index bf8c324f1..be151a6b1 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -140,6 +140,8 @@ a[target="_blank"]::after { .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 */ From 87f40f7f6258ced277f1b891eb131d79134cba31 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Tue, 17 Dec 2024 00:54:34 +0000 Subject: [PATCH 14/18] docs: add clarifying comments --- benefits/eligibility/templates/eligibility/confirm.html | 1 + benefits/eligibility/templates/eligibility/index.html | 1 + 2 files changed, 2 insertions(+) diff --git a/benefits/eligibility/templates/eligibility/confirm.html b/benefits/eligibility/templates/eligibility/confirm.html index a441bf7e0..ff20e4cdb 100644 --- a/benefits/eligibility/templates/eligibility/confirm.html +++ b/benefits/eligibility/templates/eligibility/confirm.html @@ -33,5 +33,6 @@

{{ form.headline }}

{% 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/index.html b/benefits/eligibility/templates/eligibility/index.html index 199f54906..8008e4e62 100644 --- a/benefits/eligibility/templates/eligibility/index.html +++ b/benefits/eligibility/templates/eligibility/index.html @@ -41,5 +41,6 @@

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

{% endblock inner-content %} +{% comment %} Override with empty block to prevent rendering empty divs {% endcomment %} {% block call-to-action %} {% endblock call-to-action %} From b21f8060b17ae006aba526dcf42e0771519cdc85 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Tue, 17 Dec 2024 17:14:07 +0000 Subject: [PATCH 15/18] fix(recaptcha): use display none on badge --- benefits/static/css/styles.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index be151a6b1..aa97a6094 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -14,9 +14,9 @@ html { scroll-padding-top: 101px; /* Header Height (80px) + Skip Nav Height (21px) = 101px */ } -/* reCAPTCHA: Hide the badge */ +/* reCAPTCHA: Do not display badge */ .grecaptcha-badge { - visibility: hidden; + display: none; } body { From 986fc6f32c89f8ff0620a73c48a974c6094c0e3c Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Tue, 17 Dec 2024 21:25:06 +0000 Subject: [PATCH 16/18] fix(css): remove 24px footer margin from elig-confirm --- benefits/static/css/styles.css | 4 ---- 1 file changed, 4 deletions(-) diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index aa97a6094..02ca1777e 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -304,10 +304,6 @@ footer { margin-top: 64px; } -.eligibility-confirm footer { - margin-top: 24px; -} - footer .footer-links li a.footer-link { color: var(--footer-link-color); font-weight: var(--footer-link-font-weight); From ec05326936d1425203de15c39c1d2f74bc2a5b6c Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Tue, 17 Dec 2024 21:37:29 +0000 Subject: [PATCH 17/18] fix: remove unnecessary class --- benefits/eligibility/templates/eligibility/confirm.html | 4 ---- 1 file changed, 4 deletions(-) diff --git a/benefits/eligibility/templates/eligibility/confirm.html b/benefits/eligibility/templates/eligibility/confirm.html index ff20e4cdb..cac09f1d1 100644 --- a/benefits/eligibility/templates/eligibility/confirm.html +++ b/benefits/eligibility/templates/eligibility/confirm.html @@ -1,9 +1,5 @@ {% extends "core/base.html" %} -{% block classes %} - {{ block.super | add:" eligibility-confirm" }} -{% endblock classes %} - {% block page-title %} {{ form.title }} {% endblock page-title %} From dce769c917469c7e9f1fb4f781e339005437e772 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 18 Dec 2024 01:06:07 +0000 Subject: [PATCH 18/18] fix(form): undo form refactoring for now --- benefits/core/templates/core/includes/form.html | 2 +- benefits/eligibility/templates/eligibility/confirm.html | 4 +++- benefits/eligibility/templates/eligibility/index.html | 4 +++- 3 files changed, 7 insertions(+), 3 deletions(-) diff --git a/benefits/core/templates/core/includes/form.html b/benefits/core/templates/core/includes/form.html index 695d9a9aa..4ff9c81a5 100644 --- a/benefits/core/templates/core/includes/form.html +++ b/benefits/core/templates/core/includes/form.html @@ -4,7 +4,7 @@ {% url form.action_url as form_action %}
diff --git a/benefits/eligibility/templates/eligibility/confirm.html b/benefits/eligibility/templates/eligibility/confirm.html index cac09f1d1..770d9a6da 100644 --- a/benefits/eligibility/templates/eligibility/confirm.html +++ b/benefits/eligibility/templates/eligibility/confirm.html @@ -26,7 +26,9 @@

{{ form.headline }}

{% endblock explanatory-text-wrapper %} {% block inner-content %} - {% include "core/includes/form.html" with form=form %} +
+
{% include "core/includes/form.html" with form=form %}
+
{% endblock inner-content %} {% comment %} Override with empty block to prevent rendering empty divs {% endcomment %} diff --git a/benefits/eligibility/templates/eligibility/index.html b/benefits/eligibility/templates/eligibility/index.html index 8008e4e62..69135ddc5 100644 --- a/benefits/eligibility/templates/eligibility/index.html +++ b/benefits/eligibility/templates/eligibility/index.html @@ -30,7 +30,9 @@

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

+
{% include "core/includes/form.html" with form=form %}
+