Add uses page

app/components/AppTitle.vue

@@ -0,0 +1,25 @@
+<script lang="ts" setup>
+defineProps({
+  title: {
+    type: String,
+    required: true
+  },
+  description: {
+    type: String,
+    required: true
+  }
+})
+</script>
+
+<template>
+  <div>
+    <h1
+      class="text-2xl font-bold tracking-tight text-zinc-800 dark:text-zinc-100"
+    >
+      {{ title }}
+    </h1>
+    <p class="mt-6 text-base text-gray-600 dark:text-gray-400">
+      {{ description }}
+    </p>
+  </div>
+</template>

app/components/uses/Item.vue

@@ -0,0 +1,22 @@
+<script lang="ts" setup>
+import type { PropType } from 'vue'
+import type { UsesItem } from '#components'
+
+defineProps({
+  item: {
+    type: Object as PropType<typeof UsesItem>,
+    required: true
+  }
+})
+</script>
+
+<template>
+  <li>
+    <p class="text-base font-semibold text-black dark:text-white">
+      {{ item.name }}
+    </p>
+    <p class="text-sm text-gray-600 dark:text-gray-400">
+      {{ item.description }}
+    </p>
+  </li>
+</template>