From 2121b92c817fe9260cc8e65519b9a222e7daae3e Mon Sep 17 00:00:00 2001
From: Oliver-Akins <Tyler.Akins1999@gmail.com>
Date: Mon, 26 Oct 2020 22:34:13 -0600
Subject: [PATCH] Make modals abide by the CSS variables

---
 src/components/modals/DetailedTrack.vue  | 1 +
 src/components/modals/FeaturesInfo.vue   | 1 +
 src/components/modals/PopularityInfo.vue | 1 +
 src/components/modals/ShareTrack.vue     | 1 +
 4 files changed, 4 insertions(+)

diff --git a/src/components/modals/DetailedTrack.vue b/src/components/modals/DetailedTrack.vue
index 2f69b66..f7065c9 100644
--- a/src/components/modals/DetailedTrack.vue
+++ b/src/components/modals/DetailedTrack.vue
@@ -162,6 +162,7 @@ export default {
 	background-color: var(--modal-background);
 	border-radius: var(--corner-rounding);
 	padding: 0 15px 15px 15px;
+	color: var(--modal-text);
 	overflow-y: auto;
 	max-height: 85%;
 	z-index: 11;
diff --git a/src/components/modals/FeaturesInfo.vue b/src/components/modals/FeaturesInfo.vue
index b62c91d..c8130be 100644
--- a/src/components/modals/FeaturesInfo.vue
+++ b/src/components/modals/FeaturesInfo.vue
@@ -155,6 +155,7 @@ export default {
 	background-color: var(--modal-background);
 	border-radius: var(--corner-rounding);
 	padding: 0 15px 15px 15px;
+	color: var(--modal-text);
 	text-align: center;
 	overflow-y: auto;
 	max-height: 85%;
diff --git a/src/components/modals/PopularityInfo.vue b/src/components/modals/PopularityInfo.vue
index 246cfdd..e930b9c 100644
--- a/src/components/modals/PopularityInfo.vue
+++ b/src/components/modals/PopularityInfo.vue
@@ -55,6 +55,7 @@ export default {
 .modal {
 	background-color: var(--modal-background);
 	border-radius: var(--corner-rounding);
+	color: var(--modal-text);
 	text-align: center;
 	max-height: 85%;
 	padding: 0 15px;
diff --git a/src/components/modals/ShareTrack.vue b/src/components/modals/ShareTrack.vue
index 57be72a..24eb48d 100644
--- a/src/components/modals/ShareTrack.vue
+++ b/src/components/modals/ShareTrack.vue
@@ -73,6 +73,7 @@ export default {
 	background-color: var(--modal-background);
 	border-radius: var(--corner-rounding);
 	padding: 0 15px 15px 15px;
+	color: var(--modal-text);
 	text-align: center;
 	max-height: 85%;
 	z-index: 11;