Reorganize registration inputs

pull/21833/head
J. Ryan Stinnett 2019-01-29 15:52:12 -06:00
parent 379b940bfa
commit daee5f0325
2 changed files with 39 additions and 18 deletions

View File

@ -47,6 +47,24 @@ limitations under the License.
box-sizing: border-box; box-sizing: border-box;
} }
.mx_Auth_fieldRow {
display: flex;
margin-bottom: 10px;
}
.mx_Auth_fieldRow > * {
margin: 0 5px;
flex: 1;
}
.mx_Auth_fieldRow > *:first-child {
margin-left: 0;
}
.mx_Auth_fieldRow > *:last-child {
margin-right: 0;
}
.mx_AuthBody a:link, .mx_AuthBody a:link,
.mx_AuthBody a:hover, .mx_AuthBody a:hover,
.mx_AuthBody a:visited { .mx_AuthBody a:visited {

View File

@ -340,24 +340,27 @@ module.exports = React.createClass({
{editLink} {editLink}
</h3> </h3>
<form onSubmit={this.onSubmit}> <form onSubmit={this.onSubmit}>
{ emailSection } <div className="mx_Auth_fieldRow">
{ phoneSection }
<input type="text" ref="username" <input type="text" ref="username"
placeholder={placeholderUsername} defaultValue={this.props.defaultUsername} placeholder={placeholderUsername} defaultValue={this.props.defaultUsername}
className={this._classForField(FIELD_USERNAME, 'mx_Login_field')} className={this._classForField(FIELD_USERNAME, 'mx_Login_field')}
onBlur={function() {self.validateField(FIELD_USERNAME);}} /> onBlur={function() {self.validateField(FIELD_USERNAME);}} />
<br /> </div>
<div className="mx_Auth_fieldRow">
<input type="password" ref="password" <input type="password" ref="password"
className={this._classForField(FIELD_PASSWORD, 'mx_Login_field')} className={this._classForField(FIELD_PASSWORD, 'mx_Login_field')}
onBlur={function() {self.validateField(FIELD_PASSWORD);}} onBlur={function() {self.validateField(FIELD_PASSWORD);}}
placeholder={_t("Password")} defaultValue={this.props.defaultPassword} /> placeholder={_t("Password")} defaultValue={this.props.defaultPassword} />
<br />
<input type="password" ref="passwordConfirm" <input type="password" ref="passwordConfirm"
placeholder={_t("Confirm password")} placeholder={_t("Confirm password")}
className={this._classForField(FIELD_PASSWORD_CONFIRM, 'mx_Login_field')} className={this._classForField(FIELD_PASSWORD_CONFIRM, 'mx_Login_field')}
onBlur={function() {self.validateField(FIELD_PASSWORD_CONFIRM);}} onBlur={function() {self.validateField(FIELD_PASSWORD_CONFIRM);}}
defaultValue={this.props.defaultPassword} /> defaultValue={this.props.defaultPassword} />
<br /> </div>
<div className="mx_Auth_fieldRow">
{ emailSection }
{ phoneSection }
</div>
{ registerButton } { registerButton }
</form> </form>
</div> </div>