aboutsummaryrefslogtreecommitdiff
path: root/components/dialogBox.tsx
diff options
context:
space:
mode:
authorlonkaars <l.leblansch@gmail.com>2021-01-31 14:30:02 +0100
committerlonkaars <l.leblansch@gmail.com>2021-01-31 14:30:02 +0100
commitd2f537f86890949a0d29a5b1761628ea87a9b3c9 (patch)
tree0ba2503bbd88e51ab942c3d394243c1c2be90221 /components/dialogBox.tsx
parent0c947a9f7d4ff3f9e65d01df21d6d50e9fa51095 (diff)
editGameSettings dialog
Diffstat (limited to 'components/dialogBox.tsx')
-rw-r--r--components/dialogBox.tsx15
1 files changed, 9 insertions, 6 deletions
diff --git a/components/dialogBox.tsx b/components/dialogBox.tsx
index 74fe99b..5ef5c3f 100644
--- a/components/dialogBox.tsx
+++ b/components/dialogBox.tsx
@@ -1,23 +1,25 @@
-import { ReactNode } from 'react';
+import { ReactNode, CSSProperties } from 'react';
import { Vierkant } from './ui';
import CancelIcon from '@material-ui/icons/Cancel';
-interface DialogBoxProps {
+export function DialogBox(props: {
children: ReactNode;
title: string;
-}
-
-export function DialogBox(props: DialogBoxProps) {
+ style?: CSSProperties;
+ onclick?: () => void;
+}) {
return <Vierkant style={{
position: "fixed",
top: "50%", left: "50%",
transform: "translate(-50%, -50%)",
boxShadow: "0 8px 32px -5px #0007",
- width: 392
+ width: 392,
+ ...props.style
}}>
<h2 style={{ marginBottom: 24 }}>{props.title}</h2>
+ <span onClick={props.onclick}>
<CancelIcon style={{
position: "absolute",
top: 25, right: 25,
@@ -25,6 +27,7 @@ export function DialogBox(props: DialogBoxProps) {
opacity: .85,
cursor: "pointer"
}}/>
+ </span>
{props.children}
</Vierkant>
}