FIx comments and sponsors from overflowing

BesLogic · Nov 26, 2024 · c566d5d · c566d5d
1 parent 4774c39
commit c566d5d
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 8 deletions.
diff --git 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
@@ -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
@@ -47,7 +47,7 @@ const PostComment = ({ comment, onDelete, siteId }: Props) => {
       </div>
 
       <div className='mt-1'>
-        <span>{comment.body}</span>
+        {comment.body}
       </div>
     </div>
   )
-Original file line number
+Diff line change
@@ Expand Up @@
           </div>
           <div className='mt-1'>
-            <span>{comment.body}</span>
+            {comment.body}
           </div>
         </div>
       )
@@ Expand Down @@