diff --git a/src/components/Checkout/PaymentMethod.svelte b/src/components/Checkout/PaymentMethod.svelte index 0a563d13..bbc6d93a 100644 --- a/src/components/Checkout/PaymentMethod.svelte +++ b/src/components/Checkout/PaymentMethod.svelte @@ -1,30 +1,65 @@ - Ind铆canos tus datos de pago - Ahora necesitamos que nos digas c贸mo quieres pagar. - Selecciona m茅todo de pago: + + + {$t("payment.page.selectMethod")} + - - {#each paymentGateways as gateway} - - - {(gateway.name ?? "").charAt(0).toUpperCase() + - (gateway.name ?? "").slice(1)} - - {/each} + + + {#each paymentGateways as gateway} + + + + + + {gateway.name} + + + + + {#if gateway.name === "paypal"} + + {:else if gateway.name === "stripe"} + + {:else if gateway.name === "wallet"} + + {/if} + + + {/each} + + + + Enviar + + diff --git a/src/components/LoginForm.astro b/src/components/LoginForm.astro index 18e056ec..ad6466c6 100644 --- a/src/components/LoginForm.astro +++ b/src/components/LoginForm.astro @@ -40,6 +40,7 @@ const { t } = Astro.locals; + - - Tipo de usuario - - - {t("register.form.userType.individual")} + + + + {t("register.form.userType.individual")} - - - {t("register.form.userType.organization")} + + + + {t("register.form.userType.organization")} + + + + + {t("register.individual.firstName")} + + + + + + + {t("register.individual.lastName")} + + + + - - - - {t("register.individual.firstName")} - + + {t("register.form.validation.password.minLength")} - - - - {t("register.individual.lastName")} - - + + + + + {t("register.individual.taxId.msgDeduction")} + + - - - - {t("register.individual.taxId")} - + + + + {t("register.individual.taxId.label")} + + @@ -144,6 +175,30 @@ const { t } = Astro.locals; + + + + + {t("register.form.termsCheckbox")} + + + + + + {t("register.form.policiesCheckbox")} + + + + + { radio.addEventListener("change", toggleFields); }); + + const toggleDni = document.getElementById("toggle-dni"); + + if (toggleDni) { + toggleDni.addEventListener("change", function () { + const dniInput = document.getElementById("dni") as HTMLInputElement; + const labelInput = document.querySelector('label[for="dni"]'); + + if (dniInput && labelInput) { + const isChecked = (this as HTMLInputElement).checked; + dniInput.disabled = !isChecked; + + dniInput.classList.remove("border-[#e6e6e6]", "focus:ring-transparent"); + + if (isChecked) { + dniInput.classList.add("border-[#855a96]", "focus:ring-[#855a96]"); + dniInput.classList.remove("cursor-not-allowed"); + labelInput.classList.remove("cursor-not-allowed"); + } + } + }); + + toggleDni.dispatchEvent(new Event("change")); + } }); diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index a2ea1f3b..96918fbb 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -97,6 +97,9 @@ "zod": { "taxId.custom": "Tax ID must be at least 8 characters long", "legalName.custom": "Legal name is required for organizations" + }, + "password": { + "minLength": "*Requisitos de la contrase帽a: debe tener 8 caracteres" } }, "individual": { diff --git a/src/i18n/locales/es.json b/src/i18n/locales/es.json index 52aaf3d7..d6b10194 100644 --- a/src/i18n/locales/es.json +++ b/src/i18n/locales/es.json @@ -98,6 +98,11 @@ "zod": { "taxId.custom": "El CIF/DNI debe tener al menos 8 caracteres", "legalName.custom": "La raz贸n social es obligatoria para empresas" + }, + "validation": { + "password": { + "minLength": "*Requisitos de la contrase帽a: debe tener 8 caracteres" + } } }, "individual": { @@ -106,7 +111,10 @@ "email": "Correo electr贸nico", "password": "Contrase帽a", "taxIdCheckbox": "Deseo desgravar esta donaci贸n. Es necesario indicar el n煤mero de DNI para comunic谩rselo a Hacienda.", - "taxId": "DNI*" + "taxId": { + "label": "DNI*", + "msgDeduction": "Deseo desgravar esta donaci贸n. Es necesario indicar el n煤mero de DNI para comunic谩rselo a Hacienda." + } }, "organization": { "legalName": "Raz贸n social", @@ -229,5 +237,12 @@ "btnContinue": { "label": "Continuar" } + }, + "payment": { + "page": { + "title": "Ind铆canos tus datos de pago", + "description": "Ahora necesitamos que nos digas c贸mo quieres pagar.", + "selectMethod": "Selecciona m茅todo de pago:" + } } } diff --git a/src/pages/[lang]/payment.astro b/src/pages/[lang]/payment.astro index 001cbd56..baf720cd 100644 --- a/src/pages/[lang]/payment.astro +++ b/src/pages/[lang]/payment.astro @@ -11,9 +11,37 @@ const { t } = Astro.locals; - payment page - - - + + + + + + + {t("payment.page.title")} + + + {t("payment.page.description")} + + + + + + + + + + + + {t("checkout.summary.deduct")} + + Continuar + + + + diff --git a/src/pages/[lang]/register.astro b/src/pages/[lang]/register.astro index 5195a11b..e0d9edf9 100644 --- a/src/pages/[lang]/register.astro +++ b/src/pages/[lang]/register.astro @@ -19,27 +19,28 @@ const { t } = Astro.locals; {t("register.page.title")} {t("register.page.description")} - - - - - {t("register.page.registerOr")} - - {t("register.page.loginBtnLabel")} - - - - - {t("register.page.goteoUserInfo")} + - - - {t("login.page.otherAccessMethods")} - + + + + + {t("register.page.registerOr")} + + {t("register.page.loginBtnLabel")} + + + {t("register.page.goteoUserInfo")} + + + + + {t("login.page.otherAccessMethods")} + diff --git a/src/svgs/CreditCardIcon.svelte b/src/svgs/CreditCardIcon.svelte new file mode 100644 index 00000000..772b18de --- /dev/null +++ b/src/svgs/CreditCardIcon.svelte @@ -0,0 +1,7 @@ + + + diff --git a/src/svgs/PaypalIcon.svelte b/src/svgs/PaypalIcon.svelte new file mode 100644 index 00000000..e1889a5c --- /dev/null +++ b/src/svgs/PaypalIcon.svelte @@ -0,0 +1,11 @@ + + + + + diff --git a/src/svgs/StripeIcon.svelte b/src/svgs/StripeIcon.svelte new file mode 100644 index 00000000..5bd7fe32 --- /dev/null +++ b/src/svgs/StripeIcon.svelte @@ -0,0 +1,40 @@ + + + + + + + + + + + + + + + +
Ahora necesitamos que nos digas c贸mo quieres pagar.
Selecciona m茅todo de pago:
+ {$t("payment.page.selectMethod")} +
+ {t("payment.page.description")} +
{t("checkout.summary.deduct")}
{t("register.page.description")}
{t("register.page.goteoUserInfo")}
{t("login.page.otherAccessMethods")}