wohoo cool new stuff (json generation, better layouts, more to come)

src/layouts/baseSection.astro

@@ -0,0 +1,46 @@
+---
+export interface Props {
+	title: string;
+}
+
+const { title } = Astro.props;
+---
+
+<div>
+    <h1>{title}</h1>
+    <div>
+        <slot />
+    </div>
+</div>
+
+<style>
+    div {
+    	display: flex;
+    	flex-direction: column;
+    	justify-content: center;
+    	text-align: center;
+	}
+    div > div {
+    	row-gap: 1em;
+    	column-gap: 1em;
+    	justify-content: center;
+    	align-self: center;
+    	display: flex;
+    	flex-flow: row wrap;
+    	padding: 1em;
+		position: relative;
+	}
+    div > h1 {
+        color: white;
+        margin: 0.5rem 0px;
+        padding: 0.25rem 0.75rem;
+        width: max-content;
+        background-color: #1e1e1e;
+    }
+	@media(min-width: 512px) {	
+    	div {
+    		row-gap: 1.5em;
+    		column-gap: 1.5em;
+    	}
+	}
+</style>