Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-03-11 02:12:21 -05:00
Code Issues Activity

Fixed modal padding bug

Browse source 
refs. https://github.com/TryGhost/Team/issues/3351
This commit is contained in:
Peter Zimon 2023-06-06 15:07:20 +02:00
parent c08723b7aa
commit 2fc3336dd2
1 changed files with 11 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
ghost/admin-x-settings/src/admin-x-ds/global/Modal.tsx
View file

@ -75,7 +75,7 @@ const Modal: React.FC<ModalProps> = ({
let modalClasses = clsx('relative z-50 mx-auto flex w-full flex-col justify-between rounded bg-white shadow-xl');
let backdropClasses = clsx('fixed inset-0 z-40 h-[100vh] w-[100vw] overflow-y-scroll ');
let padding;
let padding = '';
let footerContainerBottom = '';
@ -83,52 +83,52 @@ const Modal: React.FC<ModalProps> = ({
case 'sm':
modalClasses += ' max-w-[480px] ';
backdropClasses += ' p-[8vmin]';
padding = 8;
padding = 'p-8';
footerContainerBottom = 'calc(-1 * (8vmin + 48px)';
break;
case 'md':
modalClasses += ' max-w-[720px] ';
backdropClasses += ' p-[8vmin]';
padding = 8;
padding = 'p-8';
footerContainerBottom = 'calc(-1 * (8vmin + 48px)';
break;
case 'lg':
modalClasses += ' max-w-[1020px] ';
backdropClasses += ' p-[4vmin]';
padding = 12;
padding = 'p-12';
footerContainerBottom = 'calc(-1 * (4vmin + 68px)';
break;
case 'xl':
modalClasses += ' max-w-[1240px] ';
backdropClasses += ' p-[3vmin]';
padding = 14;
padding = 'p-12';
footerContainerBottom = 'calc(-1 * (3vmin + 68px)';
break;
case 'full':
modalClasses += ' h-full ';
backdropClasses += ' p-[2vmin]';
padding = 12;
padding = 'p-12';
footerContainerBottom = 'calc(-1 * (2vmin + 68px)';
break;
case 'bleed':
modalClasses += ' h-full ';
padding = 12;
padding = 'p-12';
break;
default:
backdropClasses += ' p-[8vmin]';
footerContainerBottom = 'calc(-1 * (8vmin + 48px)';
padding = 8;
padding = 'p-8';
break;
}
if (noPadding) {
padding = 0;
padding = 'p-0';
}
let footerContainerClasses = clsx(
@ -139,11 +139,11 @@ const Modal: React.FC<ModalProps> = ({
);
let footerClasses = clsx(
`px-${padding} pb-${padding} ${stickyFooter && `pt-8`} z-[101] flex items-center justify-between`,
`${padding} ${stickyFooter ? 'pt-8' : 'pt-0'} z-[101] flex items-center justify-between`,
stickyFooter && `sticky bottom-[-48px] rounded-b bg-white`
);
let contentClasses = `p-${padding}`;
let contentClasses = `${padding}`;
if (!customFooter) {
contentClasses += ' pb-0 ';