TypingGame/Index.html at master · SCJnr/TypingGame · GitHub

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
<!DOCTYPE html>
<head>
    <title>Typr</title>
    <link href="https://fonts.googleapis.com/css?family=Rubik" rel="stylesheet">
    <link rel="stylesheet" href="style.css">
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
    <link rel="shortcut icon" type="image/ico" href="favicon.ico">
    <link rel="stylesheet"
     href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
</head>
<body>
<div class="content">
<div class="nav animated fadeInUp delay-1">
<h1>Typr</h1>
</div>
<div class="container animated fadeInUp delay-2">
<div class="wrapper">
 <h2 id="header">Word</h2>
</div>
<input type="text" id="inp" placeholder=" Start Typing..." autofocus>
<h4 id="message">

</h4>
<div class="timer">Time left:<span id="timing">0</span></div>
<div class="scorer">Score:<span id="score">0</span></div>
</div>
<div class="animated fadeInUp delay-3">
<button class="button"><a href="Index.html">Restart the game</a></button>
</div>
<div class="ruler animated fadeInUp delay-4">
<h5>Rules:</h5>
<p><bold>1.Start typing to initialize the game.</bold></p>
<p><bold>2.When the time ends the game stops and compete the final score with your friends.</bold></p>
</div>
<div class="footer animated fadeInUp delay-5">
<footer>
<div class="acc">
 <a href="#"><i class="fab fa-github-square"></i></a>
 <a href="#"><i class="fab fa-facebook"></i></a>
 <a href="#"><i class="fab fa-codepen"></i></a>
</div>
<div class="copyrights">All rights reserved.Copyright SCjnr.</div>
</footer>
</div>
</div>
<script src="app.js"></script>
</body>
</html>