fix: version diff overflow (#4313)

Flagsmith · Jul 9, 2024 · 2525636 · 2525636
1 parent d32a320
commit 2525636
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git a/frontend/web/components/diff/DiffFeature.tsx b/frontend/web/components/diff/DiffFeature.tsx
@@ -109,7 +109,7 @@ const DiffFeature: FC<FeatureDiffType> = ({
                   </div>
                   <div className='flex-row pt-4 list-item list-item-sm'>
                     {!hideValue && (
-                      <div className='table-column flex flex-1'>
+                      <div className='table-column flex flex-1 overflow-hidden'>
                         <div>
                           <DiffString
                             data-test={'version-value'}

diff --git a/frontend/web/components/diff/DiffSegments.tsx b/frontend/web/components/diff/DiffSegments.tsx
@@ -24,7 +24,7 @@ const DiffSegment: FC<DiffSegment> = ({ diff }) => {
           newValue={diff.deleted ? diff.oldPriority : diff.newPriority}
         />
       </div>
-      <div className='table-column flex-fill'>
+      <div className='table-column flex-1 overflow-hidden'>
         <DiffString
           oldValue={diff.created ? diff.newValue : diff.oldValue}
           newValue={diff.deleted ? diff.oldValue : diff.newValue}

diff --git a/frontend/web/components/diff/DiffString.tsx b/frontend/web/components/diff/DiffString.tsx
@@ -37,7 +37,7 @@ const DiffString: FC<DiffType> = ({
       return null
     }
     return (
-      <div className='react-diff react-diff-line d-flex align-items-center'>
+      <div className='react-diff overflow-auto react-diff-line d-flex align-items-center'>
         <pre
           className='d-inline'
           dangerouslySetInnerHTML={{