-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
78 lines (74 loc) · 6.83 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Digital-Clock with jQuery</title>
<meta name="keywords" content="html, css, js, jQuery">
<meta name="author" content="Chernogorov Viacheslav">
<meta name="description" content="Digital Clock">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap"
rel="stylesheet" />
<link rel="stylesheet" href="./sass/style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body class="page">
<header class="header">
<h1>Digital Clock</h1>
</header>
<main class="clock">
<h2 class="clock__title animate-charcter">This is the current time</h2>
<div class="clock__time">
<span>Hours</span>
<span class="clock__hour" id="hours">00</span>
</div>
<div class="clock__time">
<span>Minute</span>
<span class="clock__min" id="min">00</span>
</div>
<div class="clock__time">
<span>Second</span>
<span class="clock__sec" id="sec">00</span>
</div>
<div class="clock__time">
<span>Meridiem</span>
<span class="clock__meridiem" id="meridiem">AM</span>
</div>
</main>
<footer class="footer">
<nav class="footer__links">
<a href="https://github.com/ChernoSlava" target="_blank" class="github">
<?xml version="1.0"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="100px" height="100px">
<path
d="M17.791,46.836C18.502,46.53,19,45.823,19,45v-5.4c0-0.197,0.016-0.402,0.041-0.61C19.027,38.994,19.014,38.997,19,39 c0,0-3,0-3.6,0c-1.5,0-2.8-0.6-3.4-1.8c-0.7-1.3-1-3.5-2.8-4.7C8.9,32.3,9.1,32,9.7,32c0.6,0.1,1.9,0.9,2.7,2c0.9,1.1,1.8,2,3.4,2 c2.487,0,3.82-0.125,4.622-0.555C21.356,34.056,22.649,33,24,33v-0.025c-5.668-0.182-9.289-2.066-10.975-4.975 c-3.665,0.042-6.856,0.405-8.677,0.707c-0.058-0.327-0.108-0.656-0.151-0.987c1.797-0.296,4.843-0.647,8.345-0.714 c-0.112-0.276-0.209-0.559-0.291-0.849c-3.511-0.178-6.541-0.039-8.187,0.097c-0.02-0.332-0.047-0.663-0.051-0.999 c1.649-0.135,4.597-0.27,8.018-0.111c-0.079-0.5-0.13-1.011-0.13-1.543c0-1.7,0.6-3.5,1.7-5c-0.5-1.7-1.2-5.3,0.2-6.6 c2.7,0,4.6,1.3,5.5,2.1C21,13.4,22.9,13,25,13s4,0.4,5.6,1.1c0.9-0.8,2.8-2.1,5.5-2.1c1.5,1.4,0.7,5,0.2,6.6c1.1,1.5,1.7,3.2,1.6,5 c0,0.484-0.045,0.951-0.11,1.409c3.499-0.172,6.527-0.034,8.204,0.102c-0.002,0.337-0.033,0.666-0.051,0.999 c-1.671-0.138-4.775-0.28-8.359-0.089c-0.089,0.336-0.197,0.663-0.325,0.98c3.546,0.046,6.665,0.389,8.548,0.689 c-0.043,0.332-0.093,0.661-0.151,0.987c-1.912-0.306-5.171-0.664-8.879-0.682C35.112,30.873,31.557,32.75,26,32.969V33 c2.6,0,5,3.9,5,6.6V45c0,0.823,0.498,1.53,1.209,1.836C41.37,43.804,48,35.164,48,25C48,12.318,37.683,2,25,2S2,12.318,2,25 C2,35.164,8.63,43.804,17.791,46.836z" />
</svg>
</a>
<a href="https://www.linkedin.com/in/slava-chernogorov-063760239/" target="_blank" class="linkedIn">
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
<svg fill="#000000" height="100px" width="100px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 455 455" xml:space="preserve">
<g>
<path style="fill-rule:evenodd;clip-rule:evenodd;"
d="M246.4,204.35v-0.665c-0.136,0.223-0.324,0.446-0.442,0.665H246.4z" />
<path style="fill-rule:evenodd;clip-rule:evenodd;" d="M0,0v455h455V0H0z M141.522,378.002H74.016V174.906h67.506V378.002z
M107.769,147.186h-0.446C84.678,147.186,70,131.585,70,112.085c0-19.928,15.107-35.087,38.211-35.087
c23.109,0,37.31,15.159,37.752,35.087C145.963,131.585,131.32,147.186,107.769,147.186z M385,378.002h-67.524V269.345
c0-27.291-9.756-45.92-34.195-45.92c-18.664,0-29.755,12.543-34.641,24.693c-1.776,4.34-2.24,10.373-2.24,16.459v113.426h-67.537
c0,0,0.905-184.043,0-203.096H246.4v28.779c8.973-13.807,24.986-33.547,60.856-33.547c44.437,0,77.744,29.02,77.744,91.398V378.002
z" />
</g>
</svg>
</a>
<a href="https://www.instagram.com/chernoslava/" target="_blank" class="insta">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100px" height="100px">
<path
d="M 31 17 C 23.27961 17 17 23.27961 17 31 L 17 69 C 17 76.72039 23.27961 83 31 83 L 69 83 C 76.72039 83 83 76.72039 83 69 L 83 31 C 83 23.27961 76.72039 17 69 17 L 31 17 z M 31 19 L 69 19 C 75.63961 19 81 24.36039 81 31 L 81 69 C 81 75.63961 75.63961 81 69 81 L 31 81 C 24.36039 81 19 75.63961 19 69 L 19 31 C 19 24.36039 24.36039 19 31 19 z M 40 26 C 32.28482 26 26 32.28482 26 40 L 26 60 C 26 67.71518 32.28482 74 40 74 L 60 74 C 67.71518 74 74 67.71518 74 60 L 74 40 C 74 32.28482 67.71518 26 60 26 L 40 26 z M 40 27 L 60 27 C 67.17282 27 73 32.82718 73 40 L 73 60 C 73 67.17282 67.17282 73 60 73 L 40 73 C 32.82718 73 27 67.17282 27 60 L 27 40 C 27 32.82718 32.82718 27 40 27 z M 40 30 C 34.490777 30 30 34.490777 30 40 L 30 60 C 30 65.509223 34.490777 70 40 70 L 60 70 C 65.509223 70 70 65.509223 70 60 L 70 40 C 70 34.490777 65.509223 30 60 30 L 40 30 z M 40 31 L 60 31 C 64.966777 31 69 35.033223 69 40 L 69 60 C 69 64.966777 64.966777 69 60 69 L 40 69 C 35.033223 69 31 64.966777 31 60 L 31 40 C 31 35.033223 35.033223 31 40 31 z M 62.5 34 C 61.375 34 60.468589 34.439878 59.876953 35.105469 C 59.285317 35.77106 59 36.638889 59 37.5 C 59 38.361111 59.285317 39.22894 59.876953 39.894531 C 60.468589 40.560122 61.375 41 62.5 41 C 63.625 41 64.531411 40.560122 65.123047 39.894531 C 65.714683 39.22894 66 38.361111 66 37.5 C 66 36.638889 65.714683 35.77106 65.123047 35.105469 C 64.531411 34.439878 63.625 34 62.5 34 z M 62.5 35 C 63.375 35 63.96859 35.310122 64.376953 35.769531 C 64.785317 36.22894 65 36.861111 65 37.5 C 65 38.138889 64.785317 38.77106 64.376953 39.230469 C 63.96859 39.689878 63.375 40 62.5 40 C 61.625 40 61.03141 39.689878 60.623047 39.230469 C 60.214683 38.77106 60 38.138889 60 37.5 C 60 36.861111 60.214683 36.22894 60.623047 35.769531 C 61.03141 35.310122 61.625 35 62.5 35 z M 50 38 C 43.378501 38 38 43.378506 38 50 C 38 56.621494 43.378501 62 50 62 C 56.621499 62 62 56.621494 62 50 C 62 43.378506 56.621499 38 50 38 z M 50 39 C 56.081059 39 61 43.918945 61 50 C 61 56.081055 56.081059 61 50 61 C 43.918941 61 39 56.081055 39 50 C 39 43.918945 43.918941 39 50 39 z M 50 42 C 45.587642 42 42 45.587645 42 50 C 42 54.412355 45.587642 58 50 58 C 54.412358 58 58 54.412355 58 50 C 58 45.587645 54.412358 42 50 42 z M 50 43 C 53.871919 43 57 46.128084 57 50 C 57 53.871916 53.871919 57 50 57 C 46.128081 57 43 53.871916 43 50 C 43 46.128084 46.128081 43 50 43 z" />
</svg>
</a>
</nav>
</footer>
</body>
<script src="./js/main.js"></script>
</html>