Revamped header section

Client/src/Utils/Theme/darkTheme.js

@@ -10,10 +10,10 @@ const text = {
 const background = {
   main: "#151518",
   alt: "#09090b",
-  fill: "#2e2e2e",
+  fill: "#2D2D33",
   accent: "#18181a",
 };
-const border = { light: "#27272a", dark: "#2c2c2c" };
+const border = { light: "#27272a", dark: "#36363e" };
 
 const fontFamilyDefault =
   '"Inter","system-ui", "Avenir", "Helvetica", "Arial", sans-serif';
@@ -25,7 +25,7 @@ const darkTheme = createTheme({
   palette: {
     mode: "dark",
     primary: { main: "#1570ef" },
-    secondary: { main: "#2e2e2e" },
+    secondary: { main: "#2D2D33" },
     text: text,
     background: background,
     border: border,
@@ -92,6 +92,15 @@ const darkTheme = createTheme({
                 backgroundColor: theme.palette.secondary.main,
               },
             },
+            {
+              props: (props) =>
+                props.variant === "contained" && props.color === "secondary",
+              style: {
+                border: 1,
+                borderStyle: "solid",
+                borderColor: theme.palette.border.dark,
+              },
+            },
           ],
           fontWeight: 400,
           borderRadius: 4,

Client/src/Utils/Theme/lightTheme.js

@@ -89,6 +89,15 @@ const lightTheme = createTheme({
                 backgroundColor: theme.palette.secondary.main,
               },
             },
+            {
+              props: (props) =>
+                props.variant === "contained" && props.color === "secondary",
+              style: {
+                border: 1,
+                borderStyle: "solid",
+                borderColor: theme.palette.border.light,
+              },
+            },
           ],
           fontWeight: 400,
           borderRadius: 4,