[taler-merchant-backoffice] branch master updated (f0767d9 -> cfea4bc)

[gnunet]

This is an automated email from the git hooks/post-receive script.

grothoff pushed a change to branch master
in repository merchant-backoffice.

    from f0767d9  -more work on styling
     new 9988ca1  associate labels with inputs (fixes #7388)
     new cfea4bc  alt tag for r logo

The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 packages/bank/src/pages/home/index.tsx | 51 +++++++++++++++++++++++-----------
 1 file changed, 35 insertions(+), 16 deletions(-)

diff --git a/packages/bank/src/pages/home/index.tsx 
b/packages/bank/src/pages/home/index.tsx
index e4b633d..f2e0d0c 100644
--- a/packages/bank/src/pages/home/index.tsx
+++ b/packages/bank/src/pages/home/index.tsx
@@ -872,7 +872,7 @@ function BankFrame(Props: any): VNode {
   return (
     <Fragment>
       <header class="demobar" style="display: flex; flex-direction: row; 
justify-content: space-between;">
-        <a href="#main" class="skip">Skip to main content</a>
+        <a href="#main" class="skip">{i18n`Skip to main content`}</a>
         <div style="max-width: 50em; margin-left: 2em;">
           <h1>
             <span class="it">
@@ -894,6 +894,7 @@ function BankFrame(Props: any): VNode {
         <a href="https://taler.net/";>
           <img
             src={talerLogo}
+            alt="{i18n`Taler logo`}"
             height="100"
             width="224"
             style="margin: 2em 2em" />
@@ -935,7 +936,6 @@ function PaytoWireTransfer(Props: any): VNode {
   const i18n = useTranslator();
   const amountRegex = '^[0-9]+(\.[0-9]+)?$';
   const ibanRegex = '^[A-Z][A-Z][0-9]+$';
-  const amountInput = '5.00';
   const receiverInput = '';
   const subjectInput = '';
   let transactionData: TransactionRequestType;
@@ -952,10 +952,12 @@ function PaytoWireTransfer(Props: any): VNode {
         <div class="pure-form"
              name="wire-transfer-form">
           <p>
-          {i18n`Receiver IBAN:`}&nbsp;
+          <label for="iban">{i18n`Receiver IBAN:`}</label>&nbsp;
           <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:`}&nbsp;
+          <label for="subject">{i18n`Transfer subject:`}</label>&nbsp;
           <input
             type="text"
+            name="subject"
+            id="subject"
             placeholder="subject"
             required
             onInput={(e): void => {
@@ -976,12 +980,13 @@ function PaytoWireTransfer(Props: any): VNode {
                 subject: e.currentTarget.value,
               }))
             }} /><br /><br />
-          {i18n`Amount:`}&nbsp;
+          <label for="amount">{i18n`Amount:`}</label>&nbsp;
           <input
             type="text"
+            name="amount"
+            id="amount"
             placeholder="amount"
             required
-            value={amountInput}
             pattern={amountRegex}
             onInput={(e): void => {
               submitDataSetter((submitData: any) => ({
@@ -1050,9 +1055,11 @@ function PaytoWireTransfer(Props: any): VNode {
       <div class="pure-form"
            name="payto-form">
         <p>
-        {i18n`payto URI:`}&nbsp;
-        <input name="address"
+        <label for="address">{i18n`payto URI:`}</label>&nbsp;
+        <input
+          name="address"
           size={90}
+          id="address"
           value={rawPaytoInput}
           required
           placeholder={i18n`payto address`}
@@ -1119,8 +1126,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> 
?&nbsp;</label>
+      <label for="answer">What is <em>{captchaNumbers.a} + 
{captchaNumbers.b}</em> ?&nbsp;</label>
       <input
+        name="answer"
+        id="answer"
         type="text"
         required
         onInput={(e): void => {
@@ -1282,10 +1291,10 @@ function WalletWithdraw(Props: any): VNode {
           class="pure-form"
           name="tform">
           <p>
-          {i18n`Amount to withdraw:`}&nbsp;
+          <label for="withdraw-amount">{i18n`Amount to 
withdraw:`}</label>&nbsp;
           <input
             type="text"
-            id="reserve-amount"
+            id="withdraw-amount"
             name="withdraw-amount"
             value={submitAmount}
             pattern={amountRegex}
@@ -1401,9 +1410,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 +1425,11 @@ function LoginForm(Props: any): VNode {
           }))
         }}
       />
-      <p class="passFieldLabel loginFieldLabel 
formFieldLabel">{i18n`Password:`}</p>
+      <p class="passFieldLabel loginFieldLabel formFieldLabel"><label 
for="password">{i18n`Password:`}</label></p>
       <input
         type="password"
+        name="password"
+        id="password"
         value={submitData && submitData.password}
         placeholder="Password"
         required
@@ -1477,8 +1490,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 +1506,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 +1523,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.