From d0cfbd8ced3ffefd267e269c90d03099f1c587d8 Mon Sep 17 00:00:00 2001
From: DutchEllie <personal@quenten.nl>
Date: Tue, 5 Jul 2022 16:05:46 +0200
Subject: [PATCH] Forgot music selection modal

---
 src/app.html                                   | 2 +-
 src/components/misc/musicselectionmodal.svelte | 8 ++++----
 tailwind.config.cjs                            | 2 +-
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/app.html b/src/app.html
index 954fdcc..8be746b 100644
--- a/src/app.html
+++ b/src/app.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="dark">
 	<head>
 		<meta charset="utf-8" />
 		<link rel="icon" href="%sveltekit.assets%/favicon.png" />
diff --git a/src/components/misc/musicselectionmodal.svelte b/src/components/misc/musicselectionmodal.svelte
index fcef1c1..874f78a 100644
--- a/src/components/misc/musicselectionmodal.svelte
+++ b/src/components/misc/musicselectionmodal.svelte
@@ -37,8 +37,8 @@
 		}}
 		class="h-screen w-screen bg-opacity-60 bg-black fixed top-0 left-0 z-10 py-20 "
 	>
-		<div on:click|stopPropagation class="h-full w-3/4 bg-red-100 mx-auto rounded-xl pb-3  overflow-y-auto">
-			<div class="bg-indigo-200 rounded-t-xl p-3">
+		<div on:click|stopPropagation class="h-full w-3/4 bg-red-100 dark:bg-slate-800 dark:text-slate-200 mx-auto rounded-xl pb-3  overflow-y-auto">
+			<div class="bg-indigo-200 dark:bg-slate-700 rounded-t-xl p-3">
 				<span
 					on:click={() => {
 						showMusicMan = true;
@@ -51,7 +51,7 @@
 						on:click={() => {
 							setSong(v);
 						}}
-						class="mt-3 hover:cursor-pointer underline max-w-full shadow-lg hover:shadow-xl w-max bg-indigo-100 p-2 rounded-md"
+						class="mt-3 hover:cursor-pointer underline max-w-full shadow-lg hover:shadow-xl w-max bg-indigo-100 dark:bg-gray-600 p-2 rounded-md"
 					>
 						{v.musicArtist} - {v.musicTitle}
 					</ul>
@@ -65,7 +65,7 @@
 								musicUrl: '/assets/music/MUUUSIC-MAN!.opus'
 							});
 						}}
-						class="mt-3 hover:cursor-pointer underline max-w-full shadow-lg hover:shadow-xl w-max bg-indigo-100 p-2 rounded-md"
+						class="mt-3 hover:cursor-pointer underline max-w-full shadow-lg hover:shadow-xl w-max bg-indigo-100 dark:bg-gray-600 p-2 rounded-md"
 					>
 						MUSIC MAN!!
 					</ul>
diff --git a/tailwind.config.cjs b/tailwind.config.cjs
index 4f64173..ab5c894 100644
--- a/tailwind.config.cjs
+++ b/tailwind.config.cjs
@@ -2,7 +2,7 @@ const defaultTheme = require('tailwindcss/defaultTheme')
 /** @type {import('tailwindcss').Config} */
 module.exports = {
   content: ['./src/**/*.{html,js,svelte,ts}'],
-//  darkMode: 'class',
+  darkMode: 'class',
   theme: {
     extend: {
       colors: {