From e40fcc48d424492865c1745ec01cbe87ca2a2d2b Mon Sep 17 00:00:00 2001
From: DalpatRathore <69510006+DalpatRathore@users.noreply.github.com>
Date: Mon, 2 May 2022 22:39:49 +0530
Subject: [PATCH] fix: clock flicker & color contrast

---
 src/plays/clock/clock.css | 34 +++++++++++++++++++++++++++++-----
 1 file changed, 29 insertions(+), 5 deletions(-)

diff --git a/src/plays/clock/clock.css b/src/plays/clock/clock.css
index 86dad2b6e2..077264a57b 100644
--- a/src/plays/clock/clock.css
+++ b/src/plays/clock/clock.css
@@ -1,8 +1,32 @@
 .counter .value {
-  background: #f7f705;
-  padding: 1rem;
-  font-size: 3.5rem;
+  background: linear-gradient(0deg, #b9740b,rgb(173, 134, 16));
+  color: #ddd;
+  width: 280px;
+  padding: .5rem;
+  letter-spacing: 1px;
+  font-weight: bolder;
+  font-size: 2.5rem;
   border-radius: 5px;
-  text-shadow: 2px 2px 5px red;
-  box-shadow: 10px 10px #aea103;
+  text-shadow: 1px 1px 3px #111;
+  box-shadow: 5px 5px #ffa500;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+@media (min-width: 550px){
+  .counter .value {  
+    width: 450px;
+    padding: 1rem;
+    letter-spacing: 2px;
+    font-size: 4rem;
+    border-radius: 5px;
+    text-shadow: 2px 2px 5px #111;
+    box-shadow: 10px 10px #ffa500;
+  }
+}
+
+.counter .value  span{
+  font-family: monospace;
+
 }