[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
[taler-merchant-backoffice] 01/02: associate labels with inputs (fixes #
From: |
gnunet |
Subject: |
[taler-merchant-backoffice] 01/02: associate labels with inputs (fixes #7388) |
Date: |
Tue, 18 Oct 2022 18:17:35 +0200 |
This is an automated email from the git hooks/post-receive script.
grothoff pushed a commit to branch master
in repository merchant-backoffice.
commit 9988ca1c3e4fd4a5a2c9ce8abd28131e5b0c1a23
Author: Christian Grothoff <christian@grothoff.org>
AuthorDate: Tue Oct 18 16:54:04 2022 +0200
associate labels with inputs (fixes #7388)
---
packages/bank/src/pages/home/index.tsx | 46 ++++++++++++++++++++++++----------
1 file changed, 33 insertions(+), 13 deletions(-)
diff --git a/packages/bank/src/pages/home/index.tsx
b/packages/bank/src/pages/home/index.tsx
index e4b633d..844069c 100644
--- a/packages/bank/src/pages/home/index.tsx
+++ b/packages/bank/src/pages/home/index.tsx
@@ -952,10 +952,12 @@ function PaytoWireTransfer(Props: any): VNode {
<div class="pure-form"
name="wire-transfer-form">
<p>
- {i18n`Receiver IBAN:`}
+ <label for="iban">{i18n`Receiver IBAN:`}</label>
<input
ref={focusInput}
type="text"
+ id="iban"
+ name="iban"
placeholder="CC0123456789"
required
pattern={ibanRegex}
@@ -965,9 +967,11 @@ function PaytoWireTransfer(Props: any): VNode {
iban: e.currentTarget.value,
}))
}} /><br /><br />
- {i18n`Transfer subject:`}
+ <label for="subject">{i18n`Transfer subject:`}</label>
<input
type="text"
+ name="subject"
+ id="subject"
placeholder="subject"
required
onInput={(e): void => {
@@ -976,9 +980,11 @@ function PaytoWireTransfer(Props: any): VNode {
subject: e.currentTarget.value,
}))
}} /><br /><br />
- {i18n`Amount:`}
+ <label for="amount">{i18n`Amount:`}</label>
<input
type="text"
+ name="amount"
+ id="amount"
placeholder="amount"
required
value={amountInput}
@@ -1050,9 +1056,11 @@ function PaytoWireTransfer(Props: any): VNode {
<div class="pure-form"
name="payto-form">
<p>
- {i18n`payto URI:`}
- <input name="address"
+ <label for="address">{i18n`payto URI:`}</label>
+ <input
+ name="address"
size={90}
+ id="address"
value={rawPaytoInput}
required
placeholder={i18n`payto address`}
@@ -1119,8 +1127,10 @@ function TalerWithdrawalConfirmationQuestion(Props:
any): VNode {
Please, authorize this operation by answering the following question.
</Translate></p>
<div>
- <label>What is <em>{captchaNumbers.a} + {captchaNumbers.b}</em>
? </label>
+ <label for="answer">What is <em>{captchaNumbers.a} +
{captchaNumbers.b}</em> ? </label>
<input
+ name="answer"
+ id="answer"
type="text"
required
onInput={(e): void => {
@@ -1282,10 +1292,10 @@ function WalletWithdraw(Props: any): VNode {
class="pure-form"
name="tform">
<p>
- {i18n`Amount to withdraw:`}
+ <label for="withdraw-amount">{i18n`Amount to
withdraw:`}</label>
<input
type="text"
- id="reserve-amount"
+ id="withdraw-amount"
name="withdraw-amount"
value={submitAmount}
pattern={amountRegex}
@@ -1401,9 +1411,11 @@ function LoginForm(Props: any): VNode {
<form action="javascript:void(0);" class="login-form">
<div class="pure-form">
<h2>{i18n`Please login!`}</h2>
- <p class="unameFieldLabel loginFieldLabel
formFieldLabel">{i18n`Username:`}</p>
+ <p class="unameFieldLabel loginFieldLabel formFieldLabel"><label
for="username">{i18n`Username:`}</label></p>
<input
type="text"
+ name="username"
+ id="username"
value={submitData && submitData.username}
placeholder="Username"
required
@@ -1414,9 +1426,11 @@ function LoginForm(Props: any): VNode {
}))
}}
/>
- <p class="passFieldLabel loginFieldLabel
formFieldLabel">{i18n`Password:`}</p>
+ <p class="passFieldLabel loginFieldLabel formFieldLabel"><label
for="password">{i18n`Password:`}</a></p>
<input
type="password"
+ name="password"
+ id="password"
value={submitData && submitData.password}
placeholder="Password"
required
@@ -1477,8 +1491,10 @@ function RegistrationForm(Props: any): VNode {
<form action="javascript:void(0);" class="register-form">
<div class="pure-form">
<h2>{i18n`Please register!`}</h2>
- <p class="unameFieldLabel registerFieldLabel
formFieldLabel">{i18n`Username:`}</p>
+ <p class="unameFieldLabel registerFieldLabel
formFieldLabel"><label for="register-un">{i18n`Username:`}</label></p>
<input
+ id="register-un"
+ name="register-un"
type="text"
placeholder="Username"
value={submitData && submitData.username}
@@ -1491,9 +1507,11 @@ function RegistrationForm(Props: any): VNode {
}))
}} />
<br />
- <p class="unameFieldLabel registerFieldLabel
formFieldLabel">{i18n`Password:`}</p>
+ <p class="unameFieldLabel registerFieldLabel
formFieldLabel"><label for="register-pw">{i18n`Password:`}</label></p>
<input
type="password"
+ name="register-pw"
+ id="register-pw"
placeholder="Password"
value={submitData && submitData.password}
required
@@ -1506,9 +1524,11 @@ function RegistrationForm(Props: any): VNode {
}} />
<br />
{/*
- {i18n`Phone number:`}
+ <label for="phone">{i18n`Phone number:`}</label>
// FIXME: add input validation (must start with +, otherwise
only numbers)
<input
+ name="phone"
+ id="phone"
type="phone"
placeholder="+CC-123456789"
value={submitData && submitData.phone}
--
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.