1<div>
2 <Modal show={this.state.show} onHide={this.handleClose} backdrop="static">
3 <Modal.Header>
4 <Modal.Title>Change Password</Modal.Title>
5 </Modal.Header>
6 <Modal.Body>
7 <form className="form-horizontal" style={{margin:0}}>
8 <div className='password-heading'>This is the first time you have logged in.</div>
9 <div className='password-heading'>Please set a new password for your account.</div>
10 <br/>
11
12 <label className="password">Password
13 <input type={this.state.type} className="password__input" onChange={this.passwordStrength}/>
14 <span className="password__show" onClick={this.showHide}>{this.state.type === 'input' ? 'Hide' : 'Show'}</span>
15 <span className="password__strength" data-score={this.state.score}>
16 <div className="strength_string">{this.state.strength}</div>
17 </span>
18 </label>
19 <br/>
20 <label className="password">Confirm Password
21 <input type={this.state.type} className="password__input" onChange={this.passwordStrength}/>
22 </label>
23
24 </form>
25 <br/>
26 </Modal.Body>
27 <Modal.Footer>
28 <Button onClick={this.submitPassword} disabled={this.state.isDisabled}>Submit</Button>
29 </Modal.Footer>
30 </Modal>
31</div>
32