-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
88 lines (87 loc) · 3.04 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0"
/>
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
crossorigin="anonymous"
/>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Protest+Revolution&display=swap" rel="stylesheet">
<link
rel="stylesheet"
href="./css/style.css"
/>
<title>Tic Tac Toe</title>
</head>
<body>
<div class="container text-center page-wrapper">
<h1>Let's Play Tic Tac Toe!!</h1>
<div class="container game-wrapper">
<div class="row top-row">
<div
id="square-11"
class="col"
onclick="handleOnSquareClick(this.id)"
></div>
<div
id="square-12"
class="col mid-col"
onclick="handleOnSquareClick(this.id)"
></div>
<div
id="square-13"
class="col"
onclick="handleOnSquareClick(this.id)"
></div>
</div>
<div class="row mid-row">
<div
id="square-21"
class="col"
onclick="handleOnSquareClick(this.id)"
></div>
<div
id="square-22"
class="col mid-col"
onclick="handleOnSquareClick(this.id)"
></div>
<div
id="square-23"
class="col"
onclick="handleOnSquareClick(this.id)"
></div>
</div>
<div class="row bot-row">
<div
id="square-31"
class="col"
onclick="handleOnSquareClick(this.id)"
></div>
<div
id="square-32"
class="col mid-col"
onclick="handleOnSquareClick(this.id)"
></div>
<div
id="square-33"
class="col"
onclick="handleOnSquareClick(this.id)"
></div>
</div>
</div>
<div title="Play against a computer" class="icon-button" onclick="handleOnRobotClick()">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M12,2A2,2 0 0,1 14,4C14,4.74 13.6,5.39 13,5.73V7H14A7,7 0 0,1 21,14H22A1,1 0 0,1 23,15V18A1,1 0 0,1 22,19H21V20A2,2 0 0,1 19,22H5A2,2 0 0,1 3,20V19H2A1,1 0 0,1 1,18V15A1,1 0 0,1 2,14H3A7,7 0 0,1 10,7H11V5.73C10.4,5.39 10,4.74 10,4A2,2 0 0,1 12,2M7.5,13A2.5,2.5 0 0,0 5,15.5A2.5,2.5 0 0,0 7.5,18A2.5,2.5 0 0,0 10,15.5A2.5,2.5 0 0,0 7.5,13M16.5,13A2.5,2.5 0 0,0 14,15.5A2.5,2.5 0 0,0 16.5,18A2.5,2.5 0 0,0 19,15.5A2.5,2.5 0 0,0 16.5,13Z" /></svg>
</div>
</div>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="./js/index.js"></script>
</body>
</html>