forked from HughTB/radio-clock
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
52 lines (42 loc) · 1.71 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
<!DOCTYPE html>
<meta charset="UTF-8">
<link rel="stylesheet" href="./style.css">
<title>PureFM Studio Clock</title>
<body>
<img class="logo" src="assets/logo.png">
<section class="clockContainer">
<svg width="100%" height="100%" viewBox="0 0 200 200">
<defs>
<g id="marking">
<line x1="100" y1="0" x2="100" y2="20" />
<line x1="100" y1="200" x2="100" y2="180" />
</g>
<g id="majorMarkings">
<use href="#marking" transform="rotate(0, 100, 100)" />
<use href="#marking" transform="rotate(90, 100, 100)" />
</g>
<g id="minorMarkings">
<use href="#marking" transform="rotate(30, 100, 100)" />
<use href="#marking" transform="rotate(60, 100, 100)" />
<use href="#marking" transform="rotate(120, 100, 100)" />
<use href="#marking" transform="rotate(150, 100, 100)" />
</g>
</defs>
<use href="#majorMarkings" />
<use href="#minorMarkings" />
<line id="hourHand" class="hand" x1="100" y1="50" x2="100" y2="95" />
<line id="minuteHand" class="hand" x1="100" y1="40" x2="100" y2="95" />
<line id="secondHand" class="hand" x1="100" y1="30" x2="100" y2="95" />
</svg>
</section>
<section class="footer">
<p>PureFM Studio Clock | Open Source on GitHub
<p>v1.0 2024-01-07
</section>
<section class="textTimes">
<p id="digiClock"></p>
<p id="wordTime"></p>
<p id="wordDate"></p>
</section>
<script src="clock.js"></script>
</body>