Difference between revisions of "Team:Tianjin/hahaha"

(Blanked the page)
Line 1: Line 1:
 +
<!doctype html>
 +
<html>
 +
<head>
 +
<meta charset="utf-8">
  
 +
/* OVERRIDE IGEM SETTINGS */
 +
<style>
 +
#sideMenu, #top_title, #contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading, .visualClear {display: none}
 +
#content {width: 100%;  background: transparent; margin: 0; padding: 0; }
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5  { margin-bottom: 2px; }
 +
        #top_menu_under {
 +
                height: 0px;
 +
                border-bottom: 0 none;
 +
                display: none;
 +
      }
 +
 +
        #top_menu_14 {
 +
                height: 24px;
 +
                border-bottom: 0 none;
 +
      }
 +
 +
#globalWrapper, #content  {
 +
width: 100%;
 +
                margin:  0;
 +
float:none
 +
font-size: 100%;
 +
                z-index: 0;
 +
}
 +
 +
div[id=mw-content-text] > p {
 +
display: none;
 +
}
 +
 +
#sideMenu {
 +
width: 200px;
 +
}
 +
 +
#sideMenu .mainMenu_Title, #sideMenu .mainMenu_toggle, #sideMenu #MainPage_menu ul li li {
 +
border: none;
 +
}
 +
 +
#sideMenu .sideMenuTitle {
 +
height: 35px;
 +
}
 +
 +
#top_menu_inside .submenu {
 +
width: auto;
 +
}
 +
</style>
 +
<style>
 +
::selection {
 +
color:#FFFFFF;
 +
background:transparent;
 +
}
 +
::-moz-selection {
 +
color:#FFFFFF;
 +
background:transparent;
 +
}
 +
* {
 +
margin:0;
 +
padding:0;
 +
font-family:"VT323";
 +
}
 +
body {
 +
background-color:#000000;
 +
}
 +
.wrap {
 +
margin-left:auto;
 +
margin-right:auto;
 +
}
 +
header {
 +
width:340px;
 +
font-size:0;
 +
}
 +
canvas {
 +
display:none;
 +
border-style:solid;
 +
border-width:10px;
 +
border-color:#FFFFFF;
 +
}
 +
canvas:focus {
 +
outline:none;
 +
}
 +
/* Top Styles */
 +
h1 {
 +
display:inline-block;
 +
width:100px;
 +
font-size:32px;
 +
color:#FFFFFF;
 +
}
 +
.score {
 +
display:inline-block;
 +
width:240px;
 +
font-size:20px;
 +
color:#FFFFFF;
 +
text-align:right;
 +
}
 +
.score_value {
 +
font-size:inherit;
 +
}
 +
/* All screens style */
 +
#gameover a,#setting a,#menu a {
 +
display:block;
 +
}
 +
#gameover a,#setting a:hover,#menu a:hover {
 +
cursor:pointer;
 +
}
 +
#gameover a:hover::before,#setting a:hover::before,#menu a:hover::before {
 +
content:">";
 +
margin-right:10px;
 +
}
 +
/* Menu Screen Style */
 +
#menu {
 +
display:block;
 +
width:340px;
 +
padding-top:95px;
 +
padding-bottom:95px;
 +
font-size:40px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
text-align:center;
 +
color:#FFF;
 +
}
 +
#menu h2 {
 +
-webkit-animation:logo-ani 1000ms linear infinite;
 +
animation:logo-ani 1000ms linear infinite;
 +
margin-bottom:30px;
 +
}
 +
#menu a {
 +
font-size:30px;
 +
}
 +
@-webkit-keyframes logo-ani {
 +
50% {
 +
-webkit-transform:scale(1.3,1.3);
 +
}
 +
100% {
 +
-webkit-transform:scale(1.0,1.0);
 +
}
 +
}@keyframes logo-ani {
 +
50% {
 +
transform:scale(1.3,1.3);
 +
}
 +
100% {
 +
transform:scale(1.0,1.0);
 +
}
 +
}/* Game Over Screen Style */
 +
 +
#gameover {
 +
display:none;
 +
width:340px;
 +
padding-top:95px;
 +
padding-bottom:95px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
text-align:center;
 +
font-size:30px;
 +
color:#FFF;
 +
}
 +
#gameover p {
 +
margin-top:25px;
 +
font-size:20px;
 +
}
 +
/* Settings Screen Style */
 +
#setting {
 +
display:none;
 +
width:340px;
 +
margin-left:auto;
 +
margin-right:auto;
 +
padding-top:85px;
 +
padding-bottom:85px;
 +
font-size:30px;
 +
color:#FFF;
 +
text-align:center;
 +
}
 +
#setting h2 {
 +
margin-bottom:15px;
 +
}
 +
#setting p {
 +
margin-top:10px;
 +
}
 +
#setting input {
 +
display:none;
 +
}
 +
#setting label {
 +
cursor:pointer;
 +
}
 +
#setting input:checked + label {
 +
background-color:#FFF;
 +
color:#000;
 +
}
 +
</style>
 +
</head>
 +
<body>
 +
<script src="Untitled-1.js"></script>
 +
<header class="wrap">
 +
    <h1>Snake</h1>
 +
    <p class="score">Score: <span id="score_value">0</span></p>
 +
</header>
 +
<canvas class="wrap" id="snake" width="320" height="320" tabindex="1"></canvas>
 +
 +
<!-- Game Over Screen -->
 +
<div id="gameover">
 +
    <h2>Game Over</h2>
 +
    <p>press <span style="background-color: #FFFFFF; color: #000000">space</span> to begin a</p>
 +
    <a id="newgame_gameover">new game</a>
 +
    <a id="setting_gameover">settings</a>
 +
</div>
 +
 +
<!-- Setting screen -->
 +
<div id="setting">
 +
    <h2>Settings</h2>
 +
 +
    <a id="newgame_setting">new game</a>
 +
 +
    <p>Speed:
 +
        <input id="speed1" type="radio" name="speed" value="120" checked/>
 +
        <label for="speed1">Slow</label>
 +
        <input id="speed2" type="radio" name="speed" value="75" />
 +
        <label for="speed2">Normal</label>
 +
        <input id="speed3" type="radio" name="speed" value="35" />
 +
        <label for="speed3">Fast</label>
 +
    </p>
 +
 +
    <p>Wall:
 +
        <input id="wallon" type="radio" name="wall" value="1" checked/>
 +
        <label for="wallon">On</label>
 +
        <input id="walloff" type="radio" name="wall" value="0" />
 +
        <label for="walloff">Off</label>
 +
    </p>
 +
 +
</div>
 +
 +
<!-- Main Menu Screen -->
 +
<div id="menu">
 +
    <h2>Snake</h2>
 +
 +
    <a id="newgame_menu">new game</a>
 +
    <a id="setting_menu">settings</a>
 +
</div>
 +
 +
<!--
 +
    <div id="debug" style="font-size: 16px; color: #FFF;"></div>
 +
  -->
 +
</body>
 +
</html>

Revision as of 12:21, 1 November 2017

<!doctype html> /* OVERRIDE IGEM SETTINGS */

Snake

Score: 0

Game Over

press space to begin a

new game settings

Settings

new game

Speed:

Wall: