From 67f74dd7de8b8fb61e213603d54c13347ab8584d Mon Sep 17 00:00:00 2001
From: Alex Holliday <ajhollid@gmail.com>
Date: Mon, 26 Jan 2026 18:28:55 +0000
Subject: [PATCH] fix: prevent horizontal scrollbar in table by adding
 overflowX hidden and making histogram responsive

---
 client/src/Components/v2/design-elements/Table.tsx             | 2 +-
 .../src/Components/v2/monitors/charts/HistogramPageSpeed.tsx   | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/client/src/Components/v2/design-elements/Table.tsx b/client/src/Components/v2/design-elements/Table.tsx
index 7270ac519..0516f1ddd 100644
--- a/client/src/Components/v2/design-elements/Table.tsx
+++ b/client/src/Components/v2/design-elements/Table.tsx
@@ -147,7 +147,7 @@ export function DataTable<
 		<TableContainer
 			component={Paper}
 			elevation={0}
-			sx={{ boxShadow: "none" }}
+			sx={{ boxShadow: "none", overflowX: "hidden" }}
 		>
 			<Table
 				sx={{
diff --git a/client/src/Components/v2/monitors/charts/HistogramPageSpeed.tsx b/client/src/Components/v2/monitors/charts/HistogramPageSpeed.tsx
index 509886434..d8d3b9829 100644
--- a/client/src/Components/v2/monitors/charts/HistogramPageSpeed.tsx
+++ b/client/src/Components/v2/monitors/charts/HistogramPageSpeed.tsx
@@ -45,7 +45,8 @@ export const HistogramPageSpeed = ({
 			flexWrap="nowrap"
 			gap={theme.spacing(1.5)}
 			height="100px"
-			width="400px"
+			maxWidth="400px"
+			width="100%"
 			onClick={(event) => event.stopPropagation()}
 			overflow={"hidden"}
 			sx={{