From e8e79a42dc7e75bf5607a25c63bf1337e4440187 Mon Sep 17 00:00:00 2001
From: Sam <sam@samr1.net>
Date: Wed, 20 Dec 2023 13:01:38 +0100
Subject: [PATCH] Client - fix dark mode on chart when browser preferences

---
 .../src/components/Common/StatsChart/Chart.vue     | 14 ++++++++------
 .../Workout/WorkoutDetail/WorkoutChart/index.vue   | 14 ++++++++------
 2 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/fittrackee_client/src/components/Common/StatsChart/Chart.vue b/fittrackee_client/src/components/Common/StatsChart/Chart.vue
index e1779d13..54bc76e7 100644
--- a/fittrackee_client/src/components/Common/StatsChart/Chart.vue
+++ b/fittrackee_client/src/components/Common/StatsChart/Chart.vue
@@ -42,14 +42,16 @@
     () => store.getters[ROOT_STORE.GETTERS.DARK_MODE]
   )
   const lineColors = computed(() => ({
-    color: darkMode.value
-      ? chartsColors.darkMode.line
-      : chartsColors.ligthMode.line,
+    color:
+      darkMode.value !== false
+        ? chartsColors.darkMode.line
+        : chartsColors.ligthMode.line,
   }))
   const textColors = computed(() => ({
-    color: darkMode.value
-      ? chartsColors.darkMode.text
-      : chartsColors.ligthMode.text,
+    color:
+      darkMode.value !== false
+        ? chartsColors.darkMode.text
+        : chartsColors.ligthMode.text,
   }))
 
   const chartData = computed(() => ({
diff --git a/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutChart/index.vue b/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutChart/index.vue
index ebf1edb7..cd56fb5e 100644
--- a/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutChart/index.vue
+++ b/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutChart/index.vue
@@ -118,14 +118,16 @@
     () => datasets.value.coordinates
   )
   const lineColors = computed(() => ({
-    color: darkMode.value
-      ? chartsColors.darkMode.line
-      : chartsColors.ligthMode.line,
+    color:
+      darkMode.value !== false
+        ? chartsColors.darkMode.line
+        : chartsColors.ligthMode.line,
   }))
   const textColors = computed(() => ({
-    color: darkMode.value
-      ? chartsColors.darkMode.text
-      : chartsColors.ligthMode.text,
+    color:
+      darkMode.value !== false
+        ? chartsColors.darkMode.text
+        : chartsColors.ligthMode.text,
   }))
 
   const options = computed<ChartOptions<'line'>>(() => ({