Kieran/snort
5
14
Fork 14
Code Issues 37 Pull Requests 1 Packages Projects Releases 24 Wiki Activity

close image modal on image click

Browse Source
This commit is contained in:
Martti Malmi 2023-10-05 18:36:51 +03:00
parent d4a3e11d03
commit 234167b749
2 changed files with 6 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/app/src/Element/Deck/SpotlightMedia.tsx
View File

@ -74,7 +74,7 @@ export function SpotlightMedia(props: SpotlightMediaProps) {
export function SpotlightMediaModal(props: SpotlightMediaProps) {
return (
<Modal id="spotlight" onClose={props.onClose} className="spotlight">
<Modal id="spotlight" onClick={props.onClose} onClose={props.onClose} className="spotlight">
<SpotlightMedia {...props} />
</Modal>
);

6
packages/app/src/Element/Modal.tsx
View File

@ -5,6 +5,7 @@ export interface ModalProps {
id: string;
className?: string;
onClose?: (e: React.MouseEvent | KeyboardEvent) => void;
onClick?: (e: React.MouseEvent) => void;
children: ReactNode;
}
@ -28,7 +29,10 @@ export default function Modal(props: ModalProps) {
return (
<div className={`modal${props.className ? ` ${props.className}` : ""}`} onClick={props.onClose}>
<div className="modal-body" onClick={props.onClose}>
<div onClick={e => e.stopPropagation()}>{props.children}</div>
<div onClick={e => {
e.stopPropagation();
props.onClick?.(e);
}}>{props.children}</div>
</div>
</div>
);