diff --git a/src/components/ui/Modal.tsx b/src/components/ui/Modal.tsx index 32981bc2..a5bda5fe 100644 --- a/src/components/ui/Modal.tsx +++ b/src/components/ui/Modal.tsx @@ -80,7 +80,16 @@ const ModalContent = styled.div< h3 { font-size: 14px; text-transform: uppercase; - margin-top: 0; + margin: 0; + margin-bottom: 10px; + color: var(--foreground); + } + + h5 { + margin: 0; + font-size: 13px; + font-weight: 500; + color: var(--secondary-foreground); } form { @@ -105,6 +114,7 @@ const ModalContent = styled.div< props.padding && css` padding: 1rem; + min-width: 450px; `} ${(props) => @@ -138,6 +148,7 @@ export type Action = Omit & { interface Props { children?: Children; title?: Children; + description?: Children; disallowClosing?: boolean; noBackground?: boolean; @@ -163,6 +174,7 @@ export default function Modal(props: Props) { border={props.border} padding={props.padding ?? !props.dontModal}> {props.title &&

{props.title}

} + {props.description &&
{props.description}
} {props.children} ); diff --git a/src/context/intermediate/modals/Prompt.tsx b/src/context/intermediate/modals/Prompt.tsx index 109e47a0..a50c6290 100644 --- a/src/context/intermediate/modals/Prompt.tsx +++ b/src/context/intermediate/modals/Prompt.tsx @@ -228,9 +228,11 @@ export const SpecialPromptModal = observer((props: SpecialProps) => { ]} content={ <> - +
+ +
, + children: , + plain: true, }, ]}> {/* Preact / React typing incompatabilities */}