From 6877ca30a135278aeaaff35416f1d9c26582ff9d Mon Sep 17 00:00:00 2001
From: Adrian Simmons <adrian@perlucida.co.uk>
Date: Mon, 8 Nov 2021 13:48:54 +0000
Subject: [PATCH] Move dark color for modal close icon into scoped styles

---
 src/styles/variables/colors.scss        | 5 -----
 src/views/tasks/TaskDetailViewModal.vue | 7 +++++++
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/styles/variables/colors.scss b/src/styles/variables/colors.scss
index ac6eff38c..ffbc6256e 100644
--- a/src/styles/variables/colors.scss
+++ b/src/styles/variables/colors.scss
@@ -94,10 +94,5 @@
     --text-invert: #000;
     --text-light: var(--grey-300);
     --text-strong: var(--grey-900);
-
-      // svg uses currentColor, change the color to keep the modal close X visible
-      .close {
-        color: var(--grey-900);
-      }
   }
 }
\ No newline at end of file
diff --git a/src/views/tasks/TaskDetailViewModal.vue b/src/views/tasks/TaskDetailViewModal.vue
index 21f724625..507e1d566 100644
--- a/src/views/tasks/TaskDetailViewModal.vue
+++ b/src/views/tasks/TaskDetailViewModal.vue
@@ -60,4 +60,11 @@ export default {
 		color: var(--dark);
 	}
 }
+
+/* Close icon SVG uses currentColor, change the color to keep it visible */
+@media (prefers-color-scheme: dark) {
+	.close {
+		color: var(--grey-900);
+	}
+}
 </style>
\ No newline at end of file