diff --git a/css/images/neon-body-snakeblock.png b/css/images/neon-body-snakeblock.png new file mode 100644 index 0000000..d66f771 Binary files /dev/null and b/css/images/neon-body-snakeblock.png differ diff --git a/css/images/neon-dead-snakeblock.png b/css/images/neon-dead-snakeblock.png new file mode 100644 index 0000000..55da41a Binary files /dev/null and b/css/images/neon-dead-snakeblock.png differ diff --git a/css/neon-snake.css b/css/neon-snake.css new file mode 100644 index 0000000..1be055f --- /dev/null +++ b/css/neon-snake.css @@ -0,0 +1,139 @@ +/* +JavaScript Snake +By Patrick Gillespie +http://patorjk.com/games/snake +*/ +body { + margin:0px; + padding:0px; + background-color: #000000; +} + +.snake-toolbar { + color: #ffffff; +} + +#game-area { + margin:10px; + padding:0px; +} + +#mode-wrapper { + color: #ffffff; + font-family: Verdana, arial, helvetica, sans-serif; + font-size: 14px; + +} + +#game-area:focus { outline: none; } + +a.snake-link, a.snake-link:link, a.snake-link:visited { + color: #00FFE0; +} + +a.snake-link:hover { + color: #0FFF00; +} + +.snake-pause-screen { + font-family: Verdana, arial, helvetica, sans-serif; + font-size: 14px; + position:absolute; + width:300px; + height:80px; + text-align:center; + top:50%; + left:50%; + margin-top:-40px; + margin-left:-150px; + display:none; + background-color:#0FFF00; + color:#000000; +} + +.snake-panel-component { + position: absolute; + font-family: Verdana, arial, helvetica, sans-serif; + font-size: 14px; + color: #ffffff; + text-align: center; + padding: 8px; + margin: 0px; +} + +.snake-snakebody-block { + margin: 0px; + padding: 0px; + background-color: #FF0000; + position: absolute; + border: 0px solid #000080; + background-repeat: no-repeat; +} + +.snake-snakebody-alive { + background-image: url('./images/neon-body-snakeblock.png'), url('./css/images/neon-body-snakeblock.png'); +} +.snake-snakebody-dead { + background-image: url('./images/neon-dead-snakeblock.png'), url('./css/images/neon-dead-snakeblock.png'); +} + +.snake-food-block { + margin: 0px; + padding: 0px; + background-color: #FF0000; + border: 0px solid #000080; + position: absolute; +} + +.snake-playing-field { + margin: 0px; + padding: 0px; + position: absolute; + background-color: #00FFD4; + border: 0px solid #0000A8; +} + +.snake-game-container { + margin: 0px; + padding: 0px; + border-width: 0px; + border-style: none; + zoom: 1; + position: relative; +} + +.snake-welcome-dialog { + padding: 8px; + margin: 0px; + background-color: #0FFF00; + color: #000000; + font-family: Verdana, arial, helvetica, sans-serif; + font-size: 14px; + position: absolute; + top: 50%; + left: 50%; + width: 300px; + /*height: 150px;*/ + margin-top: -100px; + margin-left: -158px; + text-align: center; + display: block; +} + +.snake-try-again-dialog, .snake-win-dialog { + padding: 8px; + margin: 0px; + background-color: #0FFF00; + color: #000000; + font-family: Verdana, arial, helvetica, sans-serif; + font-size: 14px; + position: absolute; + top: 50%; + left: 50%; + width: 300px; + height: 100px; + margin-top: -75px; + margin-left: -158px; + text-align: center; + display: none; +} diff --git a/index.html b/index.html index 5e95552..166431e 100755 --- a/index.html +++ b/index.html @@ -60,6 +60,9 @@ case 6: changeTheme('css/head-snake.css?' + Math.random()); break; + case 7: + changeTheme('css/neon-snake.css?' + Math.random()); + break; default: changeTheme('css/main-snake.css?' + Math.random()); break; @@ -94,6 +97,7 @@ +