From b7e63fb530643c70ecfe49b3695cbaa20b020629 Mon Sep 17 00:00:00 2001
From: Tyler Brown Cifu Shuster <tyler@fivepaths.com>
Date: Thu, 8 Oct 2020 08:37:47 -0700
Subject: [PATCH] clock: differentiate date and time colors

---
 .../src/views/apps/launch/components/tiles/clock.js  | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/pkg/interface/src/views/apps/launch/components/tiles/clock.js b/pkg/interface/src/views/apps/launch/components/tiles/clock.js
index 65393b1d0..8394adea0 100644
--- a/pkg/interface/src/views/apps/launch/components/tiles/clock.js
+++ b/pkg/interface/src/views/apps/launch/components/tiles/clock.js
@@ -14,18 +14,20 @@ const innerSize = 124; // clock size
 //   }
 // }
 
-let text = '#000000', background = '#ffffff';
+let timeTextColor = '#000000', dateTextColor = '#333333', background = '#ffffff';
 
 const dark = window.matchMedia('(prefers-color-scheme: dark)');
 
 if (dark.matches) {
-  text = '#7f7f7f';
+  timeTextColor = '#ffffff';
+  dateTextColor = '#7f7f7f';
   background = '#333';
 }
 
 function darkColors(dark) {
   if (dark.matches) {
-    text = '#7f7f7f';
+    timeTextColor = '#ffffff';
+    dateTextColor = '#7f7f7f';
     background = '#ffffff';
   }
  }
@@ -344,10 +346,10 @@ class Clock extends React.Component {
       : moment().format('h:mm A');
     const dateText = moment().format('MMM Do');
     ctx.textAlign = 'center';
-    ctx.fillStyle = text;
+    ctx.fillStyle = timeTextColor;
     ctx.font = '12px Inter';
     ctx.fillText(timeText, ctr, ctr + 6 - 7);
-    ctx.fillStyle = text;
+    ctx.fillStyle = dateTextColor;
     ctx.font = '12px Inter';
     ctx.fillText(dateText, ctr, ctr + 6 + 7);