Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-01-20 22:42:53 -05:00
Code Issues Activity

Fixed bottom part of modals getting cut off on mobile

Browse source 
ref https://linear.app/ghost/issue/DES-1069/cannot-save-changes-made-to-staff-user-profile-from-mobile-device, https://linear.app/ghost/issue/DES-1070/on-mobile-cannot-click-send-invitation-now-when-adding-staff-members

- We were using viewport units to set the height of the modal, but the issue with that value is that it doesn't take into account browser toolbars on phones. Switching to dynamic viewport units fixes this issue.
This commit is contained in:
Djordje Vlaisavljevic 2025-01-08 15:39:38 +00:00
parent 620b42f275
commit d9abbb594f
1 changed files with 1 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
apps/admin-x-design-system/src/global/modal/Modal.tsx
View file

@ -205,7 +205,7 @@ const Modal: React.FC<ModalProps> = ({
);
let backdropClasses = clsx(
'fixed inset-0 z-[1000] h-[100vh] w-[100vw]',
'fixed inset-0 z-[1000] h-[100dvh] w-[100dvw]',
allowBackgroundInteraction && 'pointer-events-none'
);