fix many

Client/src/Components/Charts/BarChart/index.jsx

@@ -143,11 +143,7 @@ const BarChart = ({ checks = [] }) => {
 							position="relative"
 							width="9px"
 							height="100%"
-							backgroundColor={
-								check.status
-									? theme.palette.success.contrastText
-									: theme.palette.error.contrastText
-							}
+							backgroundColor={theme.palette.tertiary.main}
 							sx={{
 								borderRadius: theme.spacing(1.5),
 								/* 

Client/src/Pages/Uptime/Home/actionsMenu.jsx

@@ -106,11 +106,16 @@ const ActionsMenu = ({ monitor, isAdmin, updateRowCallback, pauseCallback }) =>
 				slotProps={{
 					paper: {
 						sx: {
-							"& ul": { p: theme.spacing(2.5) },
-							"& li": { m: 0 },
+							"& ul": {
+								p: theme.spacing(2.5),
+								backgroundColor: theme.palette.primary.main,
+							},
+							"& li": { m: 0, color: theme.palette.primary.contrastText.secondary },
+							/* 
+							This should not be set automatically on the last of type
 							"& li:last-of-type": {
 								color: theme.palette.error.main,
-							},
+							}, */
 						},
 					},
 				}}
@@ -182,6 +187,7 @@ const ActionsMenu = ({ monitor, isAdmin, updateRowCallback, pauseCallback }) =>
 							e.stopPropagation();
 							openRemove(e);
 						}}
+						sx={{ "&.MuiButtonBase-root": { color: theme.palette.error.main } }}
 					>
 						Remove
 					</MenuItem>

Client/src/Pages/Uptime/Home/index.jsx

@@ -58,19 +58,21 @@ const UptimeMonitors = () => {
 					gap={theme.spacing(6)}
 				>
 					{canAddMonitor && (
-						<Button
-							variant="contained"
-							color="accent"
-							onClick={() => {
-								navigate("/uptime/create");
-							}}
-							sx={{
-								fontWeight: 500,
-								whiteSpace: "nowrap",
-							}}
-						>
-							Create new
-						</Button>
+						<>
+							<Button
+								variant="contained"
+								color="accent"
+								onClick={() => {
+									navigate("/uptime/create");
+								}}
+								sx={{
+									fontWeight: 500,
+									whiteSpace: "nowrap",
+								}}
+							>
+								Create new
+							</Button>
+						</>
 					)}
 				</Stack>
 				<Greeting type="uptime" />

Client/src/Pages/Uptime/utils.jsx

@@ -37,23 +37,38 @@ const useUtils = () => {
 		},
 		/* TODO solve remaining gradients */
 		down: {
+			backgroundColor: theme.palette.error.accent /* dark */,
+			background: `linear-gradient(340deg, ${theme.palette.error.accent} -60%, ${theme.palette.error.contrastText} 35%)`,
+			borderColor: theme.palette.error.light,
+			"& h2": { color: theme.palette.error.main },
+		} /* {
 			backgroundColor: theme.palette.error.dark,
 			background: `linear-gradient(340deg, ${theme.palette.error.light} -60%, ${theme.palette.error.dark} 35%)`,
 			borderColor: theme.palette.error.light,
 			"& h2": { color: theme.palette.error.main },
-		},
+		}, */,
 		paused: {
+			backgroundColor: theme.palette.warning.accent /* dark */,
+			background: `linear-gradient(340deg, ${theme.palette.warning.accent} -60%, ${theme.palette.warning.contrastText} 35%)`,
+			borderColor: theme.palette.warning.light,
+			"& h2": { color: theme.palette.warning.main },
+		} /* {
 			backgroundColor: theme.palette.warning.dark,
 			background: `linear-gradient(340deg, ${theme.palette.warning.light} -60%, ${theme.palette.warning.dark} 35%)`,
 			borderColor: theme.palette.warning.light,
 			"& h2": { color: theme.palette.warning.main },
-		},
+		} */,
 		pending: {
+			backgroundColor: theme.palette.warning.accent /* dark */,
+			background: `linear-gradient(340deg, ${theme.palette.warning.accent} -60%, ${theme.palette.warning.contrastText} 35%)`,
+			borderColor: theme.palette.warning.light,
+			"& h2": { color: theme.palette.warning.main },
+		} /* {
 			backgroundColor: theme.palette.warning.light,
 			background: `linear-gradient(340deg, ${theme.palette.warning.dark} -60%, ${theme.palette.warning.light} 35%)`,
 			borderColor: theme.palette.warning.dark,
 			"& h2": { color: theme.palette.warning.main },
-		},
+		}, */,
 	};
 	const pagespeedStyles = {
 		up: {

Client/src/Utils/Theme/constants.js

@@ -318,7 +318,7 @@ const newSemanticColors = {
 	},
 	secondary: {
 		main: {
-			light: newColors.gray100,
+			light: newColors.gray200,
 			dark: newColors.blueGray600,
 		},
 		contrastText: {
@@ -326,6 +326,16 @@ const newSemanticColors = {
 			dark: newColors.gray200,
 		},
 	},
+	tertiary: {
+		main: {
+			light: newColors.gray100,
+			dark: newColors.blueGray800,
+		},
+		contrastText: {
+			light: newColors.blueGray800,
+			dark: newColors.gray100,
+		},
+	},
 	/* For success, warning and error, contrastText works wll with main, and with the theme primary main color. Accent is to be used in graphs */
 	success: {
 		main: {