Improve modal boxes

This commit is contained in:
Itay Mizeretz 2017-10-17 11:17:41 +03:00
parent 085f0d2d69
commit 1011e731af
2 changed files with 29 additions and 25 deletions

View File

@ -134,10 +134,11 @@ class MapPageComponent extends React.Component {
return (
<ModalContainer onClose={() => this.setState({showKillDialog: false})}>
<ModalDialog onClose={() => this.setState({showKillDialog: false})}>
<h1>Kill all monkeys</h1>
<h2>Are you sure you want to kill all monkeys?</h2>
<p style={{'fontSize': '1.2em', 'marginBottom': '2em'}}>
Are you sure you want to kill all monkeys?
This might take a few moments...
</p>
<div className="text-center">
<button type="button" className="btn btn-danger btn-lg" style={{margin: '5px'}}
onClick={() => {
this.killAllMonkeys();
@ -149,6 +150,7 @@ class MapPageComponent extends React.Component {
onClick={() => this.setState({showKillDialog: false})}>
Cancel
</button>
</div>
</ModalDialog>
</ModalContainer>
)

View File

@ -33,7 +33,7 @@ class StartOverPageComponent extends React.Component {
return (
<ModalContainer onClose={() => this.setState({showCleanDialog: false})}>
<ModalDialog onClose={() => this.setState({showCleanDialog: false})}>
<h1>Reset environment</h1>
<h2>Reset environment</h2>
<p style={{'fontSize': '1.2em', 'marginBottom': '2em'}}>
Are you sure you want to reset the environment?
</p>
@ -46,6 +46,7 @@ class StartOverPageComponent extends React.Component {
:
<div />
}
<div className="text-center">
<button type="button" className="btn btn-danger btn-lg" style={{margin: '5px'}}
onClick={() => {
this.cleanup();
@ -57,6 +58,7 @@ class StartOverPageComponent extends React.Component {
onClick={() => this.setState({showCleanDialog: false})}>
Cancel
</button>
</div>
</ModalDialog>
</ModalContainer>
)