From 3d1fbe7654e29ba4dd86ec695c1a81e45f1710ec Mon Sep 17 00:00:00 2001
From: Lilla Pulay <pulaylilla@gmail.com>
Date: Wed, 21 Oct 2020 13:31:39 +0200
Subject: [PATCH] Clock hand styling suggestion

Altered the height of minute-hand and hour-hand as to make it easier to distinguish between each hand, like on a real analog clock. (Added border-radius to all hands to change their shape a little - but this is really just a minor personal preference.)
---
 02 - JS and CSS Clock/index-FINISHED.html | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/02 - JS and CSS Clock/index-FINISHED.html b/02 - JS and CSS Clock/index-FINISHED.html
index 04d1a4e40e..bb4a36936b 100644
--- a/02 - JS and CSS Clock/index-FINISHED.html	
+++ b/02 - JS and CSS Clock/index-FINISHED.html	
@@ -60,6 +60,7 @@
       width: 50%;
       height: 6px;
       background: black;
+      border-radius: 50%;
       position: absolute;
       top: 50%;
       transform-origin: 100%;
@@ -67,6 +68,17 @@
       transition: all 0.05s;
       transition-timing-function: cubic-bezier(0.1, 2.7, 0.58, 1);
     }
+    
+    /* Styling each hand differently */
+    .minute-hand {
+      height: 8px;
+    }
+
+    .hour-hand {
+      height: 8px;
+      width: 30%;
+      right: 50%;  
+    }
 </style>
 
 <script>