From 4df219161cb2bd66575305661382130d53a5725b Mon Sep 17 00:00:00 2001
From: Mark McDowall <mark@mcdowall.ca>
Date: Wed, 24 Jul 2019 20:08:26 -0700
Subject: [PATCH] New: Dim episode/air time on calendar

---
 frontend/src/Calendar/Events/CalendarEvent.css      | 9 ++++++++-
 frontend/src/Calendar/Events/CalendarEvent.js       | 2 +-
 frontend/src/Calendar/Events/CalendarEventGroup.css | 2 ++
 frontend/src/Styles/Variables/colors.js             | 1 +
 4 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/frontend/src/Calendar/Events/CalendarEvent.css b/frontend/src/Calendar/Events/CalendarEvent.css
index 4ebc8bc12..9acf6dcf5 100644
--- a/frontend/src/Calendar/Events/CalendarEvent.css
+++ b/frontend/src/Calendar/Events/CalendarEvent.css
@@ -16,10 +16,13 @@
   display: flex;
 }
 
+.episodeInfo {
+  color: $calendarTextDim;
+}
+
 .seriesTitle,
 .episodeTitle {
   @add-mixin truncate;
-
   flex: 1 0 1px;
   margin-right: 10px;
 }
@@ -37,6 +40,10 @@
   margin-left: 3px;
 }
 
+.airTime {
+  color: $calendarTextDim;
+}
+
 /*
  * Status
  */
diff --git a/frontend/src/Calendar/Events/CalendarEvent.js b/frontend/src/Calendar/Events/CalendarEvent.js
index d76e6da3f..21cddeb5b 100644
--- a/frontend/src/Calendar/Events/CalendarEvent.js
+++ b/frontend/src/Calendar/Events/CalendarEvent.js
@@ -200,7 +200,7 @@ class CalendarEvent extends Component {
               </div>
           }
 
-          <div>
+          <div className={styles.airTime}>
             {formatTime(airDateUtc, timeFormat)} - {formatTime(endTime.toISOString(), timeFormat, { includeMinuteZero: true })}
           </div>
         </Link>
diff --git a/frontend/src/Calendar/Events/CalendarEventGroup.css b/frontend/src/Calendar/Events/CalendarEventGroup.css
index 2385409e2..e5be0fd92 100644
--- a/frontend/src/Calendar/Events/CalendarEventGroup.css
+++ b/frontend/src/Calendar/Events/CalendarEventGroup.css
@@ -22,10 +22,12 @@
 
 .airTime {
   flex: 1 0 1px;
+  color: $calendarTextDim;
 }
 
 .episodeInfo {
   margin-left: 10px;
+  color: $calendarTextDim;
 }
 
 .absoluteEpisodeNumber {
diff --git a/frontend/src/Styles/Variables/colors.js b/frontend/src/Styles/Variables/colors.js
index 8a381eae2..eb006d235 100644
--- a/frontend/src/Styles/Variables/colors.js
+++ b/frontend/src/Styles/Variables/colors.js
@@ -175,6 +175,7 @@ module.exports = {
 
   calendarTodayBackgroundColor: '#ddd',
   calendarBorderColor: '#cecece',
+  calendarTextDim: '#666',
 
   //
   // Table