Commit 64b76a1e authored by Matthew Odle's avatar Matthew Odle

update styling for leaderboard form

parent d87d9efd
......@@ -33,15 +33,16 @@ export class LeaderboardForm extends React.Component {
render = () => {
return <div>
<div style={ style.title }>Submit your name to the leaderboard!</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 }>Your score: { this.props.score }</div>
<div style={ style.regularText }>Submit your name to the leaderboard!</div>
<div style={ style.leaderboardForm }>
<input type='text'
placeholder='Your name...'
style={ style.leaderboardFormName }
value={ this.state.name }
onChange={ this.onChange } />
onChange={ this.onChange }
maxlength="10" />
<div style={style.buttons}>
<button style={ style.leaderboardFormButton } onClick={this.handleSubmit} value="Post" >Submit</button>
<button style={ style.leaderboardFormButton } onClick={() => this.props.hideModal()} >Cancel</button>
......
......@@ -156,10 +156,40 @@ button {
clear: both;
}
.modal-dialog {
position: absolute;
top: 50px;
left: 0px;
border: 2px solid black;
background: white;
z-index: 1000;
float: left;
text-align: center;
}
.screen-block {
position:fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: gray;
opacity: 0.8;
z-index: 900;
}
@media (min-width: 768px) {
* {
font-size: 16px;
}
.modal-dialog {
top:50%;
left:50%;
height: 300px;
width: 500px;
margin-top:-150px;
margin-left:-250px;
}
.log {
position: absolute;
......@@ -202,23 +232,3 @@ button {
top: 0px;
}
}
.modal-dialog {
position: absolute;
top:10px;
left:10px;
border: 2px solid black;
background: white;
z-index: 1000;
}
.screen-block {
position:fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: gray;
opacity: 0.8;
z-index: 900;
}
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