Fix: bartificer#57 move description of # of pws & added aria info

form-text above read properly for screen readers but messed up vertical alignment of Generate button. Improve by adding aria-describedby for screen readers

Author: podfeet

src/index.html

@@ -272,14 +272,14 @@ <h3>Generate Password(s)</h3>
             <form id="generatePasswords"> <!-- open input area for gen pw -->
               <div class="row">
                 <div class="col-8 col-md-6 mb-3">
-                  <div class="form-text">Enter the number of passwords to be generated</div>
                   <!-- Technically the label should be there but it's an audible repeat of span class -->
                   <!-- <label class="visually-hidden" for="selectAmount">Number of passwords</label> -->
                   <div class="input-group mt-2">
                     <span class="input-group-text"># of passwords</span>
                     <input type="number" min="1" max="10" step="1" value="3" class="form-control" name="selectAmount"
-                      id="selectAmount" />
+                      id="selectAmount" aria-describedby="enterNumberOfPasswords" />
                   </div>
+                  <div id="enterNumberOfPasswords" class="form-text">Enter the number of passwords to be generated</div>
                   <!-- doesn't show as stepper on iOS or Chromium -->
                 </div>
                 <div class="col-3 "> <!-- open col for Generate -->