From 37cf7a7908756cc229a9491bf7bb2bdf3355ea3d Mon Sep 17 00:00:00 2001
From: Cassidy Williams <1454517+cassidoo@users.noreply.github.com>
Date: Sat, 11 Feb 2023 23:30:17 -0600
Subject: [PATCH] Add dark mode color scheme based on media preferences

---
 src/style/global.css | 31 +++++++++++++++++++++++++------
 1 file changed, 25 insertions(+), 6 deletions(-)

diff --git a/src/style/global.css b/src/style/global.css
index e013da4..5d9b5bc 100644
--- a/src/style/global.css
+++ b/src/style/global.css
@@ -36,14 +36,17 @@ button {
 	font-family: "Roboto Mono", monospace;
 }
 h1,
+strong,
+b {
+	color: var(--black);
+}
+
 h2,
 h3,
 h4,
 h5,
-h6,
-strong,
-b {
-	color: var(--black);
+h6 {
+	color: var(--gray);
 }
 
 body.dark-mode,
@@ -56,7 +59,24 @@ button.dark-mode button {
 	color: var(--white);
 }
 body.dark-mode nav {
-	background: rgba(0, 0, 0, 0.9);
+	background: rgba(0, 0, 0, 0.7);
+}
+
+@media (prefers-color-scheme: dark) {
+	html,
+	body,
+	body button,
+	body h1,
+	body .go-home {
+		background: var(--black);
+		color: var(--white);
+	}
+	body nav {
+		background: rgba(0, 0, 0, 0.7);
+	}
+	body code {
+		background-color: #333;
+	}
 }
 
 header {
@@ -158,7 +178,6 @@ h1 {
 }
 
 h2 {
-	color: var(--gray);
 	font-weight: 300;
 	margin: 0 0 0.5em 0;
 }