change input placeholders to labels (#1575)

* change input placeholders to labels

* use back button on 'show mnemonic' modal

nym-wallet/src/components/Accounts/modals/AddAccountModal.tsx

@@ -115,7 +115,7 @@ const NameAccount = ({ onNext, onBack }: { onNext: (value: string) => void; onBa
           {error}
         </Typography>
         <TextField
-          placeholder="Account name"
+          label="Account name"
           value={value}
           onChange={(e) => {
             setValue(e.target.value);

nym-wallet/src/components/Accounts/modals/MnemonicModal.tsx

@@ -15,6 +15,7 @@ import { ArrowBackSharp } from '@mui/icons-material';
 import { AccountsContext } from 'src/context';
 import { useClipboard } from 'use-clipboard-copy';
 import { PasswordInput, Mnemonic } from 'src/components';
+import { StyledBackButton } from 'src/components/StyledBackButton';
 
 export const MnemonicModal = () => {
   const [password, setPassword] = useState('');
@@ -50,9 +51,6 @@ export const MnemonicModal = () => {
       <DialogTitle>
         <Box display="flex" justifyContent="space-between" alignItems="center">
           <Typography variant="h6">Display mnemonic</Typography>
-          <IconButton onClick={handleClose}>
-            <ArrowBackSharp />
-          </IconButton>
         </Box>
         <Typography variant="body1" sx={{ color: (theme) => theme.palette.text.disabled }}>
           {`Display mnemonic for: ${accountMnemonic?.accountName}`}
@@ -80,7 +78,8 @@ export const MnemonicModal = () => {
           )}
         </Box>
       </DialogContent>
-      <DialogActions sx={{ p: 3 }}>
+      <DialogActions sx={{ p: 3, gap: 2 }}>
+        <StyledBackButton onBack={handleClose} />
         {!accountMnemonic.value && (
           <Button
             disableRipple

nym-wallet/src/components/Send/SendInputModal.tsx

@@ -58,13 +58,13 @@ export const SendInputModal = ({
       <Stack gap={3} sx={{ mt: 3 }}>
         <ModalListItem label="Your address:" value={fromAddress} fontWeight="light" />
         <TextField
-          placeholder="Recipient address"
+          label="Recipient address"
           fullWidth
           onChange={(e) => onAddressChange(e.target.value)}
           value={toAddress}
         />
         <CurrencyFormField
-          placeholder="Amount"
+          label="Amount"
           fullWidth
           onChanged={(value) => {
             onAmountChange(value);