From c566d5d5f72f1ed2f6b58ff114d37c53eb9367b5 Mon Sep 17 00:00:00 2001
From: Samuel Therrien <samuel.therrien@beslogic.com>
Date: Tue, 26 Nov 2024 15:56:32 -0500
Subject: [PATCH] FIx comments and sponsors from overflowing

---
 .../src/assets/styles/muiCustomTheme.ts             |  7 +++++++
 .../components/analytics/AnalyticsSiteHeader.tsx    | 13 ++++++-------
 .../src/components/social/PostComment.tsx           |  2 +-
 3 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/canopeum_frontend/src/assets/styles/muiCustomTheme.ts b/canopeum_frontend/src/assets/styles/muiCustomTheme.ts
index 5704ebeb0..557af63b0 100644
--- a/canopeum_frontend/src/assets/styles/muiCustomTheme.ts
+++ b/canopeum_frontend/src/assets/styles/muiCustomTheme.ts
@@ -22,6 +22,13 @@ const muiCustomTheme = createTheme({
     },
   },
   components: {
+    MuiDialog: {
+      styleOverrides: {
+        root: {
+          wordWrap: 'break-word', // Same as .card
+        },
+      },
+    },
     MuiDialogActions: {
       styleOverrides: {
         spacing: {
diff --git a/canopeum_frontend/src/components/analytics/AnalyticsSiteHeader.tsx b/canopeum_frontend/src/components/analytics/AnalyticsSiteHeader.tsx
index 0c236d39c..228d8229c 100644
--- a/canopeum_frontend/src/components/analytics/AnalyticsSiteHeader.tsx
+++ b/canopeum_frontend/src/components/analytics/AnalyticsSiteHeader.tsx
@@ -82,13 +82,12 @@ const AnalyticsSiteHeader = ({ siteSummary }: Props) => {
           />
         </div>
 
-        <div
-          className='d-flex align-items-center fw-bold overflow-x-auto pb-2 mt-4'
-          style={{ maxWidth: '800px' }} // TODO: Magic number
-        >
-          <span className='material-symbols-outlined'>group</span>
-          <span className='ms-1 me-2'>{translate('analyticsSite.sponsors')}:</span>
-          <div className='d-flex gap-4'>
+        <div className='d-flex flex-wrap align-items-center fw-bold overflow-x-auto pb-2 mt-4'>
+          <label className='d-flex form-label'>
+            <span className='material-symbols-outlined'>group</span>
+            <span className='ms-1 me-2'>{translate('analyticsSite.sponsors')}:</span>
+          </label>
+          <div className='d-flex flex-wrap gap-4'>
             {siteSummary.sponsors.map(sponsor => (
               <BatchSponsorLogo key={sponsor.id} sponsor={sponsor} />
             ))}
diff --git a/canopeum_frontend/src/components/social/PostComment.tsx b/canopeum_frontend/src/components/social/PostComment.tsx
index 4052d4474..51f9621c8 100644
--- a/canopeum_frontend/src/components/social/PostComment.tsx
+++ b/canopeum_frontend/src/components/social/PostComment.tsx
@@ -47,7 +47,7 @@ const PostComment = ({ comment, onDelete, siteId }: Props) => {
       </div>
 
       <div className='mt-1'>
-        <span>{comment.body}</span>
+        {comment.body}
       </div>
     </div>
   )