-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
68 lines (68 loc) · 1.9 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css.css">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<title>What the style?!</title>
</head>
<body>
<div class="main">
<div class="block">
<a href="https://timhaj.github.io/WhatTheStyle/color.html">
<div class="content">
<p class="selection">Guess the color</p>
<div class="circle" id="krogec"></div>
</div>
</a>
</div>
<div class="block">
<a href="https://timhaj.github.io/WhatTheStyle/font.html">
<div class="content">
<p class="selection">Guess the font</p>
<p class="font" id="tekstovniElement">Sample</p>
</div>
</a>
</div>
</div>
<script>
let color = "#";
let available = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F"];
let fonts = [
"Arial",
"Verdana",
"Georgia",
"Times New Roman",
"Courier New",
"Tahoma",
"Helvetica",
"Courier",
"Arial Black",
"Comic Sans MS",
"Trebuched MS",
"Garamond",
"Courier New",
"Brush Script MT",
"Luminari",
"Bradley Hand",
"Monaco",
"Lucida",
"Baskerville",
"Palatino",
"Gill Sans",
"Impact",
"Calibri",
"Cambria",
"Candara",
"Century Gothic",
"Consolas",
];
for (let i = 0; i < 6; i++) {
color += available[Math.floor(Math.random() * available.length)]
}
document.getElementById("krogec").style.backgroundColor = color;
document.getElementById("tekstovniElement").style.fontFamily = fonts[Math.floor(Math.random() * fonts.length)];
</script>
</body>
</html>