Merge pull request patorjk#68 from patorjk/newtheme_matrix

added matrix theme

css/matrix-snake.css

@@ -0,0 +1,134 @@
+body {
+margin:0px;
+padding:0px;
+background-color: #00ff11;
+}
+
+#game-area {
+margin:10px;
+padding:0px;
+background-color: #00ff11;
+}
+
+#mode-wrapper {
+color: #000000;
+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: #FCFC54;
+}
+
+a.snake-link:hover {
+color: #FfFf54;
+}
+
+.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:black;
+color:white;
+}
+
+.snake-panel-component {
+position: absolute;
+font-family: Verdana, arial, helvetica, sans-serif;
+font-size: 14px;
+color: #000000;
+text-align: center;
+background-color: #00ff11;
+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/matrix-snake-block.png');
+}
+.snake-snakebody-dead {
+background-image: url('./images/deadblock.png');
+}
+
+.snake-food-block {
+margin: 0px;
+padding: 0px;
+background-color: #FF0000;
+border: 0px solid #000080;
+position: absolute;
+background-image: url("./images/matrix-food-block.png")
+}
+
+.snake-playing-field {
+margin: 0px;
+padding: 0px;
+position: absolute;
+background-color: #000000;
+border: 0px solid #000000;
+}
+
+.snake-game-container {
+margin: 0px;
+padding: 0px;
+border-width: 0px;
+border-style: none;
+zoom: 1;
+background-color: #00ff11;
+position: relative;
+}
+
+.snake-welcome-dialog {
+padding: 8px;
+margin: 0px;
+background-color: #000000;
+color: #00ff11;
+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: #000000;
+color: #ff0000;
+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;
+}

index.html

@@ -40,9 +40,12 @@
         case 2: 
           changeTheme('css/dark-snake.css?' + Math.random());
           break;
-    case 3: 
+        case 3: 
           changeTheme('css/green-snake.css?' + Math.random());
           break;
+        case 4: 
+          changeTheme('css/matrix-snake.css?' + Math.random());
+          break;
         default:
           changeTheme('css/main-snake.css?' + Math.random());
           break;
@@ -74,7 +77,7 @@
             <option selected>Main Theme by patorjk</option>
             <option>Dark Theme by KenyStev</option>
             <option>Green Theme by CoffeeCatDE</option>
-
+            <option>Matrix Theme by Geahad Haymor</option>
         </select>
       </div>
       <div style="display:inline-block;margin-right:10px;">