gitproject/index.html at master · Tomkndn/gitproject · 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>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>My Digital Clock</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet"
    integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
  <link rel="stylesheet" href="clock.css">
</head>

<body>
  <div id="time">
    <div class="circle" style="--clr : #fea10a;"">
      <div class="dots hr_dot"></div>
      <svg>
        <circle cx="70" cy="70" r="70"></circle>
        <circle cx="70" cy="70" r="70" id="hh"></circle>
      </svg>
      <div id="hours">00</div>
    </div>
    <div class="circle" style="--clr : #df0d0d;" >
      <div class="dots mn_dot"></div>
      <svg>
        <circle cx="70" cy="70" r="70"></circle>
        <circle cx="70" cy="70" r="70"id="mm"></circle>
      </svg>
      <div id="minute" >00</div>
    </div>
    <div class="circle" style="--clr : #f703f7;" >
      <div class="dots sc_dot"></div>
      <svg>
        <circle cx="70" cy="70" r="70"></circle>
        <circle cx="70" cy="70" r="70"id="ss"></circle>
      </svg>
      <div id="second">00</div>
    </div>
    <div class="ap">
      <div id="ampm">AM</div>
    </div>
  </div>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"
    integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4"
    crossorigin="anonymous"></script>
  <script src='clock.js'></script>
</body>

</html>