standarize button styles

src/themes/darkThemeOptions.tsx

@@ -1,22 +1,35 @@
-import { createTheme } from '@mui/material/styles';
+import {
+    createTheme,
+    PaletteColor,
+    PaletteColorOptions,
+} from '@mui/material/styles';
 
 declare module '@mui/material/styles' {
     interface Palette {
-        accent: Palette['primary'];
+        accent: PaletteColor;
-        danger: Palette['primary'];
+        danger: PaletteColor;
+        negative: PaletteColor;
     }
     interface PaletteOptions {
-        accent: PaletteOptions['primary'];
+        accent?: PaletteColorOptions;
-        danger: PaletteOptions['primary'];
+        danger?: PaletteColorOptions;
+        negative?: PaletteColorOptions;
     }
 }
 
 declare module '@mui/material/Button' {
     export interface ButtonPropsColorOverrides {
+        accent: true;
         danger: true;
     }
 }
 
+declare module '@mui/material/ToggleButtonGroup' {
+    export interface ToggleButtonGroupPropsColorOverrides {
+        negative: true;
+    }
+}
+
 // Create a theme instance.
 const darkThemeOptions = createTheme({
     components: {
@@ -39,11 +52,26 @@ const darkThemeOptions = createTheme({
         MuiMenu: {
             styleOverrides: { paper: { margin: '10px' } },
         },
+        MuiButton: {
+            styleOverrides: {
+                root: {
+                    fontSize: '18px',
+                    lineHeight: '21.78px',
+                    padding: '16px',
+                    color: '#fff',
+                    textTransform: 'none',
+                    borderRadius: '8px',
+                },
+            },
+        },
     },
 
     palette: {
         mode: 'dark',
         primary: {
+            main: 'hsla(0, 0%, 11%, 1)',
+        },
+        negative: {
             main: '#fff',
         },
         text: {