fix(theme): enhance

Signed-off-by: Sudhanshu Dasgupta <[email protected]>

Author: sudhanshutech

src/custom/ResponsiveDataTable.tsx

@@ -12,15 +12,18 @@ const dataTableTheme = (theme: Theme) =>
             width: '-webkit-fill-available',
             '@media (max-width: 500px)': {
               wordWrap: 'break-word'
-            }
+            },
+            background: theme.palette.background.constant?.table,
+            color: theme.palette.text.default
           }
         }
       },
       MUIDataTableHeadCell: {
         styleOverrides: {
           data: {
             fontWeight: 'bold',
-            textTransform: 'uppercase'
+            textTransform: 'uppercase',
+            color: theme.palette.text.default
           },
           root: {
             fontWeight: 'bold',
@@ -74,6 +77,30 @@ const dataTableTheme = (theme: Theme) =>
           }
         }
       },
+      MuiTableCell: {
+        styleOverrides: {
+          body: {
+            color: theme.palette.text.default
+          },
+          root: {
+            borderBottom: 'none'
+          }
+        }
+      },
+      MUIDataTablePagination: {
+        styleOverrides: {
+          toolbar: {
+            color: theme.palette.text.default
+          }
+        }
+      },
+      MUIDataTableSelectCell: {
+        styleOverrides: {
+          headerCell: {
+            background: theme.palette.background.constant?.table
+          }
+        }
+      },
       MuiInput: {
         styleOverrides: {
           root: {

src/theme/palette.ts

@@ -33,6 +33,7 @@ declare module '@mui/material/styles' {
     constant?: {
       disabled: string;
       white: string;
+      table: string;
     };
     inverse?: string;
     brand?: Interactiveness;
@@ -84,6 +85,7 @@ declare module '@mui/material/styles' {
     constant?: {
       white: string;
       disabled: string;
+      table: string;
     };
     inverse?: string;
     brand?: Interactiveness;
@@ -116,6 +118,7 @@ declare module '@mui/material/styles' {
     constant?: {
       white: string;
       disabled: string;
+      table: string;
     };
     inverse?: string;
     brand?: Interactiveness;
@@ -252,7 +255,8 @@ export const lightModePalette: PaletteOptions = {
     code: Colors.charcoal[90],
     constant: {
       white: Colors.accentGrey[100],
-      disabled: Colors.charcoal[70]
+      disabled: Colors.charcoal[70],
+      table: Colors.charcoal[100]
     },
     surfaces: Colors.accentGrey[100]
   },
@@ -365,7 +369,8 @@ export const darkModePalette: PaletteOptions = {
     code: Colors.accentGrey[90],
     constant: {
       white: Colors.accentGrey[100],
-      disabled: Colors.charcoal[70]
+      disabled: Colors.charcoal[70],
+      table: '#363636'
     },
     surfaces: Colors.accentGrey[10]
   },