FB: separated row from components

src/client/js/components/PasswordResetExecutionForm.jsx

@@ -8,36 +8,24 @@ const PasswordResetExecutionForm = (props) => {
   // const { t } = props;
 
   return (
-    <div className="container">
-      <div className="row justify-content-md-center">
-        <div className="col-md-6 mt-5">
-          <div className="text-center">
-            <h1><i className="icon-lock large"></i></h1>
-            <h2 className="text-center">Reset Password</h2>
-            {/* TODO: show user email by GW-6778 */}
-            <p>Enter a new password for foo@example.com.</p>
-            <form role="form" className="form" method="post">
-              <div className="form-group">
-                <div className="input-group">
-                  <input name="password" placeholder="New Password" className="form-control" type="password" />
-                </div>
-              </div>
-              <div className="form-group">
-                <div className="input-group">
-                  <input name="password" placeholder="Confirm the new password" className="form-control" type="password" />
-                </div>
-              </div>
-              <div className="form-group">
-                <input name="reset-password-btn" className="btn btn-lg btn-primary btn-block" value="Reset Password" type="submit" />
-              </div>
-              <a href="/login">
-                <i className="icon-login mr-1"></i>Sign in instead
-              </a>
-            </form>
-          </div>
+    <form role="form" className="form" method="post">
+      <div className="form-group">
+        <div className="input-group">
+          <input name="password" placeholder="New Password" className="form-control" type="password" />
         </div>
       </div>
-    </div>
+      <div className="form-group">
+        <div className="input-group">
+          <input name="password" placeholder="Confirm the new password" className="form-control" type="password" />
+        </div>
+      </div>
+      <div className="form-group">
+        <input name="reset-password-btn" className="btn btn-lg btn-primary btn-block" value="Reset Password" type="submit" />
+      </div>
+      <a href="/login">
+        <i className="icon-login mr-1"></i>Sign in instead
+      </a>
+    </form>
   );
 };
 

src/client/js/components/PasswordResetRequestForm.jsx

@@ -8,30 +8,19 @@ const PasswordResetRequestForm = (props) => {
   // const { t } = props;
 
   return (
-    <div className="container">
-      <div className="row justify-content-md-center">
-        <div className="col-md-6 mt-5">
-          <div className="text-center">
-            <h1><i className="icon-lock large"></i></h1>
-            <h2 className="text-center">Forgot Password?</h2>
-            <p>You can reset your password here.</p>
-            <form role="form" className="form" method="post">
-              <div className="form-group">
-                <div className="input-group">
-                  <input name="email" placeholder="email address" className="form-control" type="email" />
-                </div>
-              </div>
-              <div className="form-group">
-                <input name="reset-password-btn" className="btn btn-lg btn-primary btn-block" value="Reset Password" type="submit" />
-              </div>
-              <a href="/login">
-                <i className="icon-login mr-1"></i>Return to login
-              </a>
-            </form>
-          </div>
+    <form role="form" className="form" method="post">
+      <div className="form-group">
+        <div className="input-group">
+          <input name="email" placeholder="E-mail Address" className="form-control" type="email" />
         </div>
       </div>
-    </div>
+      <div className="form-group">
+        <input name="reset-password-btn" className="btn btn-lg btn-primary btn-block" value="Reset Password" type="submit" />
+      </div>
+      <a href="/login">
+        <i className="icon-login mr-1"></i>Return to login
+      </a>
+    </form>
   );
 };
 

src/server/views/forgot-password.html

@@ -27,7 +27,18 @@
 
   <div id="main" class="main">
     <div id="content-main" class="content-main container-lg">
-      <div id="password-reset-request-form"></div>
+      <div class="container">
+        <div class="row justify-content-md-center">
+          <div class="col-md-6 mt-5">
+            <div class="text-center">
+              <h1><i class="icon-lock large"></i></h1>
+              <h2 class="text-center">Forgot Password?</h2>
+              <p>You can reset your password here.</p>
+              <div id="password-reset-request-form"></div>
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 

src/server/views/reset-password.html

@@ -27,7 +27,21 @@
 
   <div id="main" class="main">
     <div id="content-main" class="content-main container-lg">
-      <div id="password-reset-execution-form"></div>
+      <div class="container">
+        <div class="row justify-content-md-center">
+          <div class="col-md-6 mt-5">
+            <div class="text-center">
+              <h1><i class="icon-lock large"></i></h1>
+              <h2 class="text-center">Reset Password</h2>
+              <!-- TODO: show user email by GW-6778 -->
+              <p>Enter a new password for foo@example.com.</p>
+              <div id="password-reset-execution-form"></div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+    </div>
     </div>
   </div>