Skip to content

Commit 2ba2283

Browse files
committed
Add styles
1 parent c726793 commit 2ba2283

File tree

1 file changed

+65
-0
lines changed

1 file changed

+65
-0
lines changed

Source-Code/AnalogWatch/style.css

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
body {
2+
display: flex;
3+
justify-content: center;
4+
align-items: center;
5+
height: 100vh;
6+
background: #f0f0f0;
7+
margin: 0;
8+
}
9+
10+
.clock {
11+
position: relative;
12+
width: 300px;
13+
height: 300px;
14+
border: 10px solid #333;
15+
border-radius: 50%;
16+
background: white;
17+
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
18+
}
19+
20+
.hand {
21+
position: absolute;
22+
background: #333;
23+
border-radius: 50%;
24+
transform-origin: bottom;
25+
transform: rotate(90deg);
26+
transition: transform 0.5s cubic-bezier(0.4, 2.3, 0.3, 1);
27+
}
28+
29+
.hour {
30+
width: 6px;
31+
height: 80px;
32+
left: 50%;
33+
top: 50%;
34+
transform: translateX(-50%);
35+
background: #333;
36+
}
37+
38+
.minute {
39+
width: 4px;
40+
height: 110px;
41+
left: 50%;
42+
top: 50%;
43+
transform: translateX(-50%);
44+
background: #666;
45+
}
46+
47+
.second {
48+
width: 2px;
49+
height: 120px;
50+
left: 50%;
51+
top: 50%;
52+
transform: translateX(-50%);
53+
background: red;
54+
}
55+
56+
.center {
57+
position: absolute;
58+
width: 14px;
59+
height: 14px;
60+
background: #333;
61+
border-radius: 50%;
62+
left: 50%;
63+
top: 50%;
64+
transform: translate(-50%, -50%);
65+
}

0 commit comments

Comments
 (0)