blob: 5deceadfc80530472e0ee0ad252c338d9f911015 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
import { XMarkIcon } from "@heroicons/react/24/outline"
const BottomPopup = ({ children, active, title, close }) => (
<>
<div
onClick={close}
className={`overlay ${active ? 'block' : 'hidden'}`}
/>
<div className={`fixed left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white idt-transition ${active ? 'bottom-0' : '-bottom-full'}`}>
<div className="flex justify-between py-4">
<div className="font-semibold text-h-sm">{ title }</div>
<button type="button" onClick={close}>
<XMarkIcon className="w-5 stroke-2" />
</button>
</div>
{ children }
</div>
</>
)
export default BottomPopup
|
