Permalink
Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
113 lines (100 sloc) 7.02 KB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Connect-4</title>
<link rel="stylesheet" href="./css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="./css/styles.css">
<script type="text/javascript" src="./js/jquery.min.js"></script>
<!--
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
-->
<script type="text/javascript" src="./js/scripts.js"></script>
<link href="https://fonts.googleapis.com/css?family=Titan+One" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="col-sm-12">
<div class="row text-center enjoy-css" id="title">
<span id="connect">Connect</span><span id="four">-4</span>
</div>
</div>
</div>
<div class="container">
<div class="col-sm-12 col-xs-12 board text-center">
<div class="row">
<div class="col-sm-1 col-xs-1 space" id="a0-container"><button id='a0' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="b0-container"><button id='b0' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="c0-container"><button id='c0' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="d0-container"><button id='d0' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="e0-container"><button id='e0' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="f0-container"><button id='f0' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="g0-container"><button id='g0' class="slot"></button></div>
<div class="col-sm-5 empty"></div>
</div>
<div class="row">
<div class="col-sm-1 col-xs-1 space" id="a1-container"><button id='a1' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="b1-container"><button id='b1' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="c1-container"><button id='c1' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="d1-container"><button id='d1' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="e1-container"><button id='e1' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="f1-container"><button id='f1' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="g1-container"><button id='g1' class="slot"></button></div>
<div class="col-sm-5 empty"></div>
</div>
<div class="row">
<div class="col-sm-1 col-xs-1 space" id="a2-container"><button id='a2' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="b2-container"><button id='b2' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="c2-container"><button id='c2' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="d2-container"><button id='d2' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="e2-container"><button id='e2' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="f2-container"><button id='f2' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="g2-container"><button id='g2' class="slot"></button></div>
<div class="col-sm-5 empty"></div>
</div>
<div class="row">
<div class="col-sm-1 col-xs-1 space" id="a3-container"><button id='a3' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="b3-container"><button id='b3' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="c3-container"><button id='c3' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="d3-container"><button id='d3' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="e3-container"><button id='e3' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="f3-container"><button id='f3' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="g3-container"><button id='g3' class="slot"></button></div>
<div class="col-sm-5 empty"></div>
</div>
<div class="row">
<div class="col-sm-1 col-xs-1 space" id="a4-container"><button id='a4' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="b4-container"><button id='b4' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="c4-container"><button id='c4' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="d4-container"><button id='d4' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="e4-container"><button id='e4' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="f4-container"><button id='f4' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="g4-container"><button id='g4' class="slot"></button></div>
<div class="col-sm-5 empty"></div>
</div>
<div class="row">
<div class="col-sm-1 col-xs-1 space" id="a5-container"><button id='a5' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="b5-container"><button id='b5' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="c5-container"><button id='c5' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="d5-container"><button id='d5' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="e5-container"><button id='e5' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="f5-container"><button id='f5' class="slot"></button></div>
<div class="col-sm-1 col-xs-1 space" id="g5-container"><button id='g5' class="slot"></button></div>
<div class="col-sm-5 empty"></div>
</div>
</div>
</div>
<div class="container">
<div class="col-sm-12">
<div class="row text-center play-again-container">
<button class="btn btn-primary" id="restart"><span id="new-game">New Game</span></button>
</div>
<div class="row turn text-center col-sm-4 col-sm-offset-4" id="message">Turn:</div>
<div class="row turn text-center col-sm-2 col-sm-offset-5 player-cpu" id="player">Player</div>
<!--<div class="col-sm-1 turn player-cpu text-left" id="arrow">&#8592;</div>-->
<div class="row turn text-center col-sm-2 col-sm-offset-5 player-cpu" id="cpu">CPU</div>
</div>
</div>
</body>
</html>