From 4795f00be635caa6556de678ed693b7b5ac2b8fd Mon Sep 17 00:00:00 2001
From: kwasniew <kwasniewski.mateusz@gmail.com>
Date: Mon, 21 Oct 2024 13:06:12 +0200
Subject: [PATCH] feat: personal dashboard scrollbars and spacing

---
 frontend/src/component/personalDashboard/ActionBox.tsx    | 2 +-
 .../component/personalDashboard/LatestProjectEvents.tsx   | 8 ++++++--
 frontend/src/component/personalDashboard/MyFlags.tsx      | 1 -
 .../src/component/personalDashboard/SharedComponents.tsx  | 1 -
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/frontend/src/component/personalDashboard/ActionBox.tsx b/frontend/src/component/personalDashboard/ActionBox.tsx
index eb9bb2be453e..09ca0faf8097 100644
--- a/frontend/src/component/personalDashboard/ActionBox.tsx
+++ b/frontend/src/component/personalDashboard/ActionBox.tsx
@@ -2,7 +2,7 @@ import { styled } from '@mui/material';
 import type { FC, PropsWithChildren, ReactNode } from 'react';
 
 const Container = styled('article')(({ theme }) => ({
-    padding: theme.spacing(4, 2),
+    padding: theme.spacing(1, 2),
     display: 'flex',
     gap: theme.spacing(3),
     flexDirection: 'column',
diff --git a/frontend/src/component/personalDashboard/LatestProjectEvents.tsx b/frontend/src/component/personalDashboard/LatestProjectEvents.tsx
index 3f91aa235242..89fdbbf7eca7 100644
--- a/frontend/src/component/personalDashboard/LatestProjectEvents.tsx
+++ b/frontend/src/component/personalDashboard/LatestProjectEvents.tsx
@@ -44,6 +44,10 @@ const StyledUserAvatar = styled(UserAvatar)(({ theme }) => ({
     marginTop: theme.spacing(0.5),
 }));
 
+const StyledMarkdown = styled(Markdown)(({ theme }) => ({
+    wordBreak: 'break-all',
+}));
+
 export const LatestProjectEvents: FC<{
     latestEvents: PersonalDashboardProjectDetailsSchema['latestEvents'];
 }> = ({ latestEvents }) => {
@@ -73,10 +77,10 @@ export const LatestProjectEvents: FC<{
                                         locationSettings.locale,
                                     )}
                                 </Timestamp>
-                                <Markdown>
+                                <StyledMarkdown>
                                     {event.summary ||
                                         'No preview available for this event'}
-                                </Markdown>
+                                </StyledMarkdown>
                             </div>
                         </Event>
                     );
diff --git a/frontend/src/component/personalDashboard/MyFlags.tsx b/frontend/src/component/personalDashboard/MyFlags.tsx
index a1b3132989d5..3be135c45a6b 100644
--- a/frontend/src/component/personalDashboard/MyFlags.tsx
+++ b/frontend/src/component/personalDashboard/MyFlags.tsx
@@ -115,7 +115,6 @@ export const MyFlags: FC<Props> = ({
                             disablePadding={true}
                             sx={{
                                 height: '100%',
-                                overflow: 'auto',
                             }}
                         >
                             {flagData.flags.map((flag) => (
diff --git a/frontend/src/component/personalDashboard/SharedComponents.tsx b/frontend/src/component/personalDashboard/SharedComponents.tsx
index 1ef21beb0d97..658d267f1bdb 100644
--- a/frontend/src/component/personalDashboard/SharedComponents.tsx
+++ b/frontend/src/component/personalDashboard/SharedComponents.tsx
@@ -106,7 +106,6 @@ export const listItemStyle = (theme: Theme) => ({
 });
 
 export const StyledList = styled(List)(({ theme }) => ({
-    overflowY: 'auto',
     maxHeight: '400px',
 
     ...onWideContainer({