more modals

This commit is contained in:
Tobias Merkle 2024-04-09 16:22:58 -04:00
parent 4f68ecf710
commit 7c05d3568d
5 changed files with 23 additions and 23 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -15,8 +15,8 @@
<meta name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" />
<link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet'>
<script type="module" crossorigin src="/main:app_store:sys/assets/index-WdAkPE29.js"></script>
<link rel="stylesheet" crossorigin href="/main:app_store:sys/assets/index-JHPmosCH.css">
<script type="module" crossorigin src="/main:app_store:sys/assets/index-przgvy-e.js"></script>
<link rel="stylesheet" crossorigin href="/main:app_store:sys/assets/index-avBSgupm.css">
</head>
<body>

View File

@ -1,6 +1,6 @@
import classNames from 'classnames'
import React, { MouseEvent } from 'react'
import { FaPlus } from 'react-icons/fa'
import { FaX } from 'react-icons/fa6'
export interface ModalProps extends React.HTMLAttributes<HTMLDivElement> {
show: boolean
@ -27,23 +27,23 @@ const Modal: React.FC<ModalProps> = ({
return (
<div
className={classNames(`bg-black/25 fixed top-0 bottom-0 left-0 right-0 flex flex-col c z-30 min-h-[10em] min-w-[20em]`,
className={classNames(`bg-black/25 fixed top-0 bottom-0 left-0 right-0 flex flex-col c z-30 min-h-[10em] min-w-[30em]`,
{ show }
)}
onClick={hide}
>
<div
{...props}
className={`flex flex-col relative bg-black/90 rounded-lg p-6 ${props.className || ''}`}
className={`flex flex-col relative bg-black/90 rounded-lg py-6 px-12 ${props.className || ''}`}
onClick={dontHide}
>
{Boolean(title) && <h4 className='mt-0 mb-2'>{title}</h4>}
{!hideClose && (
<button
className='icon'
className='icon absolute top-1 right-1'
onClick={hide}
>
<FaPlus />
<FaX />
</button>
)}
<div