From bc1712196bf0a87669b25da659bd2243b63c1bbb Mon Sep 17 00:00:00 2001
From: Rachel Lambda Samuelsson <depsterr@protonmail.com>
Date: Wed, 17 Jul 2024 23:19:27 +0200
Subject: [PATCH] cv boxes

---
 src/components/TheBox.vue | 25 +++++++++++++++++++++++++
 src/pages/cv.vue          | 30 ++++++++++++++++++++++++++++++
 2 files changed, 55 insertions(+)
 create mode 100644 src/components/TheBox.vue
 create mode 100644 src/pages/cv.vue

diff --git a/src/components/TheBox.vue b/src/components/TheBox.vue
new file mode 100644
index 0000000..2772689
--- /dev/null
+++ b/src/components/TheBox.vue
@@ -0,0 +1,25 @@
+<script setup lang="ts">
+export interface Props {
+  rows?: number
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  rows: 1
+})
+
+</script>
+
+<template>
+  <div class="box">
+    <slot></slot>
+  </div>
+</template>
+
+<style scoped>
+.box {
+  border-radius: 5px;
+  background-color: #e5d9c7;
+  padding: 1em;
+  grid-row-end: span v-bind(props.rows);
+}
+</style>
diff --git a/src/pages/cv.vue b/src/pages/cv.vue
new file mode 100644
index 0000000..e800b69
--- /dev/null
+++ b/src/pages/cv.vue
@@ -0,0 +1,30 @@
+<script setup lang="ts">
+import TheBox from '../components/TheBox.vue'
+</script>
+
+<template>
+<article>
+  <TheBox :rows="2">
+  mjau mjau mjau
+  mjau mjau mjau
+  </TheBox>
+  <TheBox>
+  mjau mjau mjau
+  </TheBox>
+  <TheBox>
+  mjau mjau mjau
+  </TheBox>
+  <TheBox>
+  mjau mjau mjau
+  </TheBox>
+</article>
+</template>
+
+<style scoped>
+article {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 1em;
+    grid-auto-flow: row dense;
+}
+</style>