From 3f80fdb0903156471d7ce149bcc3051aa2c3f9ba Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nuno=20G=C3=B3is?= Date: Thu, 26 Sep 2024 09:51:15 +0100 Subject: [PATCH] fix: layout content width on large screens (#8267) I believe the changes in https://github.com/Unleash/unleash/pull/8234, more specifically [this change](https://github.com/Unleash/unleash/pull/8234/files#diff-3a5e0763fe1effa9cd485763fecf0633ce8f0877c9d1971e6bd5c5abe7426364L64), have caused the main layout content to no longer stretch to its maximum relative width on larger screens. This adjustment seems to resolve this issue, ensuring proper behavior on larger screens without introducing any overflow issues on smaller screens. --- frontend/src/component/layout/MainLayout/MainLayout.tsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/frontend/src/component/layout/MainLayout/MainLayout.tsx b/frontend/src/component/layout/MainLayout/MainLayout.tsx index 43383c050f..ab8af57676 100644 --- a/frontend/src/component/layout/MainLayout/MainLayout.tsx +++ b/frontend/src/component/layout/MainLayout/MainLayout.tsx @@ -67,6 +67,9 @@ const NewMainLayoutContent = styled(Grid)(({ theme }) => ({ margin: '0 auto', paddingLeft: theme.spacing(2), paddingRight: theme.spacing(2), + [theme.breakpoints.up(1856)]: { + width: '100%', + }, [theme.breakpoints.down(1856)]: { marginLeft: theme.spacing(7), marginRight: theme.spacing(7),