From 91af2c68d8b38f10d43324df4ff61fcff5e8da73 Mon Sep 17 00:00:00 2001
From: Thijn <Thijn@conduction.nl>
Date: Tue, 13 Aug 2024 17:15:47 +0200
Subject: [PATCH] Auto detect light or dark mode for the graphs

---
 src/views/dashboard/DashboardIndex.vue | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/src/views/dashboard/DashboardIndex.vue b/src/views/dashboard/DashboardIndex.vue
index 4ffd6686..c3697866 100644
--- a/src/views/dashboard/DashboardIndex.vue
+++ b/src/views/dashboard/DashboardIndex.vue
@@ -95,7 +95,7 @@ export default {
 				month: {
 					options: {
 						theme: {
-							mode: 'dark',
+							mode: this.getTheme(),
 							monochrome: {
 								enabled: true,
 								color: '#079cff',
@@ -130,7 +130,7 @@ export default {
 				hour: {
 					options: {
 						theme: {
-							mode: 'dark',
+							mode: this.getTheme(),
 							monochrome: {
 								enabled: true,
 								color: '#079cff',
@@ -168,7 +168,7 @@ export default {
 				month: {
 					options: {
 						theme: {
-							mode: 'dark',
+							mode: this.getTheme(),
 							monochrome: {
 								enabled: true,
 								color: '#079cff',
@@ -215,6 +215,17 @@ export default {
 	mounted() {
 		searchStore.getSearchResults()
 	},
+	methods: {
+		getTheme() {
+			if (document.body.hasAttribute('data-theme-light')) {
+				return 'light'
+			}
+			if (document.body.hasAttribute('data-theme-default')) {
+				return window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark'
+			}
+			return 'dark'
+		},
+	},
 }
 </script>