M app/src/containers/LostPassword/Success.js → app/src/containers/LostPassword/Success.js

@@ -25,11 +25,11 @@ <Typography variant="body1" gutterBottom>
           {t('lost_password.sent', {email})}
         </Typography>
       </CardContent>
-      <CardActions>
+      <CardActions className={classes.actions}>
         <Button
           id="LostPasswordRegister"
           href="/login"
-          color="secondary"
+          color="primary"
           variant="contained"
         >
           {t('lost_password.actions.login')}
@@ -45,6 +45,9 @@ textAlign: 'center',
   },
   successIcon: {
     fontSize: theme.spacing(14),
+  },
+  actions: {
+    justifyContent: 'center',
   },
 }));
 export default Success;

M app/src/containers/LostPassword/index.js → app/src/containers/LostPassword/index.js

@@ -89,13 +89,8 @@ )
             }
           />
         </CardContent>
-        <CardActions>
-          <Button
-            id="LostPasswordRegister"
-            href="/login"
-            color="secondary"
-            variant="contained"
-          >
+        <CardActions className={classes.actions}>
+          <Button id="LostPasswordRegister" href="/login">
             {t('lost_password.actions.cancel')}
           </Button>
 
@@ -109,7 +104,11 @@ id="LostPasswordSubmit"
           >
             {t('lost_password.actions.send')}
             {isLoading && (
-              <CircularProgress className={classes.loader} size={20} />
+              <CircularProgress
+                className={classes.loader}
+                color="primary"
+                size={20}
+              />
             )}
           </Button>
         </CardActions>
@@ -121,6 +120,10 @@ 
 const useStyles = makeStyles(theme => ({
   loader: {
     marginLeft: theme.spacing(4),
+  },
+  actions: {
+    marginTop: theme.spacing(2),
+    justifyContent: 'flex-end',
   },
 }));
 export default LostPassword;

M app/src/containers/ResetPassword/index.js → app/src/containers/ResetPassword/index.js

@@ -6,9 +6,7 @@ import CardActions from '@material-ui/core/CardActions';
 import Button from '@material-ui/core/Button';
 import {useTranslation} from 'react-i18next';
 import TextField from '@material-ui/core/TextField';
-import IconButton from '@material-ui/core/IconButton';
-import Icon from '@material-ui/core/Icon';
-
+import {makeStyles} from '@material-ui/core/styles';
 const ResetPassword = ({
   password,
   setPassword,
@@ -18,22 +16,10 @@ error,
   isLoading,
 }) => {
   const {t} = useTranslation();
+  const classes = useStyles();
   return (
     <Card>
-      <CardHeader
-        title={t('profile.actions.change_password')}
-        action={
-          <IconButton
-            color="inherit"
-            edge="end"
-            id="ChangePasswordAction"
-            type="submit"
-            title={t('profile.actions.save')}
-          >
-            <Icon>done</Icon>
-          </IconButton>
-        }
-      />
+      <CardHeader title={t('profile.actions.change_password')} />
       <CardContent>
         <TextField
           label={t('lost_password.password')}
@@ -59,11 +45,10 @@ id="ResetPasswordNewPasswordConfirmation"
           name="new_password_confirmation"
         />
       </CardContent>
-      <CardActions>
+      <CardActions className={classes.actions}>
         <Button
           type="submit"
           color="primary"
-          size="small"
           variant="contained"
           disabled={
             isLoading ||
@@ -77,5 +62,10 @@ </CardActions>
     </Card>
   );
 };
-
+const useStyles = makeStyles(theme => ({
+  actions: {
+    justifyContent: 'flex-end',
+    marginTop: theme.spacing(2),
+  },
+}));
 export default ResetPassword;