From d6b319e6a53d13d721113867cb059e7dddb94baf Mon Sep 17 00:00:00 2001
From: Joshua Coles <josh@coles.to>
Date: Wed, 28 Feb 2024 16:49:10 +0000
Subject: [PATCH] Colour weekends differently by default

---
 src/components/HeatMap.tsx | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/HeatMap.tsx b/src/components/HeatMap.tsx
index c9aa32b..7916d7a 100644
--- a/src/components/HeatMap.tsx
+++ b/src/components/HeatMap.tsx
@@ -40,33 +40,33 @@ function GitHubCalendarHeatmap({
     const dayGoalTime = goal;
     const weekGoalTime = 5 * dayGoalTime;
 
-    const getColorForValue = (value: number, goalTime: number): string => {
+    const getColorForValue = (value: number, goalTime: number, zeroColor: string): string => {
         const buckets = [
             {
                 min: -Infinity,
                 max: 0,
-                color: '#eeeeee'
+                color: zeroColor,
             },
             {
                 min: 0,
                 max: 0.40,
-                color: '#d6e685'
+                color: '#d6e685',
             },
             {
                 min: 0.40,
                 max: 0.50,
-                color: '#8cc665'
+                color: '#8cc665',
             },
             {
                 min: 0.50,
                 max: 0.90,
-                color: '#44a340'
+                color: '#44a340',
             },
             {
                 min: 0.90,
                 // If penalising overtime, the max is 1.125, otherwise it's infinity (ie this is the last bucket)
                 max: penaliseOvertime ? 1.125 : Infinity,
-                color: '#1e6823'
+                color: '#1e6823',
             },
             {
                 min: 1.125,
@@ -116,7 +116,7 @@ function GitHubCalendarHeatmap({
                 const dayOfWeek = (date.getDay() + 6) % 7;
                 const x = weekIndex * (squareSize + padding);
                 const y = dayOfWeek * (squareSize + padding);
-                const color = getColorForValue(count, dayGoalTime);
+                const color = getColorForValue(count, dayGoalTime, dFns.isWeekend(date) ? '#d4d4d4' : '#eeeeee');
 
                 return (
                     <rect
@@ -137,7 +137,7 @@ function GitHubCalendarHeatmap({
                     const x = weekIndex * (squareSize + padding);
                     const y = 7 * (squareSize + padding) + weekTotalPadding; // Position for the week total
                     const count = getWeekTotal(weekIndex);
-                    const color = getColorForValue(count, weekGoalTime);
+                    const color = getColorForValue(count, weekGoalTime, '#eeeeee');
 
                     return (
                         <rect