Show passphrase input label (#6992)

res/css/views/dialogs/security/_AccessSecretStorageDialog.scss

@@ -70,7 +70,6 @@ limitations under the License.
     width: 300px;
     border: 1px solid $accent-color;
     border-radius: 5px;
-    padding: 10px;
 }
 
 .mx_AccessSecretStorageDialog_recoveryKeyEntry {

src/components/views/dialogs/security/AccessSecretStorageDialog.tsx

@@ -346,15 +346,15 @@ export default class AccessSecretStorageDialog extends React.PureComponent<IProp
                 ) }</p>
 
                 <form className="mx_AccessSecretStorageDialog_primaryContainer" onSubmit={this.onPassPhraseNext}>
-                    <input
+                    <Field
-                        type="password"
                         id="mx_passPhraseInput"
                         className="mx_AccessSecretStorageDialog_passPhraseInput"
-                        onChange={this.onPassPhraseChange}
+                        type="password"
+                        label={_t("Security Phrase")}
                         value={this.state.passPhrase}
+                        onChange={this.onPassPhraseChange}
                         autoFocus={true}
                         autoComplete="new-password"
-                        placeholder={_t("Security Phrase")}
                     />
                     { keyStatus }
                     <DialogButtons