mars-v2-frontend/components/Overlay/Overlay.tsx
Linkie Link c4f8f4eab0
Mp 1757 wallet connect (#66)
* MP-1757: implemented the WalletProvider and connect buttons

* tidy: tidy up the search

* MP-1691: moved modals outside of the DOM

* MP-1691: changed CreditManager into AccountDetails

* fix: fixed the naming

* MP-1691: UX approvements

* MP-1691: global confirm and delete modal added

* fix: merged the credit-account and wallet branch

* MP-1757: added the status store

* fix: updated the store interaction

* MP-1757: major cleanup of stores

* tidy: format
2022-12-08 21:14:38 +01:00

37 lines
804 B
TypeScript

import classNames from 'classnames'
import { ReactNode } from 'react'
interface Props {
children?: ReactNode | string
content?: ReactNode | string
className?: string
show: boolean
setShow: (show: boolean) => void
}
const Overlay = ({ children, content, className, show, setShow }: Props) => {
const onClickAway = () => {
setShow(false)
}
return show ? (
<>
<div
className={classNames(
'max-w-screen absolute z-50 rounded-lg shadow-overlay gradient-popover',
className,
)}
>
{children ? children : content}
</div>
<div
className='fixed top-0 left-0 z-40 block h-full w-full hover:cursor-pointer'
onClick={onClickAway}
role='button'
/>
</>
) : null
}
export default Overlay