Replaced all the css into tailwind css on PasswordResetForm component (…

…#1778)

components/Forms/PasswordResetForm/PasswordResetForm.js

@@ -8,7 +8,6 @@ import Input from 'components/Form/Input/Input';
 import Alert from 'components/Alert/Alert';
 import { validationErrorMessages } from 'common/constants/messages';
 import { getServerErrorMessage } from 'common/utils/api-utils';
-import styles from './PasswordResetForm.module.css';
 
 const defaultValues = { email: '' };
 
@@ -54,8 +53,8 @@ function PasswordResetForm({ initialValues, onSuccess, passwordReset }) {
       validationSchema={passwordResetSchema}
     >
       {({ isSubmitting }) => (
-        <Form className={styles.PasswordResetForm}>
-          <div className={styles.row}>
+        <Form className="w-full">
+          <div className="flex flex-wrap justify-center">
             <Field
               type="email"
               name="email"
@@ -66,17 +65,12 @@ function PasswordResetForm({ initialValues, onSuccess, passwordReset }) {
             />
           </div>
 
-          <div className={styles.row}>
+          <div className="flex flex-wrap justify-center">
             {errorMessage && <Alert type="error">{errorMessage}</Alert>}
           </div>
 
-          <div className={styles.row}>
-            <Button
-              className={styles.topMargin}
-              type="submit"
-              theme="secondary"
-              disabled={isSubmitting}
-            >
+          <div className="flex flex-wrap justify-center">
+            <Button className="mt-4" type="submit" theme="secondary" disabled={isSubmitting}>
               Submit
             </Button>
           </div>

components/Forms/PasswordResetForm/__tests__/__snapshots__/PasswordResetForm.test.js.snap

@@ -2,13 +2,13 @@
 
 exports[`PasswordResetForm should render with required props 1`] = `
 <form
-  className="PasswordResetForm"
+  className="w-full"
   noValidate={true}
   onReset={[Function]}
   onSubmit={[Function]}
 >
   <div
-    className="row"
+    className="flex flex-wrap justify-center"
   >
     <div
       className="field"
@@ -40,13 +40,13 @@ exports[`PasswordResetForm should render with required props 1`] = `
     </div>
   </div>
   <div
-    className="row"
+    className="flex flex-wrap justify-center"
   />
   <div
-    className="row"
+    className="flex flex-wrap justify-center"
   >
     <button
-      className="Button topMargin secondary"
+      className="Button mt-4 secondary"
       data-testid="BUTTON"
       disabled={false}
       onClick={[Function]}