diff --git a/index.html b/index.html index 685c7af..dcff2fa 100644 --- a/index.html +++ b/index.html @@ -47,6 +47,20 @@ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#768087', endColorstr='#53595e',GradientType=0 ); } + #stats button { + margin: 1vmin; + float: right; + font-family: Helsinki; + font-size: 3vmin; + border-radius: 2vmin; + padding: 1.75vmin; + box-shadow: 0.5vmin 0.5vmin 0 #000; + border: 0.4vmin solid #454e52; + position: relative; + top: auto; + left: auto; + } + #stats div { float: left; font-size: 5.4vmin; @@ -66,8 +80,6 @@ } #setup h1 { - margin-top: 6vmin; - margin-bottom: 6vmin; } #setup h2 { @@ -121,6 +133,11 @@ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#768087', endColorstr='#53595e',GradientType=0 ); } + button.cancel { + right: 20vmin; + left: auto; + } + h1, h2 { text-align: center; } @@ -128,7 +145,8 @@ h1 { color: #a4f4b4; font-size: 12vmin; - margin: 16vmin 0; + margin-top: 6vmin; + margin-bottom: 6vmin; text-shadow: 1vmin 1vmin 0 #fe7ac6; /* x y blur-radius colour */ } @@ -507,14 +525,31 @@ }); $('#gameOver button').on("click", function() { - //reset game board drawGameBoard(); $('#gameOver').hide(); + $('button.cancel').hide(); + $('button.start').removeAttr('style'); $('#setup').show(); }); - $('#setup button').on("click", function() { + $('button.reset').on("click", function() { + //prompt user with setup screen + $('#setup').show(); + $('button.cancel').show(); + $('button.start').css('left', '20vmin'); + }); + + $('button.cancel').on("click", function() { + //prompt user with setup screen + $('#setup').hide(); + $('button.cancel').hide(); + $('button.start').removeAttr('style'); + }); + + $('button.start').on("click", function() { + drawGameBoard(); + //reset stats firstClick = true; @@ -656,6 +691,7 @@ drawGameBoard(); $('#gameOver').hide(); + $('button.cancel').hide(); });