Align password change dialog with create (#2970)

js/src/modals/PasswordManager/passwordManager.css

@@ -46,6 +46,16 @@
   font-size: 1.1rem;
 }
 
+.passwords {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.password {
+  flex: 0 1 50%;
+  width: 50%;
+}
+
 .passwordHint {
   font-size: 0.9rem;
   color: lightgrey;

js/src/modals/PasswordManager/passwordManager.js

@@ -181,7 +181,16 @@ export default class PasswordManager extends Component {
                 disabled={ disabled }
                 onSubmit={ this.handleChangePassword }
                 onChange={ this.onEditCurrent } />
-
+              <Input
+                label='(optional) new password hint'
+                hint='hint for the new password'
+                submitOnBlur={ false }
+                value={ passwordHint }
+                disabled={ disabled }
+                onSubmit={ this.handleChangePassword }
+                onChange={ this.onEditHint } />
+              <div className={ styles.passwords }>
+                <div className={ styles.password }>
                   <Input
                     label='new password'
                     hint='the new password for this account'
@@ -190,6 +199,8 @@ export default class PasswordManager extends Component {
                     disabled={ disabled }
                     onSubmit={ this.handleChangePassword }
                     onChange={ this.onEditNew } />
+                </div>
+                <div className={ styles.password }>
                   <Input
                     label='repeat new password'
                     hint='repeat the new password for this account'
@@ -199,15 +210,8 @@ export default class PasswordManager extends Component {
                     disabled={ disabled }
                     onSubmit={ this.handleChangePassword }
                     onChange={ this.onEditRepeatNew } />
-
+                </div>
-              <Input
+              </div>
-                label='new password hint'
-                hint='hint for the new password'
-                submitOnBlur={ false }
-                value={ passwordHint }
-                disabled={ disabled }
-                onSubmit={ this.handleChangePassword }
-                onChange={ this.onEditHint } />
             </div>
           </Form>
         </Tab>