2 changed files with 93 additions and 2 deletions
@ -0,0 +1,74 @@
|
||||
body { |
||||
background-color: #e5e5e5; |
||||
display: flex; |
||||
justify-content: center; |
||||
align-items: center; |
||||
min-height: 100vh; |
||||
} |
||||
|
||||
.clock { |
||||
width: 300px; |
||||
height: 300px; |
||||
background-color: #adadad; |
||||
border-radius: 50%; |
||||
border: 1px solid black; |
||||
position: relative; |
||||
} |
||||
|
||||
.clock .nums { |
||||
--rotation: 0; |
||||
position: absolute; |
||||
width: 100%; |
||||
height: 100%; |
||||
text-align: center; |
||||
transform: rotate(var(--rotation)); |
||||
font-size: medium; |
||||
} |
||||
|
||||
.clock .n01 { |
||||
--rotation: 30deg; |
||||
} |
||||
|
||||
.clock .n02 { |
||||
--rotation: 60deg; |
||||
} |
||||
|
||||
.clock .n03 { |
||||
--rotation: 90deg; |
||||
} |
||||
|
||||
.clock .n04 { |
||||
--rotation: 120deg; |
||||
} |
||||
|
||||
.clock .n05 { |
||||
--rotation: 150deg; |
||||
} |
||||
|
||||
.clock .n06 { |
||||
--rotation: 180deg; |
||||
} |
||||
|
||||
.clock .n07 { |
||||
--rotation: 210deg; |
||||
} |
||||
|
||||
.clock .n08 { |
||||
--rotation: 240deg; |
||||
} |
||||
|
||||
.clock .n09 { |
||||
--rotation: 270deg; |
||||
} |
||||
|
||||
.clock .n10 { |
||||
--rotation: 300deg; |
||||
} |
||||
|
||||
.clock .n11 { |
||||
--rotation: 330deg; |
||||
} |
||||
|
||||
.clock .n12 { |
||||
--rotation: 360deg; |
||||
} |
Loading…
Reference in new issue