From 9b2d93642e2c94ed96d08858f9e0f737eeba5489 Mon Sep 17 00:00:00 2001
From: lonkaars <l.leblansch@gmail.com>
Date: Tue, 5 Jan 2021 20:39:59 +0100
Subject: home pagina klaar

---
 src/components/vierkant.tsx | 34 +++++++++++++++++++---------------
 1 file changed, 19 insertions(+), 15 deletions(-)

(limited to 'src/components/vierkant.tsx')

diff --git a/src/components/vierkant.tsx b/src/components/vierkant.tsx
index 6140e7a..588d73d 100644
--- a/src/components/vierkant.tsx
+++ b/src/components/vierkant.tsx
@@ -1,20 +1,24 @@
-import { Component, CSSProperties } from "react";
+import { ReactNode } from "react";
 
-var VierkantStyle: CSSProperties = {
-	padding: 24,
-	backgroundColor: "var(--background)",
-	borderRadius: 8,
-	color: "var(--text)",
-	margin: 6, // geen margin collapse = 12px marge
-	display: "inline-block",
-	position: "relative"
+interface VierkantProps {
+	href?: string;
+	width?: string;
+	height?: string;
+	children?: ReactNode;
 }
 
-export class Vierkant extends Component {
-	render () {
-		return <div style={VierkantStyle}>
-			{this.props.children}
-		</div>
-	}
+export function Vierkant(props: VierkantProps) {
+	return <a style={{
+		padding: 24,
+		backgroundColor: "var(--background)",
+		borderRadius: 8,
+		color: "var(--text)",
+		margin: 6, // geen margin collapse = 12px marge
+		display: "inline-block",
+		position: "relative",
+		boxSizing: "border-box",
+		width: props.width ? props.width : undefined,
+		height: props.height ? props.height : undefined,
+	}} href={props.href}>{props.children}</a>
 }
 
-- 
cgit v1.2.3