Clean up styling on user login form.

This commit is contained in:
Dorian 2017-11-10 12:03:06 -05:00
parent b9ff990c11
commit 78136774b5
1 changed files with 24 additions and 3 deletions

View File

@ -86,7 +86,12 @@ export class UserLogin extends Component {
<label htmlFor='username' style={{ <label htmlFor='username' style={{
gridRow: 1, gridRow: 1,
gridColumn: 1, gridColumn: 1,
textAlign: 'right', verticalAlign: 'middle', marginRight: '10px'}}>Username</label> textAlign: 'right',
verticalAlign: 'middle',
marginRight: '10px'}}
>
Username
</label>
<input <input
id='username' id='username'
type='text' type='text'
@ -94,7 +99,16 @@ export class UserLogin extends Component {
style={{ gridRow: 1, gridColumn: 2}} style={{ gridRow: 1, gridColumn: 2}}
value={ this.state.username } value={ this.state.username }
onChange={ this.handleUsernameUpdate } /> onChange={ this.handleUsernameUpdate } />
<label htmlFor='password' style={{ gridRow: 2, gridColumn: 1, marginTop: '10px', textAlign: 'right', verticalAlign: 'middle', marginRight: '10px'}}>Password</label> <label htmlFor='password' style={{
gridRow: 2,
gridColumn: 1,
marginTop: '10px',
textAlign: 'right',
verticalAlign: 'middle',
marginRight: '10px'}}
>
Password
</label>
<input <input
id='password' id='password'
type='password' type='password'
@ -103,7 +117,14 @@ export class UserLogin extends Component {
value={ this.state.password } value={ this.state.password }
onChange={ this.handlePasswordUpdate } /> onChange={ this.handlePasswordUpdate } />
<div style={{ gridRow: 3, gridColumnStart: 0, gridColumnEnd: 2, display: 'flex', flexDirection: 'row', justifyContent: 'flex-end' }}> <div style={{
gridRow: 3,
gridColumnStart: 0,
gridColumnEnd: 2,
display: 'flex',
flexDirection: 'row',
justifyContent: 'flex-end'
}}>
<button <button
className='btn btn-warning' className='btn btn-warning'
onClick={ this.handleClearLoginForm } onClick={ this.handleClearLoginForm }