TRX/Checkmate
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: Infrastructure Details Page Design

Browse Source
This commit is contained in:
Aryaman Kumar Sharma committed 2025-03-01 10:21:39 +05:30
1 parent 724f1c98d6
commit 4ccc36acc2
6 files changed
+50 -15
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/Components/Charts/CustomGauge/index.jsx
+5 -3
View File
@@ -62,6 +62,7 @@ const CustomGauge = ({ progress = 0, radius = 70, strokeWidth = 15, threshold =
className="radial-chart"
width={radius}
height={radius}
sx={{ backgroundColor: theme.palette.accent.baseBackground, borderRadius: "50%" }}
>
<svg
viewBox={`0 0 ${totalSize} ${totalSize}`}
@@ -70,7 +71,7 @@ const CustomGauge = ({ progress = 0, radius = 70, strokeWidth = 15, threshold =
>
<circle
className="radial-chart-base"
stroke={theme.palette.primary.lowContrast} // CAIO_REVIEW
stroke={theme.palette.accent.base} // CAIO_REVIEW
strokeWidth={strokeWidth}
fill="none"
cx={totalSize / 2} // Center the circle
@@ -98,8 +99,9 @@ const CustomGauge = ({ progress = 0, radius = 70, strokeWidth = 15, threshold =
top: "50%",
left: "50%",
transform: "translate(-50%, -50%)",
...theme.typography.body2,
fill: theme.typography.body2.color,
...theme.typography.h2,
fill: theme.typography.h2.color,
fontWeight: 500,
}}
>
{`${progressWithinRange.toFixed(1)}%`}
src/Components/StatBox/index.jsx
+4 -3
View File
@@ -3,6 +3,7 @@ import Image from "../Image";
import { useTheme } from "@mui/material/styles";
import PropTypes from "prop-types";
import useUtils from "../../Pages/Uptime/Monitors/Hooks/useUtils";
import { lighten } from "@mui/material/styles";
/**
* StatBox Component
@@ -50,7 +51,7 @@ const StatBox = ({
borderColor: theme.palette[themeColor].lowContrast,
}
: {
background: `linear-gradient(340deg, ${theme.palette.tertiary.main} 20%, ${theme.palette.primary.main} 45%)`,
background: `linear-gradient(340deg, ${theme.palette.tertiary.main} 10%, ${theme.palette.primary.main} 45%)`,
borderColor: theme.palette.primary.lowContrast,
};
@@ -62,7 +63,7 @@ const StatBox = ({
color: theme.palette.primary.contrastTextSecondary,
};
const spanFixedStyles = { marginLeft: theme.spacing(2), fontSize: 15 };
const spanFixedStyles = { marginLeft: theme.spacing(2), fontSize: 15, fontWeight: 600};
const detailTextStyles = gradient
? {
color: theme.palette[themeColor].contrastText,
@@ -120,7 +121,7 @@ const StatBox = ({
)}
<Stack>
<Typography component="h2">{heading}</Typography>
<Typography>{subHeading}</Typography>
<Typography sx={{fontWeight: 600}}>{subHeading}</Typography>
</Stack>
</Stack>
);