From ef6a8cad6f73e0013ee8088b37461f4d15ce0f68 Mon Sep 17 00:00:00 2001
From: Luke <39926192+LukeWasTakenn@users.noreply.github.com>
Date: Sat, 2 Sep 2023 23:28:37 +0200
Subject: [PATCH] refactor(web/alert): darker alert dialog content color

it doesn't make sense for the content to be the same color as the title
---
 web/src/features/dialog/AlertDialog.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/web/src/features/dialog/AlertDialog.tsx b/web/src/features/dialog/AlertDialog.tsx
index ed07d5f..affc774 100644
--- a/web/src/features/dialog/AlertDialog.tsx
+++ b/web/src/features/dialog/AlertDialog.tsx
@@ -1,4 +1,4 @@
-import { Modal, Button, Stack, Group, useMantineTheme } from '@mantine/core';
+import { Modal, Button, Stack, Group, useMantineTheme, createStyles } from '@mantine/core';
 import { useState } from 'react';
 import ReactMarkdown from 'react-markdown';
 import { useNuiEvent } from '../../hooks/useNuiEvent';
@@ -8,8 +8,15 @@ import remarkGfm from 'remark-gfm';
 import type { AlertProps } from '../../typings';
 import MarkdownComponents from '../../config/MarkdownComponents';
 
+const useStyles = createStyles((theme) => ({
+  contentStack: {
+    color: theme.colors.dark[2],
+  },
+}));
+
 const AlertDialog: React.FC = () => {
   const { locale } = useLocales();
+  const { classes } = useStyles();
   const theme = useMantineTheme();
   const [opened, setOpened] = useState(false);
   const [dialogData, setDialogData] = useState<AlertProps>({
@@ -49,7 +56,7 @@ const AlertDialog: React.FC = () => {
         transition="fade"
         title={<ReactMarkdown components={MarkdownComponents}>{dialogData.header}</ReactMarkdown>}
       >
-        <Stack>
+        <Stack className={classes.contentStack}>
           <ReactMarkdown
             remarkPlugins={[remarkGfm]}
             components={{