48 lines
2.2 KiB
JavaScript
48 lines
2.2 KiB
JavaScript
import React from 'react';
|
|
import 'bootstrap/dist/css/bootstrap.min.css';
|
|
|
|
class LoginForm extends React.Component {
|
|
constructor(props) {
|
|
super(props)
|
|
this.state = {
|
|
}
|
|
}
|
|
render(){
|
|
return(
|
|
<div>
|
|
<div className="container">
|
|
<div className="row">
|
|
<div className="col-sm-9 col-md-7 col-lg-5 mx-auto">
|
|
<div className="card card-signin my-5">
|
|
<div className="card-body">
|
|
<h5 className="card-title text-center">Sign In</h5>
|
|
<form className="form-signin">
|
|
<div className="form-label-group">
|
|
<input type="email" id="inputEmail" className="form-control" placeholder="Email address" required autoFocus value={this.props.email} onChange={this.props.getEmail.bind(this)} />
|
|
<label htmlFor="inputEmail">Email address</label>
|
|
</div>
|
|
<div className="form-label-group">
|
|
<input type="password" id="inputPassword" className="form-control" value={this.props.password} placeholder="Password" onChange={this.props.getPassword.bind(this)} required />
|
|
<label htmlFor="inputPassword">Password</label>
|
|
</div>
|
|
<div className="custom-control custom-checkbox mb-3">
|
|
<input type="checkbox" className="custom-control-input" id="customCheck1" onChange={this.props.getRememberPass.bind(this)} checked={this.props.rememberPass} />
|
|
<label className="custom-control-label" htmlFor="customCheck1">Remember password</label>
|
|
</div>
|
|
<button className="btn btn-lg btn-primary btn-block text-uppercase" >Sign in</button>
|
|
<hr className="my-4" />
|
|
{/* <button className="btn btn-lg btn-google btn-block text-uppercase" type="submit"><i className="fab fa-google mr-2"></i> Sign in with Google</button>
|
|
<button className="btn btn-lg btn-facebook btn-block text-uppercase" type="submit"><i className="fab fa-facebook-f mr-2"></i> Sign in with Facebook</button> */}
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
|
|
export default LoginForm
|