nuke theme

client/src/components/common/HeaderCreate.tsx

@@ -52,7 +52,7 @@ export const HeaderCreate = ({
           <Button
             loading={isLoading}
             variant="contained"
-            color="accent"
+            color="primary"
             disabled={limitReached}
             onClick={() => navigate(path)}
           >

client/src/components/common/HeatmapResponseTime.tsx

@@ -53,24 +53,20 @@ export const HeatmapResponseTime = ({
         {data.map((check, index) => {
           const statusBg =
             check.status === "placeholder"
-              ? theme.palette.primary.lowContrast
+              ? theme.palette.action.hover
               : check.status === "up"
-                ? theme.palette.success.lowContrast
-                : theme.palette.error.lowContrast;
+                ? theme.palette.success.light
+                : theme.palette.error.light;
           const respBg =
             check.status === "placeholder"
-              ? theme.palette.primary.lowContrast
+              ? theme.palette.action.hover
               : getResponseColor(check.responseTime, {
-                  start: theme.palette.success.lowContrast,
-                  mid: theme.palette.warning.lowContrast,
-                  end: theme.palette.error.lowContrast,
+                  start: theme.palette.success.main,
+                  mid: theme.palette.warning.main,
+                  end: theme.palette.error.main,
                 });
           const statusBorder =
-            check.status === "placeholder"
-              ? theme.palette.primary.lowContrast
-              : check.status === "up"
-                ? theme.palette.success.main
-                : theme.palette.error.main;
+            check.status === "placeholder" ? theme.palette.divider : check.status === "up" ? theme.palette.success.main : theme.palette.error.main;
 
           return (
             <HeatmapResponseTimeTooltip key={`${check}-${index}`} check={check}>

client/src/components/common/HeatmapResponseTimeTooltip.tsx

@@ -14,8 +14,8 @@ export const HeatmapResponseTimeTooltip: React.FC<{
   const theme = useTheme();
 
   const getColor = (status: string) => {
-    if (status === "up") return theme.palette.success.lowContrast;
-    if (status === "down") return theme.palette.error.lowContrast;
+    if (status === "up") return theme.palette.success.light;
+    if (status === "down") return theme.palette.error.light;
   };
 
   if (check.status === "placeholder") {
@@ -37,7 +37,7 @@ export const HeatmapResponseTimeTooltip: React.FC<{
           sx={{
             backgroundColor: theme.palette.secondary.main,
             border: 1,
-            borderColor: theme.palette.primary.lowContrast,
+            borderColor: theme.palette.divider,
             borderRadius: theme.shape.borderRadius,
             p: theme.spacing(4),
           }}

client/src/components/common/HistogramResponseTime.tsx

@@ -57,8 +57,8 @@ export const HistogramResponseTime = ({
           const heightPct = `${Math.max(0, Math.min(100, (check as any).normalResponseTime ?? 0))}%`;
           const barColor =
             check.status === "up"
-              ? theme.palette.success.lowContrast
-              : theme.palette.error.lowContrast;
+              ? theme.palette.success.light
+              : theme.palette.error.light;
           const bar = (
             <Box
               sx={{
@@ -66,7 +66,7 @@ export const HistogramResponseTime = ({
                 width: "100%",
                 height: "100%",
                 borderRadius: theme.spacing(1),
-                bgcolor: theme.palette.primary.lowContrast,
+                bgcolor: theme.palette.action.hover,
                 overflow: "hidden",
               }}
             >