From c39153f1a0bc7ea944a568556dc626ca38331010 Mon Sep 17 00:00:00 2001
From: Jerel Miller <jerelmiller@gmail.com>
Date: Tue, 30 Jun 2020 16:41:19 -0700
Subject: [PATCH] feat: Update callouts to handle dark mode

---
 src/components/Callouts.module.scss | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/components/Callouts.module.scss b/src/components/Callouts.module.scss
index c604938bd..c79fefc4f 100644
--- a/src/components/Callouts.module.scss
+++ b/src/components/Callouts.module.scss
@@ -3,23 +3,35 @@
 .tip {
   padding: 1.25rem 0.3rem 1.25rem 1.25rem;
   margin: 1.55rem 3rem 1.55rem 1.25rem;
-  color: var(--color-neutrals-900);
+  color: var(--primary-text-color);
 
   h4 {
     font-size: 0.75rem !important;
     text-transform: uppercase;
-    color: var(--color-neutrals-800);
+    color: var(--heading-text-color);
   }
 }
 .caution {
   border-left: 4px solid var(--color-red-400);
   background: var(--color-red-100);
+
+  :global(.dark-mode) & {
+    background: var(--color-red-900);
+  }
 }
 .important {
   border-left: 4px solid var(--color-yellow-400);
   background: var(--color-yellow-100);
+
+  :global(.dark-mode) & {
+    background: var(--color-yellow-900);
+  }
 }
 .tip {
   border-left: 4px solid var(--color-green-400);
   background: var(--color-green-100);
+
+  :global(.dark-mode) & {
+    background: var(--color-green-900);
+  }
 }