From eaa730d2895f57d9745ea2474e02d194ea16f48d Mon Sep 17 00:00:00 2001
From: Paul Oliver <contact@pauloliver.dev>
Date: Sat, 21 Mar 2026 01:36:24 +0100
Subject: Adds data server (WIP)

---
 data/vue/Section.vue | 40 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 data/vue/Section.vue

(limited to 'data/vue/Section.vue')

diff --git a/data/vue/Section.vue b/data/vue/Section.vue
new file mode 100644
index 0000000..6977ac6
--- /dev/null
+++ b/data/vue/Section.vue
@@ -0,0 +1,40 @@
+<template>
+  <h2 class="section_header" @click="section_toggle">
+    {{ name }} <span class="section_button">{{ visible ? '-' : '+' }}</span>
+  </h2>
+  <div :class="{ section_grid: grid }" v-show="visible">
+    <slot></slot>
+  </div>
+</template>
+
+<script setup>
+import { defineProps, ref } from 'vue'
+
+const props = defineProps({ name: String, grid: Boolean })
+const visible = ref(true)
+const section_toggle = () => visible.value = !visible.value
+</script>
+
+<style>
+.section_header {
+  border-bottom: 1px solid #586e75;
+  cursor: pointer;
+  font-size: 18px;
+  font-weight: normal;
+}
+
+.section_button {
+  font-family: monospace;
+}
+
+.section_grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+}
+
+@media screen and (max-width: 800px) {
+  .section_grid {
+    grid-template-columns: 1fr;
+  }
+}
+</style>
-- 
cgit v1.2.3-70-g09d2