VSinerva/freesewing
1
0
Fork 0
Code Activity

fix(shared): Stop modal from staying open

Browse source
This commit is contained in:
Joost De Cock 2023-11-27 17:50:44 +01:00
parent 8535b7bdfd
commit d4739c941d
2 changed files with 14 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

7
sites/shared/components/inputs.mjs
View file

@ -62,7 +62,12 @@ export const FormControl = ({
className="btn btn-ghost btn-sm btn-circle hover:btn-secondary" className="btn btn-ghost btn-sm btn-circle hover:btn-secondary"
onClick={() => onClick={() =>
setModal( setModal(
<ModalWrapper flex="col" justify="top lg:justify-center" slideFrom="right"> <ModalWrapper
flex="col"
justify="top lg:justify-center"
slideFrom="right"
keepOpenOnClick
>
<div className="mdx max-w-prose">{docs}</div> <div className="mdx max-w-prose">{docs}</div>
</ModalWrapper> </ModalWrapper>
) )

6
sites/shared/components/wrappers/modal.mjs
View file

@ -67,26 +67,24 @@ export const ModalWrapper = ({
transform-all duration-150 ${animation} transform-all duration-150 ${animation}
bg-${bg} bg-opacity-${bgOpacity} z-50 hover:cursor-pointer bg-${bg} bg-opacity-${bgOpacity} z-50 hover:cursor-pointer
flex flex-${flex} justify-${justify} items-${items} lg:p-12`} flex flex-${flex} justify-${justify} items-${items} lg:p-12`}
onClick={keepOpenOnClick ? null : close} onClick={close}
> >
{bare ? ( {bare ? (
children children
) : ( ) : (
<div <div
onClick={stopClick} onClick={keepOpenOnClick ? stopClick : null}
className={`z-30 bg-base-100 p-4 lg:px-8 lg:rounded-lg lg:shadow-lg max-h-full overflow-auto hover:cursor-default ${ className={`z-30 bg-base-100 p-4 lg:px-8 lg:rounded-lg lg:shadow-lg max-h-full overflow-auto hover:cursor-default ${
fullWidth ? 'w-full' : '' fullWidth ? 'w-full' : ''
}`} }`}
> >
{children} {children}
{!keepOpenOnClick && (
<button <button
className="fixed bottom-2 right-2 btn btn-neutral btn-circle lg:hidden" className="fixed bottom-2 right-2 btn btn-neutral btn-circle lg:hidden"
onClick={close} onClick={close}
> >
<CloseIcon className="w-8 h-8" /> <CloseIcon className="w-8 h-8" />
</button> </button>
)}
</div> </div>
)} )}
</div> </div>