File tree 3 files changed +59
-0
lines changed
3 files changed +59
-0
lines changed Original file line number Diff line number Diff line change
1
+ setInterval ( ( ) => { // Updating Time
2
+ var date = new Date ( ) ;
3
+ var hour = date . getHours ( ) ; // Fetching Hours
4
+ var minute = date . getMinutes ( ) ; // Fetching Minutes
5
+ var second = date . getSeconds ( ) ; // Fetching Seconds
6
+
7
+ // Adding 0 before each number if the time is less than 0
8
+ hour = hour < 10 ? "0" + hour : hour ;
9
+ minute = minute < 10 ? "0" + minute : minute ;
10
+ second = second < 10 ? "0" + second : second ;
11
+
12
+ document . querySelector ( ".time" ) . innerHTML = hour + " : " + minute + " : " + second ;
13
+ } ) , 1000
Original file line number Diff line number Diff line change
1
+ <!DOCTYPE html>
2
+ < html lang ="en ">
3
+ < head >
4
+ < meta charset ="UTF-8 ">
5
+ < meta http-equiv ="X-UA-Compatible " content ="IE=edge ">
6
+ < meta name ="viewport " content ="width=device-width, initial-scale=1.0 ">
7
+ < link rel ="stylesheet " href ="style.css ">
8
+ < title > Digital Clock</ title >
9
+ </ head >
10
+ < body >
11
+ < div id ="clock ">
12
+ < p class ="time "> </ p >
13
+ </ div >
14
+ < script src ="app.js "> </ script >
15
+ </ body >
16
+ </ html >
Original file line number Diff line number Diff line change
1
+ @import url ('https://fonts.googleapis.com/css2?family=Lato:wght@700&display=swap' );
2
+
3
+ body {
4
+ background : # 121212 ;
5
+ }
6
+
7
+ # clock {
8
+ color : # e2e6e7 ;
9
+ font-family : 'Lato' , sans-serif;
10
+ text-align : center;
11
+ position : absolute;
12
+ left : 50% ;
13
+ top : 50% ;
14
+ transform : translate (-50% , -50% );
15
+ background : # 161515 ;
16
+ display : flex;
17
+ align-items : center;
18
+ justify-content : center;
19
+ padding : 30px ;
20
+ height : 120px ;
21
+ width : 500px ;
22
+ border-width : 4px ;
23
+ border-style : solid;
24
+ border-radius : 1000px ;
25
+ }
26
+
27
+ .time {
28
+ letter-spacing : 0.05em ;
29
+ font-size : 80px ;
30
+ }
You can’t perform that action at this time.
0 commit comments