From 58236fe4d50e532ec7ebc6749668464d83d0fa6b Mon Sep 17 00:00:00 2001
From: Matthew Landauer <mlandauer@gmail.com>
Date: Mon, 18 Sep 2023 02:59:12 +0000
Subject: [PATCH] Set the text and background colour for dark-mode

---
 maizzle/src/templates/reset-password.html | 8 ++++----
 maizzle/tailwind.config.js                | 1 +
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/maizzle/src/templates/reset-password.html b/maizzle/src/templates/reset-password.html
index 2a760074a..5f806ae32 100644
--- a/maizzle/src/templates/reset-password.html
+++ b/maizzle/src/templates/reset-password.html
@@ -1,11 +1,11 @@
 ---
 title: Reset password instructions
 preheader: "Please click the button below and follow the instructions. We'll have you up and running with a new password in no time."
-bodyClass: bg-white
+bodyClass: bg-white dark-mode:bg-black
 ---
 
 <x-main>
-  <div class="font-sans text-lg sm:px-4 text-navy">
+  <div class="font-sans text-lg sm:px-4 text-navy dark-mode:text-white">
     <table align="center">
       <tr>
         <td class="w-[552px] max-w-full">
@@ -63,13 +63,13 @@ <h1 class="m-0 text-4xl font-extrabold text-white xs:text-2xl">Planning Alerts</
           <x-divider space-y="32px" class="bg-slate-200" />
 
           <p>
-            <a href="https://www.planningalerts.org.au" class="no-underline text-navy hover:underline"><strong>Planning Alerts</strong></a>
+            <a href="https://www.planningalerts.org.au" class="no-underline text-navy dark-mode:text-white hover:underline"><strong>Planning Alerts</strong></a>
             is a free service where anyone can find out what is being built and knocked down in their area.
           </p>
           <p>
             The service
             is run by the independent charity
-            <a href="https://www.oaf.org.au/" class="no-underline text-navy hover:underline">OpenAustralia Foundation</a>.
+            <a href="https://www.oaf.org.au/" class="no-underline text-navy dark-mode:text-white hover:underline">OpenAustralia Foundation</a>.
           </p>
 
           <p>
diff --git a/maizzle/tailwind.config.js b/maizzle/tailwind.config.js
index 4fbd96ef0..b18e34b1b 100644
--- a/maizzle/tailwind.config.js
+++ b/maizzle/tailwind.config.js
@@ -4,6 +4,7 @@ module.exports = {
     screens: {
       sm: {max: '600px'},
       xs: {max: '425px'},
+      "dark-mode": { raw: "(prefers-color-scheme: dark)" }
     },
     extend: {
       colors: {