init

src/components/settings/SettingsList.vue

@@ -0,0 +1,44 @@
+<script setup lang="ts">
+import {Divider} from "primevue";
+
+const items = [
+  {name: "Space settings", link: '/space-settings'},
+  {name: "Notification settings", link: '/notification-settings'},
+  {name: "Categories", link: '/categories'},
+  {name: "Recurrent Operations", link: '/recurrents'},
+  {name: "Recurrent Operations", link: '/recurrents'},
+  {name: "Recurrent Operations", link: '/recurrents'},
+  {name: "Recurrent Operations", link: '/recurrents'},
+  {name: "Recurrent Operations", link: '/recurrents'},
+  {name: "Recurrent Operations", link: '/recurrents'},
+  {name: "Recurrent Operations", link: '/recurrents'},
+  {name: "Recurrent Operations", link: '/recurrents'},
+  {name: "Recurrent Operations", link: '/recurrents'},
+  {name: "Recurrent Operations", link: '/recurrents'},
+  {name: "Recurrent Operations", link: '/recurrents'}
+]
+</script>
+
+<template>
+  <div class="overflow-y-auto">
+    <div class="card">
+      <router-link :to="items[item].link" v-for="item in items.keys()"
+                   class="flex flex-col  w-full gap-0 pl-5  items-start justify-items-center">
+
+        <div class="flex flex-row justify-between items-center w-full pe-2 p-2">
+
+          <span class="font-bold text-xl">{{ items[item].name }}</span>
+
+          <i class="pi pi-angle-right !text-xl !font-extralight"/>
+        </div>
+
+        <Divider v-if="item+1 != items.length" class="!p-2 !m-0"/>
+
+      </router-link>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+
+</style>