reset dialog styles

src/components/ConfirmDialog.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Dialog, DialogTitle, DialogContent, DialogActions, Button, Typography } from '@mui/material';
 import { ResetDialogProps } from '../types';
+import styles from "../styles/stylesheet";
 
 const ConfirmDialog = ({
   title,
@@ -10,15 +11,15 @@ const ConfirmDialog = ({
 }: ResetDialogProps) => {
   return (
     <Dialog open={visible} onClose={hideDialog}>
-      <DialogTitle>{title}</DialogTitle>
+      <DialogTitle style={{...styles.resetDialogTitle}} >{title}</DialogTitle>
-      <DialogContent>
+      <DialogContent style={{...styles.resetDialogContent}}>
-        <Typography variant="body1">Are you sure?</Typography>
+        <Typography>Are you sure?</Typography>
       </DialogContent>
-      <DialogActions>
+      <DialogActions style={{...styles.resetDialogActionRow}}>
-        <Button color="error" onClick={onConfirm}>
+        <Button style={{...styles.buttonRed, ...styles.button}} color="error" onClick={onConfirm}>
           Yes
         </Button>
-        <Button onClick={hideDialog}>No</Button>
+        <Button style={{...styles.buttonBlue, ...styles.button}} onClick={hideDialog}>No</Button>
       </DialogActions>
     </Dialog>
   );

src/index.tsx

@@ -68,6 +68,13 @@ const muiTheme = createTheme({
         fontWeight: 400,
       },
     },
+    MuiPaper: {
+      defaultProps: {
+        sx: {
+          backgroundImage: "none",
+        },
+      },
+    },
   },
   palette: {
     mode: "dark",

src/styles/stylesheet.js

@@ -77,6 +77,26 @@ const styles = StyleSheet.create({
   dialogWarning: {
     color: '#FFA3A8',
   },
+  resetDialogTitle:{
+    width: 500,
+    backgroundColor: '#18181A'
+  },
+  resetDialogContent: {
+    backgroundColor: '#18181A',
+  },
+  resetDialogActionRow: {
+    backgroundColor: '#18181A',
+  },
+  button: {
+    color: '#fff',
+    margin: 10
+  },
+  buttonRed: {
+    backgroundColor: '#B20710'
+  },
+  buttonBlue: {
+    backgroundColor: '#0000F4'
+  },
   mnemonicTitle:{
     backgroundColor: '#18181A',
   },