From 6d9ef1e10bdd3a53f4f67b245c3eed637521f039 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 19 Jul 2023 18:49:03 +0000 Subject: [PATCH 01/18] feat(eligibility-start): first pass at contactless modal --- .../media-item--bankcardcheck--start.html | 7 +++- .../includes/modal--contactless.html | 20 ++++++++++++ benefits/locale/en/LC_MESSAGES/django.po | 32 ++++++++++++++++--- benefits/locale/es/LC_MESSAGES/django.po | 32 ++++++++++++++++--- 4 files changed, 82 insertions(+), 9 deletions(-) create mode 100644 benefits/eligibility/templates/eligibility/includes/modal--contactless.html diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html b/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html index 238db8dad..4810774ad 100644 --- a/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html +++ b/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html @@ -12,6 +12,11 @@ {% block body %}
-

{% translate "eligibility.pages.start.bankcard.text" %}

+

+ {% translate "eligibility.pages.start.bankcard.text" %} + {% include "core/includes/modal-trigger.html" with id="contactless-modal" classes="modal-trigger--link" text="Learn more about contactless cards" %} +

+ + {% include "eligibility/includes/modal--contactless.html" with id="contactless-modal" size="modal-lg" %} {% endblock body %} diff --git a/benefits/eligibility/templates/eligibility/includes/modal--contactless.html b/benefits/eligibility/templates/eligibility/includes/modal--contactless.html new file mode 100644 index 000000000..eaf518b14 --- /dev/null +++ b/benefits/eligibility/templates/eligibility/includes/modal--contactless.html @@ -0,0 +1,20 @@ +{% extends "core/includes/modal-info.html" %} +{% load i18n %} +{% load static %} + +{% block modal-content %} +

{% translate "eligibility.pages.start.modal.title" %}

+
+

{% translate "eligibility.pages.start.modal.p[0]" %}

+

{% translate "eligibility.pages.start.modal.p[1]" %}

+

+ {% translate +

+

{% translate "eligibility.pages.start.modal.p[3]" %}

+

{% translate "eligibility.pages.start.modal.p[4]" %}

+
+{% endblock modal-content %} diff --git a/benefits/locale/en/LC_MESSAGES/django.po b/benefits/locale/en/LC_MESSAGES/django.po index a6013a9f9..91a0e6542 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: 2023-07-16 22:50+0000\n" +"POT-Creation-Date: 2023-07-12 03:15+0000\n" "Language: English\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -374,9 +374,33 @@ msgstr "" "If you do not have an account with any of these services, you will need to " "create one. We recommend using Login.gov." -msgctxt "image alt text" -msgid "core.icons.idcardcheck" -msgstr "Identification card icon with checkmark" +msgid "eligibility.pages.start.modal.title" +msgstr "Learn more about contactless cards" + +msgid "eligibility.pages.start.modal.p[0]" +msgstr "" +"Benefits only works with contactless debit or credit cards. We do not " +"currently support mobile wallets or digital cards, such as Apple Pay, Google " +"Wallet, or Samsung Wallet." + +msgid "eligibility.pages.start.modal.p[1]" +msgstr "The contactless symbol is four curved lines, like this:" + +msgid "eligibility.pages.start.modal.p[3]" +msgstr "" +"Don’t have access to a contactless card? You can request a contactless card " +"from your bank, or one of the companies that offer free contactless prepaid " +"debit cards, such as the Cash App Visa debit card or the Venmo Mastercard " +"debit card." + +msgid "eligibility.pages.start.modal.p[4]" +msgstr "" +"You can still get your transit benefit by going through your [agency]'s " +"application process. For updates on additional options, please check back on " +"this website, or contact [short name]." + +msgid "eligibility.pages.start.sub_headline" +msgstr "You will need a few items to connect your benefit:" msgid "eligibility.pages.index.senior.help.headline" msgstr "Learn more about" diff --git a/benefits/locale/es/LC_MESSAGES/django.po b/benefits/locale/es/LC_MESSAGES/django.po index 563aa68f3..c4129e36d 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: 2023-07-16 22:50+0000\n" +"POT-Creation-Date: 2023-07-12 03:15+0000\n" "Language: Español\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -386,9 +386,33 @@ msgstr "" "TODO: If you do not have an account with any of these services, you will " "need to create one. We recommend using Login.gov." -msgctxt "image alt text" -msgid "core.icons.idcardcheck" -msgstr "Icono de tarjeta de identificación con marca de verificación" +msgid "eligibility.pages.start.modal.title" +msgstr "TODO: Learn more about contactless cards" + +msgid "eligibility.pages.start.modal.p[0]" +msgstr "" +"TODO: Benefits only works with contactless debit or credit cards. We do not " +"currently support mobile wallets or digital cards, such as Apple Pay, Google " +"Wallet, or Samsung Wallet." + +msgid "eligibility.pages.start.modal.p[1]" +msgstr "TODO: The contactless symbol is four curved lines, like this:" + +msgid "eligibility.pages.start.modal.p[3]" +msgstr "" +"TODO: Don’t have access to a contactless card? You can request a contactless " +"card from your bank, or one of the companies that offer free contactless " +"prepaid debit cards, such as the Cash App Visa debit card or the Venmo " +"Mastercard debit card." + +msgid "eligibility.pages.start.modal.p[4]" +msgstr "" +"TODO: You can still get your transit benefit by going through your " +"[agency]'s application process. For updates on additional options, please " +"check back on this website, or contact [short name]." + +msgid "eligibility.pages.start.sub_headline" +msgstr "Necesitará algunos artículos para conectar su beneficio:" msgid "eligibility.pages.index.senior.help.headline" msgstr "TODO: Learn more about" From 146d286c7d171498a22a92f4ff185753ccc8aac8 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 12 Jul 2023 03:34:27 +0000 Subject: [PATCH 02/18] fix(eligibility-start): modal - use msgid for trigger text --- .../eligibility/includes/media-item--bankcardcheck--start.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html b/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html index 4810774ad..be64647ff 100644 --- a/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html +++ b/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html @@ -14,7 +14,8 @@

{% translate "eligibility.pages.start.bankcard.text" %} - {% include "core/includes/modal-trigger.html" with id="contactless-modal" classes="modal-trigger--link" text="Learn more about contactless cards" %} + {% translate "eligibility.pages.start.modal.title" as trigger_text %} + {% include "core/includes/modal-trigger.html" with id="contactless-modal" classes="modal-trigger--link" text=trigger_text %}

From 25d27dca7cb309fe4c1a0ebe69b9d09d8b252f19 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 19 Jul 2023 19:01:15 +0000 Subject: [PATCH 03/18] chore: rebase dev fix --- benefits/locale/en/LC_MESSAGES/django.po | 4 ++++ benefits/locale/es/LC_MESSAGES/django.po | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/benefits/locale/en/LC_MESSAGES/django.po b/benefits/locale/en/LC_MESSAGES/django.po index 91a0e6542..b7e9a6bbf 100644 --- a/benefits/locale/en/LC_MESSAGES/django.po +++ b/benefits/locale/en/LC_MESSAGES/django.po @@ -374,6 +374,10 @@ msgstr "" "If you do not have an account with any of these services, you will need to " "create one. We recommend using Login.gov." +msgctxt "image alt text" +msgid "core.icons.idcardcheck" +msgstr "Identification card icon with checkmark" + msgid "eligibility.pages.start.modal.title" msgstr "Learn more about contactless cards" diff --git a/benefits/locale/es/LC_MESSAGES/django.po b/benefits/locale/es/LC_MESSAGES/django.po index c4129e36d..10cafcad2 100644 --- a/benefits/locale/es/LC_MESSAGES/django.po +++ b/benefits/locale/es/LC_MESSAGES/django.po @@ -386,6 +386,10 @@ msgstr "" "TODO: If you do not have an account with any of these services, you will " "need to create one. We recommend using Login.gov." +msgctxt "image alt text" +msgid "core.icons.idcardcheck" +msgstr "Icono de tarjeta de identificación con marca de verificación" + msgid "eligibility.pages.start.modal.title" msgstr "TODO: Learn more about contactless cards" From 72bbe445a5ab098fa1fcab016ee6f2eb9c31b0a0 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Tue, 18 Jul 2023 19:27:15 +0000 Subject: [PATCH 04/18] fix(copy): fix duplicate copy --- benefits/locale/en/LC_MESSAGES/django.po | 27 ++++++++++------------- benefits/locale/es/LC_MESSAGES/django.po | 28 ++++++++++-------------- 2 files changed, 24 insertions(+), 31 deletions(-) diff --git a/benefits/locale/en/LC_MESSAGES/django.po b/benefits/locale/en/LC_MESSAGES/django.po index b7e9a6bbf..6cae9a387 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: 2023-07-12 03:15+0000\n" +"POT-Creation-Date: 2023-07-18 19:25+0000\n" "Language: English\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -102,14 +102,14 @@ msgid "core.pages.help.payment_options.p[2][0]%(website)s" msgstr "" "Don’t have access to a bank card? You can request a contactless card from " "one of the companies that offer free contactless prepaid debit cards, such " -"as the Cash App Visa Debit Card " +"as the Cash App Visa Debit Card " #, python-format msgid "core.pages.help.payment_options.p[2][1]%(website)s" msgstr "" -"or the Venmo Mastercard Debit Card." +"or the Venmo Mastercard Debit Card." msgid "core.pages.help.payment_options.p[3]" msgstr "" @@ -140,8 +140,8 @@ msgid "core.pages.help.login_gov.p[2]" msgstr "" "To learn more about Login.gov, please visit the Login.gov website or the " -"Login.gov Help Center." +"Login.gov Help Center." msgid "core.pages.help.login_gov_verify" msgstr "How do I verify my identity on Login.gov?" @@ -318,6 +318,9 @@ msgid "eligibility.pages.start.bankcard.text" msgstr "" "Your contactless card must be a debit or credit card by Visa or Mastercard." +msgid "eligibility.pages.start.modal.title" +msgstr "Learn more about contactless cards" + msgid "eligibility.pages.start.mst_courtesy_card.start_item.heading" msgstr "Your current Courtesy Card number" @@ -378,9 +381,6 @@ msgctxt "image alt text" msgid "core.icons.idcardcheck" msgstr "Identification card icon with checkmark" -msgid "eligibility.pages.start.modal.title" -msgstr "Learn more about contactless cards" - msgid "eligibility.pages.start.modal.p[0]" msgstr "" "Benefits only works with contactless debit or credit cards. We do not " @@ -403,9 +403,6 @@ msgstr "" "application process. For updates on additional options, please check back on " "this website, or contact [short name]." -msgid "eligibility.pages.start.sub_headline" -msgstr "You will need a few items to connect your benefit:" - msgid "eligibility.pages.index.senior.help.headline" msgstr "Learn more about" @@ -494,8 +491,8 @@ msgstr "" "This option is for people who have served in the active military, naval, or " "air service, and who were discharged or released therefrom under conditions " "other than dishonorable. You will need to verify your identity through VA.gov" +"resources/verifying-your-identity-on-vagov/' target=\"_blank\" rel=" +"\"noopener noreferrer\">verify your identity through VA.gov" msgid "eligibility.pages.index.intro.mst" msgstr "" diff --git a/benefits/locale/es/LC_MESSAGES/django.po b/benefits/locale/es/LC_MESSAGES/django.po index 10cafcad2..95c4fc334 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: 2023-07-12 03:15+0000\n" +"POT-Creation-Date: 2023-07-18 19:25+0000\n" "Language: Español\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -112,8 +112,8 @@ msgstr "" #, python-format msgid "core.pages.help.payment_options.p[2][1]%(website)s" msgstr "" -"o la tarjeta de débito Venmo Mastercard." +"o la tarjeta de débito Venmo Mastercard." msgid "core.pages.help.payment_options.p[3]" msgstr "" @@ -144,8 +144,8 @@ msgid "core.pages.help.login_gov.p[2]" msgstr "" "Para obtener más información sobre Login.gov, visite Login.gov o Login.gov: Centro de ayuda." +"href='https://login.gov/es/help/' target=\"_blank\" rel=\"noopener noreferrer" +"\">Login.gov: Centro de ayuda." msgid "core.pages.help.login_gov_verify" msgstr "¿Cómo verifico mi identidad en Login.gov?" @@ -205,9 +205,8 @@ msgstr "" #, python-format msgid "core.pages.help.littlepay.p[1]%(website)s" msgstr "" -"Para obtener más información sobre Littlepay, visite el sitio web de Littlepay." +"Para obtener más información sobre Littlepay, visite el sitio web de Littlepay." msgid "core.pages.help.questions" msgstr "¿Preguntas?" @@ -329,6 +328,9 @@ msgstr "" "TODO: Su tarjeta debe ser una tarjeta de débito o crédito sin contacto de " "Visa o Mastercard." +msgid "eligibility.pages.start.modal.title" +msgstr "TODO: Learn more about contactless cards" + msgid "eligibility.pages.start.mst_courtesy_card.start_item.heading" msgstr "Su número actual de Tarjeta de Cortesía" @@ -390,9 +392,6 @@ msgctxt "image alt text" msgid "core.icons.idcardcheck" msgstr "Icono de tarjeta de identificación con marca de verificación" -msgid "eligibility.pages.start.modal.title" -msgstr "TODO: Learn more about contactless cards" - msgid "eligibility.pages.start.modal.p[0]" msgstr "" "TODO: Benefits only works with contactless debit or credit cards. We do not " @@ -415,9 +414,6 @@ msgstr "" "[agency]'s application process. For updates on additional options, please " "check back on this website, or contact [short name]." -msgid "eligibility.pages.start.sub_headline" -msgstr "Necesitará algunos artículos para conectar su beneficio:" - msgid "eligibility.pages.index.senior.help.headline" msgstr "TODO: Learn more about" @@ -505,8 +501,8 @@ msgstr "" "TODO: This option is for people who have served in the active military, " "naval, or air service, and who were discharged or released therefrom under " "conditions other than dishonorable. You will need to verify your identity through VA.gov" +"gov/resources/verifying-your-identity-on-vagov/' target=\"_blank\" rel=" +"\"noopener noreferrer\">verify your identity through VA.gov" msgid "eligibility.pages.index.intro.mst" msgstr "" From 6503e205529d3753a6225f3e4eb4ab52d6c470d3 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 19 Jul 2023 20:34:12 +0000 Subject: [PATCH 05/18] fix(modal-contactless): add the contact info line --- .../includes/modal--contactless.html | 6 +++++- benefits/locale/en/LC_MESSAGES/django.po | 21 ++++++++++++++----- benefits/locale/es/LC_MESSAGES/django.po | 19 ++++++++++++----- 3 files changed, 35 insertions(+), 11 deletions(-) diff --git a/benefits/eligibility/templates/eligibility/includes/modal--contactless.html b/benefits/eligibility/templates/eligibility/includes/modal--contactless.html index eaf518b14..a111e9a6e 100644 --- a/benefits/eligibility/templates/eligibility/includes/modal--contactless.html +++ b/benefits/eligibility/templates/eligibility/includes/modal--contactless.html @@ -15,6 +15,10 @@

{% translate "eligibility.pages.start.modal.title" %} alt="{% translate "core.icons.contactless" context "image alt text" %}" />

{% translate "eligibility.pages.start.modal.p[3]" %}

-

{% translate "eligibility.pages.start.modal.p[4]" %}

+

+ {% blocktranslate with agency_short_name=agency.short_name %}eligibility.pages.start.modal.p[4.1]{{agency_short_name}}{% endblocktranslate %} + {% blocktranslate with agency_info_url=agency.info_url %}eligibility.pages.start.modal.p[4.2]{{agency_info_url}}{% endblocktranslate %} + {% blocktranslate with agency_short_name=agency.short_name %}eligibility.pages.start.modal.p[4.3]{{agency_short_name}}{% endblocktranslate %} +

{% endblock modal-content %} diff --git a/benefits/locale/en/LC_MESSAGES/django.po b/benefits/locale/en/LC_MESSAGES/django.po index 6cae9a387..498e36522 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: 2023-07-18 19:25+0000\n" +"POT-Creation-Date: 2023-07-19 19:11+0000\n" "Language: English\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -397,11 +397,22 @@ msgstr "" "debit cards, such as the Cash App Visa debit card or the Venmo Mastercard " "debit card." -msgid "eligibility.pages.start.modal.p[4]" +#, python-format +msgid "eligibility.pages.start.modal.p[4.1]%(agency_short_name)s" +msgstr "" +"You can still get your transit benefit by going through your " +"%(agency_short_name)s application process. For updates on additional " +"options, please check back on this website, or contact " + +#, python-format +msgid "eligibility.pages.start.modal.p[4.2]%(agency_info_url)s" msgstr "" -"You can still get your transit benefit by going through your [agency]'s " -"application process. For updates on additional options, please check back on " -"this website, or contact [short name]." +"" + +#, python-format +msgid "eligibility.pages.start.modal.p[4.3]%(agency_short_name)s" +msgstr "%(agency_short_name)s." msgid "eligibility.pages.index.senior.help.headline" msgstr "Learn more about" diff --git a/benefits/locale/es/LC_MESSAGES/django.po b/benefits/locale/es/LC_MESSAGES/django.po index 95c4fc334..404062d8c 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: 2023-07-18 19:25+0000\n" +"POT-Creation-Date: 2023-07-19 20:22+0000\n" "Language: Español\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -408,11 +408,20 @@ msgstr "" "prepaid debit cards, such as the Cash App Visa debit card or the Venmo " "Mastercard debit card." -msgid "eligibility.pages.start.modal.p[4]" +#, fuzzy, python-format +#| msgid "eligibility.pages.start.modal.p[4.3]%(agency_short_name)s" +msgid "eligibility.pages.start.modal.p[4.1]%(agency_short_name)s" +msgstr "%(agency_short_name)s." + +#, python-format +msgid "eligibility.pages.start.modal.p[4.2]%(agency_info_url)s" msgstr "" -"TODO: You can still get your transit benefit by going through your " -"[agency]'s application process. For updates on additional options, please " -"check back on this website, or contact [short name]." +"" + +#, python-format +msgid "eligibility.pages.start.modal.p[4.3]%(agency_short_name)s" +msgstr "%(agency_short_name)s." msgid "eligibility.pages.index.senior.help.headline" msgstr "TODO: Learn more about" From 958008af008dd7bf568b09a162275b4f85597ba3 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 19 Jul 2023 21:42:19 +0000 Subject: [PATCH 06/18] fix(elig-start): remove extra white space --- .../includes/media-item--idcardcheck--start--senior.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html index 4a62a45f8..47a01baf9 100644 --- a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html +++ b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html @@ -10,10 +10,10 @@

{% translate "eligibility.pages.start.senior.start_item.details" %} - - + {% translate "eligibility.pages.start.senior.help.link_text" as trigger_text %} + + {% include "core/includes/modal-trigger.html" with id="identity-verification-help" classes="modal-trigger--link" text=trigger_text %} +

{% translate "eligibility.pages.start.senior.start_item.secondary_details" %}

From b51cbf6106bcdcfe6be6839d07ddb77890e96877 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 19 Jul 2023 22:19:39 +0000 Subject: [PATCH 07/18] fix(elig-start): undo the underline span --- .../includes/media-item--idcardcheck--start--senior.html | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html index 47a01baf9..7997e3e76 100644 --- a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html +++ b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html @@ -11,9 +11,7 @@

{% translate "eligibility.pages.start.senior.start_item.details" %} {% translate "eligibility.pages.start.senior.help.link_text" as trigger_text %} - - {% include "core/includes/modal-trigger.html" with id="identity-verification-help" classes="modal-trigger--link" text=trigger_text %} - + {% include "core/includes/modal-trigger.html" with id="identity-verification-help" classes="modal-trigger--link" text=trigger_text %}

{% translate "eligibility.pages.start.senior.start_item.secondary_details" %}

From 955ce44a2532993a5aa17e33c6bd7cb8570d0a7a Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 19 Jul 2023 22:38:38 +0000 Subject: [PATCH 08/18] fix(modal-trigger): create Modal Trigger Link for inline-link modals --- benefits/core/templates/core/includes/modal-trigger-link.html | 2 ++ .../eligibility/includes/media-item--bankcardcheck--start.html | 2 +- .../includes/media-item--idcardcheck--start--senior.html | 2 +- 3 files changed, 4 insertions(+), 2 deletions(-) create mode 100644 benefits/core/templates/core/includes/modal-trigger-link.html diff --git a/benefits/core/templates/core/includes/modal-trigger-link.html b/benefits/core/templates/core/includes/modal-trigger-link.html new file mode 100644 index 000000000..df717fe9f --- /dev/null +++ b/benefits/core/templates/core/includes/modal-trigger-link.html @@ -0,0 +1,2 @@ + +{{ text }} diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html b/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html index be64647ff..b81d988ce 100644 --- a/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html +++ b/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html @@ -15,7 +15,7 @@

{% translate "eligibility.pages.start.bankcard.text" %} {% translate "eligibility.pages.start.modal.title" as trigger_text %} - {% include "core/includes/modal-trigger.html" with id="contactless-modal" classes="modal-trigger--link" text=trigger_text %} + {% include "core/includes/modal-trigger-link.html" with id="contactless-modal" classes="modal-trigger--link" text=trigger_text %}

diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html index 7997e3e76..efd283b59 100644 --- a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html +++ b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html @@ -11,7 +11,7 @@

{% translate "eligibility.pages.start.senior.start_item.details" %} {% translate "eligibility.pages.start.senior.help.link_text" as trigger_text %} - {% include "core/includes/modal-trigger.html" with id="identity-verification-help" classes="modal-trigger--link" text=trigger_text %} + {% include "core/includes/modal-trigger-link.html" with id="identity-verification-help" classes="modal-trigger--link" text=trigger_text %}

{% translate "eligibility.pages.start.senior.start_item.secondary_details" %}

From 9e10616219b0ea73eda02332be3a59ac65f014a4 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 19 Jul 2023 22:40:28 +0000 Subject: [PATCH 09/18] refactor(enrollment-index): use Modal Trigger Link for LittlePay modal --- .../enrollment/includes/media-item--bankcardcheck--index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html b/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html index 1791cb11e..723173bf1 100644 --- a/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html +++ b/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html @@ -14,7 +14,7 @@

{% translate "enrollment.pages.index.link_card_item.p[0]s[0]" %} - {% include "core/includes/modal-trigger.html" with id="littlepay-modal" classes="modal-trigger--link" text="Littlepay" %} + {% include "core/includes/modal-trigger-link.html" with id="littlepay-modal" classes="modal-trigger--link" text="Littlepay" %} . {% translate "enrollment.pages.index.link_card_item.p[0]s[1]" %}

From d12b83e13f567d8c7f5d6e772dc8c15938044c60 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 19 Jul 2023 22:47:50 +0000 Subject: [PATCH 10/18] refactor(css): unnecessary declaration --- benefits/static/css/styles.css | 1 - 1 file changed, 1 deletion(-) diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index d26011d88..6777c6f62 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -724,7 +724,6 @@ a.card:focus-visible { background-image: url("/static/img/modal-trigger.svg"); background-size: contain; display: inline-block; - position: relative; width: 24px; height: 24px; margin-left: 2px; From 4226bbe4fe9d1e581b9e08bddb8615780eb7c270 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 19 Jul 2023 23:29:59 +0000 Subject: [PATCH 11/18] fix(modals): add Go back link on modals on mobile --- .../templates/eligibility/includes/modal--contactless.html | 5 ++++- .../templates/eligibility/includes/modal--senior-help.html | 4 ++++ .../eligibility/includes/modal--senior-start-help.html | 3 +++ 3 files changed, 11 insertions(+), 1 deletion(-) diff --git a/benefits/eligibility/templates/eligibility/includes/modal--contactless.html b/benefits/eligibility/templates/eligibility/includes/modal--contactless.html index a111e9a6e..4fb314756 100644 --- a/benefits/eligibility/templates/eligibility/includes/modal--contactless.html +++ b/benefits/eligibility/templates/eligibility/includes/modal--contactless.html @@ -15,10 +15,13 @@

{% translate "eligibility.pages.start.modal.title" %} alt="{% translate "core.icons.contactless" context "image alt text" %}" />

{% translate "eligibility.pages.start.modal.p[3]" %}

-

+

{% blocktranslate with agency_short_name=agency.short_name %}eligibility.pages.start.modal.p[4.1]{{agency_short_name}}{% endblocktranslate %} {% blocktranslate with agency_info_url=agency.info_url %}eligibility.pages.start.modal.p[4.2]{{agency_info_url}}{% endblocktranslate %} {% blocktranslate with agency_short_name=agency.short_name %}eligibility.pages.start.modal.p[4.3]{{agency_short_name}}{% endblocktranslate %}

+

+ Go back +

{% endblock modal-content %} diff --git a/benefits/eligibility/templates/eligibility/includes/modal--senior-help.html b/benefits/eligibility/templates/eligibility/includes/modal--senior-help.html index 55db39dd5..8bfe47fe6 100644 --- a/benefits/eligibility/templates/eligibility/includes/modal--senior-help.html +++ b/benefits/eligibility/templates/eligibility/includes/modal--senior-help.html @@ -14,4 +14,8 @@

{% translate "eligibility.pages.index.senior.he

{% translate "eligibility.pages.index.senior.help.p[1]" %}

{% translate "eligibility.pages.index.senior.help.p[2]" %}

+ +

+ Go back +

{% endblock modal-content %} diff --git a/benefits/eligibility/templates/eligibility/includes/modal--senior-start-help.html b/benefits/eligibility/templates/eligibility/includes/modal--senior-start-help.html index ea342df32..4b9f8f9a7 100644 --- a/benefits/eligibility/templates/eligibility/includes/modal--senior-start-help.html +++ b/benefits/eligibility/templates/eligibility/includes/modal--senior-start-help.html @@ -12,4 +12,7 @@

{% translate "eligibility.pages.start.senior.help.p[2]" %}

{% translate "eligibility.pages.start.senior.help.p[3]" %}

{% translate "eligibility.pages.start.senior.help.p[4]" %}

+

+ Go back +

{% endblock modal-content %} From 24843f1fc88e95719c16f9502654ac33dcfa6184 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Wed, 19 Jul 2023 23:35:18 +0000 Subject: [PATCH 12/18] fix(modal): add Go back to littlepay modal on mobile too --- .../templates/enrollment/includes/modal--littlepay.html | 3 +++ 1 file changed, 3 insertions(+) diff --git a/benefits/enrollment/templates/enrollment/includes/modal--littlepay.html b/benefits/enrollment/templates/enrollment/includes/modal--littlepay.html index 95d11af59..a1b682b0e 100644 --- a/benefits/enrollment/templates/enrollment/includes/modal--littlepay.html +++ b/benefits/enrollment/templates/enrollment/includes/modal--littlepay.html @@ -7,5 +7,8 @@

{% translate "enrollment.pages.index.modal.title" %}

{% translate "enrollment.pages.index.modal.p[0]" %}

{% translate "enrollment.pages.index.modal.p[1]" %}

+

+ Go back +

{% endblock modal-content %} From 00fa20fe445b3625ff37af7ff99c1267404a7ede Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Thu, 20 Jul 2023 18:43:18 +0000 Subject: [PATCH 13/18] refactor: remove unnecessary css --- benefits/static/css/styles.css | 13 ------------- 1 file changed, 13 deletions(-) diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index 6777c6f62..ddb8e4bca 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -706,19 +706,6 @@ a.card:focus-visible { font-size: var(--modal-title-font-size); } -.modal-trigger--link { - background: transparent; - border: none; - color: var(--primary-color); - font-family: var(--bs-body-font-family); - font-weight: var(--bold-font-weight); - letter-spacing: var(--body-letter-spacing); - padding: 0; - margin-right: -5px; - text-decoration: underline; - text-decoration-style: solid; -} - .modal-trigger--link::after { content: " "; background-image: url("/static/img/modal-trigger.svg"); From 3bc0e2097516c8b6108e1ccaa9eb91ccdc03f184 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Thu, 20 Jul 2023 19:01:43 +0000 Subject: [PATCH 14/18] refactor(modal): add Go back modal link text to Django.po files --- .../eligibility/includes/modal--contactless.html | 2 +- .../eligibility/includes/modal--senior-help.html | 2 +- .../includes/modal--senior-start-help.html | 2 +- .../enrollment/includes/modal--littlepay.html | 2 +- benefits/locale/en/LC_MESSAGES/django.po | 7 +++++-- benefits/locale/es/LC_MESSAGES/django.po | 15 ++++++++++----- 6 files changed, 19 insertions(+), 11 deletions(-) diff --git a/benefits/eligibility/templates/eligibility/includes/modal--contactless.html b/benefits/eligibility/templates/eligibility/includes/modal--contactless.html index 4fb314756..4af3cb99b 100644 --- a/benefits/eligibility/templates/eligibility/includes/modal--contactless.html +++ b/benefits/eligibility/templates/eligibility/includes/modal--contactless.html @@ -21,7 +21,7 @@

{% translate "eligibility.pages.start.modal.title" %} {% blocktranslate with agency_short_name=agency.short_name %}eligibility.pages.start.modal.p[4.3]{{agency_short_name}}{% endblocktranslate %}

- Go back + {% translate "core.modals.back" %}

{% endblock modal-content %} diff --git a/benefits/eligibility/templates/eligibility/includes/modal--senior-help.html b/benefits/eligibility/templates/eligibility/includes/modal--senior-help.html index 8bfe47fe6..0a4098b4a 100644 --- a/benefits/eligibility/templates/eligibility/includes/modal--senior-help.html +++ b/benefits/eligibility/templates/eligibility/includes/modal--senior-help.html @@ -16,6 +16,6 @@

{% translate "eligibility.pages.index.senior.he

{% translate "eligibility.pages.index.senior.help.p[2]" %}

- Go back + {% translate "core.modals.back" %}

{% endblock modal-content %} diff --git a/benefits/eligibility/templates/eligibility/includes/modal--senior-start-help.html b/benefits/eligibility/templates/eligibility/includes/modal--senior-start-help.html index 4b9f8f9a7..614989398 100644 --- a/benefits/eligibility/templates/eligibility/includes/modal--senior-start-help.html +++ b/benefits/eligibility/templates/eligibility/includes/modal--senior-start-help.html @@ -13,6 +13,6 @@

{% translate "eligibility.pages.start.senior.help.p[3]" %}

{% translate "eligibility.pages.start.senior.help.p[4]" %}

- Go back + {% translate "core.modals.back" %}

{% endblock modal-content %} diff --git a/benefits/enrollment/templates/enrollment/includes/modal--littlepay.html b/benefits/enrollment/templates/enrollment/includes/modal--littlepay.html index a1b682b0e..12ab45fcb 100644 --- a/benefits/enrollment/templates/enrollment/includes/modal--littlepay.html +++ b/benefits/enrollment/templates/enrollment/includes/modal--littlepay.html @@ -8,7 +8,7 @@

{% translate "enrollment.pages.index.modal.title" %}{% translate "enrollment.pages.index.modal.p[0]" %}

{% translate "enrollment.pages.index.modal.p[1]" %}

- Go back + {% translate "core.modals.back" %}

{% endblock modal-content %} diff --git a/benefits/locale/en/LC_MESSAGES/django.po b/benefits/locale/en/LC_MESSAGES/django.po index 498e36522..ef8e42a46 100644 --- a/benefits/locale/en/LC_MESSAGES/django.po +++ b/benefits/locale/en/LC_MESSAGES/django.po @@ -5,8 +5,8 @@ #, fuzzy msgid "" msgstr "" -"Report-Msgid-Bugs-To: https://github.com/cal-itp/benefits/issues \n" -"POT-Creation-Date: 2023-07-19 19:11+0000\n" +"Report-Msgid-Bugs-To: \n" +"POT-Creation-Date: 2023-07-20 18:48+0000\n" "Language: English\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -414,6 +414,9 @@ msgstr "" msgid "eligibility.pages.start.modal.p[4.3]%(agency_short_name)s" msgstr "%(agency_short_name)s." +msgid "core.modals.back" +msgstr "Go back" + msgid "eligibility.pages.index.senior.help.headline" msgstr "Learn more about" diff --git a/benefits/locale/es/LC_MESSAGES/django.po b/benefits/locale/es/LC_MESSAGES/django.po index 404062d8c..3eee8406c 100644 --- a/benefits/locale/es/LC_MESSAGES/django.po +++ b/benefits/locale/es/LC_MESSAGES/django.po @@ -5,8 +5,8 @@ #, fuzzy msgid "" msgstr "" -"Report-Msgid-Bugs-To: https://github.com/cal-itp/benefits/issues \n" -"POT-Creation-Date: 2023-07-19 20:22+0000\n" +"Report-Msgid-Bugs-To: \n" +"POT-Creation-Date: 2023-07-20 18:48+0000\n" "Language: Español\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=UTF-8\n" @@ -408,10 +408,12 @@ msgstr "" "prepaid debit cards, such as the Cash App Visa debit card or the Venmo " "Mastercard debit card." -#, fuzzy, python-format -#| msgid "eligibility.pages.start.modal.p[4.3]%(agency_short_name)s" +#, python-format msgid "eligibility.pages.start.modal.p[4.1]%(agency_short_name)s" -msgstr "%(agency_short_name)s." +msgstr "" +"TODO: You can still get your transit benefit by going through your " +"%(agency_short_name)s application process. For updates on additional " +"options, please check back on this website, or contact " #, python-format msgid "eligibility.pages.start.modal.p[4.2]%(agency_info_url)s" @@ -423,6 +425,9 @@ msgstr "" msgid "eligibility.pages.start.modal.p[4.3]%(agency_short_name)s" msgstr "%(agency_short_name)s." +msgid "core.modals.back" +msgstr "TODO: Regresar a la página principal" + msgid "eligibility.pages.index.senior.help.headline" msgstr "TODO: Learn more about" From f9ddec6505f397df9c96c9b5a3dab17f669886dd Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Thu, 20 Jul 2023 19:04:35 +0000 Subject: [PATCH 15/18] fix(eligibility-start): use bootstrap classes to remove button default styles --- .../templates/eligibility/includes/selection-label--senior.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html b/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html index 59149f313..a1d71aa98 100644 --- a/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html +++ b/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html @@ -9,7 +9,7 @@ {% translate "eligibility.pages.index.senior.description" %} - From 04bb6449db2d7dd6b6f7e54f888ad4c2f305fc06 Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Thu, 20 Jul 2023 19:33:34 +0000 Subject: [PATCH 16/18] refactor(css): refactor modal trigger link css selector to better reflect style logic --- .../includes/media-item--bankcardcheck--start.html | 2 +- .../media-item--idcardcheck--start--senior.html | 2 +- .../includes/selection-label--senior.html | 2 +- .../includes/media-item--bankcardcheck--index.html | 2 +- benefits/static/css/styles.css | 13 ++++++++----- 5 files changed, 12 insertions(+), 9 deletions(-) diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html b/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html index b81d988ce..88395ada6 100644 --- a/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html +++ b/benefits/eligibility/templates/eligibility/includes/media-item--bankcardcheck--start.html @@ -15,7 +15,7 @@

{% translate "eligibility.pages.start.bankcard.text" %} {% translate "eligibility.pages.start.modal.title" as trigger_text %} - {% include "core/includes/modal-trigger-link.html" with id="contactless-modal" classes="modal-trigger--link" text=trigger_text %} + {% include "core/includes/modal-trigger-link.html" with id="contactless-modal" text=trigger_text %}

diff --git a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html index efd283b59..59a5b95c0 100644 --- a/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html +++ b/benefits/eligibility/templates/eligibility/includes/media-item--idcardcheck--start--senior.html @@ -11,7 +11,7 @@

{% translate "eligibility.pages.start.senior.start_item.details" %} {% translate "eligibility.pages.start.senior.help.link_text" as trigger_text %} - {% include "core/includes/modal-trigger-link.html" with id="identity-verification-help" classes="modal-trigger--link" text=trigger_text %} + {% include "core/includes/modal-trigger-link.html" with id="identity-verification-help" text=trigger_text %}

{% translate "eligibility.pages.start.senior.start_item.secondary_details" %}

diff --git a/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html b/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html index a1d71aa98..4bb28e688 100644 --- a/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html +++ b/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html @@ -9,7 +9,7 @@ {% translate "eligibility.pages.index.senior.description" %} - diff --git a/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html b/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html index 723173bf1..2403921cb 100644 --- a/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html +++ b/benefits/enrollment/templates/enrollment/includes/media-item--bankcardcheck--index.html @@ -14,7 +14,7 @@

{% translate "enrollment.pages.index.link_card_item.p[0]s[0]" %} - {% include "core/includes/modal-trigger-link.html" with id="littlepay-modal" classes="modal-trigger--link" text="Littlepay" %} + {% include "core/includes/modal-trigger-link.html" with id="littlepay-modal" text="Littlepay" %} . {% translate "enrollment.pages.index.link_card_item.p[0]s[1]" %}

diff --git a/benefits/static/css/styles.css b/benefits/static/css/styles.css index ddb8e4bca..8cd743c15 100644 --- a/benefits/static/css/styles.css +++ b/benefits/static/css/styles.css @@ -132,8 +132,7 @@ a:not(.btn) { font-weight: var(--bold-font-weight); } -a:hover:not(.btn), -.modal-trigger--link:hover { +a:hover:not(.btn) { color: var(--hover-color); text-decoration: underline; } @@ -706,7 +705,11 @@ a.card:focus-visible { font-size: var(--modal-title-font-size); } -.modal-trigger--link::after { +/* Modal Trigger */ +/* All links/image buttons that open modals have a question mark icon after them */ +/* Buttons that open modals (like the Agency Selector) do not have the icon */ + +[data-bs-toggle="modal"]:not(.btn)::after { content: " "; background-image: url("/static/img/modal-trigger.svg"); background-size: contain; @@ -717,11 +720,11 @@ a.card:focus-visible { vertical-align: text-bottom; } -.modal-trigger--link:hover::after { +[data-bs-toggle="modal"]:not(.btn):hover::after { background-image: url("/static/img/modal-trigger--hover.svg"); } -.modal-trigger--link:visited::after { +[data-bs-toggle="modal"]:not(.btn):visited::after { background-image: url("/static/img/modal-trigger--selected.svg"); } From 0ff5504bae0240f58ac299fd4c546bd6e1f8dfcb Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Thu, 20 Jul 2023 19:42:51 +0000 Subject: [PATCH 17/18] fix(css): p-0 not padding-0 --- .../templates/eligibility/includes/selection-label--senior.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html b/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html index 4bb28e688..fef7484cb 100644 --- a/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html +++ b/benefits/eligibility/templates/eligibility/includes/selection-label--senior.html @@ -9,7 +9,7 @@ {% translate "eligibility.pages.index.senior.description" %} - From 9aa49b00708853179da3719364c3e6aedeca570b Mon Sep 17 00:00:00 2001 From: Machiko Yasuda Date: Thu, 20 Jul 2023 21:52:01 +0000 Subject: [PATCH 18/18] chore: add back gh issue link --- benefits/locale/en/LC_MESSAGES/django.po | 2 +- benefits/locale/es/LC_MESSAGES/django.po | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/benefits/locale/en/LC_MESSAGES/django.po b/benefits/locale/en/LC_MESSAGES/django.po index ef8e42a46..49c7db7cd 100644 --- a/benefits/locale/en/LC_MESSAGES/django.po +++ b/benefits/locale/en/LC_MESSAGES/django.po @@ -5,7 +5,7 @@ #, fuzzy msgid "" msgstr "" -"Report-Msgid-Bugs-To: \n" +"Report-Msgid-Bugs-To: https://github.com/cal-itp/benefits/issues \n" "POT-Creation-Date: 2023-07-20 18:48+0000\n" "Language: English\n" "MIME-Version: 1.0\n" diff --git a/benefits/locale/es/LC_MESSAGES/django.po b/benefits/locale/es/LC_MESSAGES/django.po index 3eee8406c..0320ec753 100644 --- a/benefits/locale/es/LC_MESSAGES/django.po +++ b/benefits/locale/es/LC_MESSAGES/django.po @@ -5,7 +5,7 @@ #, fuzzy msgid "" msgstr "" -"Report-Msgid-Bugs-To: \n" +"Report-Msgid-Bugs-To: https://github.com/cal-itp/benefits/issues \n" "POT-Creation-Date: 2023-07-20 18:48+0000\n" "Language: Español\n" "MIME-Version: 1.0\n"