Commit b5af0eb7 authored by Matthew Odle's avatar Matthew Odle

make leaderboard form prettier

parent 64b76a1e
...@@ -32,7 +32,7 @@ export class LeaderboardForm extends React.Component { ...@@ -32,7 +32,7 @@ export class LeaderboardForm extends React.Component {
} }
render = () => { render = () => {
return <div> return <div style={ style.formWrapper} >
<div style={ style.title }>Your score: { this.props.score }</div> <div style={ style.title }>Your score: { this.props.score }</div>
<div style={ style.regularText }>Nobody left to stack the corpses... Surely you could do better.</div> <div style={ style.regularText }>Nobody left to stack the corpses... Surely you could do better.</div>
<div style={ style.regularText }>Submit your name to the leaderboard!</div> <div style={ style.regularText }>Submit your name to the leaderboard!</div>
...@@ -42,7 +42,7 @@ export class LeaderboardForm extends React.Component { ...@@ -42,7 +42,7 @@ export class LeaderboardForm extends React.Component {
style={ style.leaderboardFormName } style={ style.leaderboardFormName }
value={ this.state.name } value={ this.state.name }
onChange={ this.onChange } onChange={ this.onChange }
maxlength="10" /> maxlength="15" />
<div style={style.buttons}> <div style={style.buttons}>
<button style={ style.leaderboardFormButton } onClick={this.handleSubmit} value="Post" >Submit</button> <button style={ style.leaderboardFormButton } onClick={this.handleSubmit} value="Post" >Submit</button>
<button style={ style.leaderboardFormButton } onClick={() => this.props.hideModal()} >Cancel</button> <button style={ style.leaderboardFormButton } onClick={() => this.props.hideModal()} >Cancel</button>
......
...@@ -33,21 +33,8 @@ const style = { ...@@ -33,21 +33,8 @@ const style = {
buttons: { buttons: {
display:'block', display:'block',
}, },
modalDialog: { formWrapper: {
position:'absolute', margin:'2em'
border:'2px solid black',
background:'white',
zIndex:'1000',
},
screenBlock: {
position:'fixed',
top:'0',
left:'0',
bottom:'0',
right:'0',
backgroundColor:'gray',
opacity:'0.8',
zIndex:'900',
} }
} }
......
...@@ -185,12 +185,10 @@ button { ...@@ -185,12 +185,10 @@ button {
.modal-dialog { .modal-dialog {
top:50%; top:50%;
left:50%; left:50%;
height: 300px;
width: 500px; width: 500px;
margin-top:-150px; margin-top:-150px;
margin-left:-250px; margin-left:-250px;
} }
.log { .log {
position: absolute; position: absolute;
top: 20px; top: 20px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment