fix: prevent scrolling on user modal (WPB-4472) (#15853)

wireapp · Sep 19, 2023 · cf88d37 · cf88d37
1 parent 7728072
commit cf88d37
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 6 deletions.
diff --git a/src/script/components/Modals/UserModal/UserModal.styles.ts b/src/script/components/Modals/UserModal/UserModal.styles.ts
@@ -17,7 +17,7 @@
  *
  */
 
-import {css} from '@emotion/react';
+import {CSSObject, css} from '@emotion/react';
 
 export const userModalStyle = css`
   .enriched-fields {
@@ -50,11 +50,16 @@ export const userModalStyle = css`
   }
 
   .modal__body {
-    padding: 16px;
+    padding: 0 16px;
 
     .classified-bar {
       margin-top: 12px;
       width: calc(100% + 32px);
     }
   }
 `;
+
+export const userModalWrapperStyle: CSSObject = {
+  maxHeight: '90vh',
+  padding: 0,
+};
diff --git a/src/script/components/Modals/UserModal/UserModal.tsx b/src/script/components/Modals/UserModal/UserModal.tsx
@@ -36,7 +36,7 @@ import {handleKeyDown} from 'Util/KeyboardUtil';
 import {replaceLink, t} from 'Util/LocalizerUtil';
 
 import {useUserModalState} from './UserModal.state';
-import {userModalStyle} from './UserModal.styles';
+import {userModalStyle, userModalWrapperStyle} from './UserModal.styles';
 
 import {Config} from '../../../Config';
 import {User} from '../../../entity/User';
@@ -181,9 +181,7 @@ const UserModal: React.FC<UserModalProps> = ({
         onBgClick={hide}
         onClosed={onModalClosed}
         data-uie-name={user ? 'modal-user-profile' : userNotFound ? 'modal-cannot-open-profile' : ''}
-        wrapperCSS={{
-          padding: 0,
-        }}
+        wrapperCSS={userModalWrapperStyle}
       >
         <div className="modal__header">
           {userNotFound && (