Merge pull request #2 from lonkaars/nextjs

move from react routing thingy to next.js

1 files changed, 33 insertions, 0 deletions

diff --git a/components/dialogBox.tsx b/components/dialogBox.tsx
new file mode 100644
index 0000000..5ef5c3f
--- /dev/null
+++ b/components/dialogBox.tsx
@@ -0,0 +1,33 @@
+import { ReactNode, CSSProperties } from 'react';
+
+import { Vierkant } from './ui';
+
+import CancelIcon from '@material-ui/icons/Cancel';
+
+export function DialogBox(props: {
+	children: ReactNode;
+	title: string;
+	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,
+		...props.style
+	}}>
+		<h2 style={{ marginBottom: 24 }}>{props.title}</h2>
+		<span onClick={props.onclick}>
+		<CancelIcon style={{
+			position: "absolute",
+			top: 25, right: 25,
+			color: "var(--text)",
+			opacity: .85,
+			cursor: "pointer"
+		}}/>
+		</span>
+		{props.children}
+	</Vierkant>
+}