🎉 Initial Commit

application/components/brand/header.vue

@@ -0,0 +1,3 @@
+<template>
+  <div>Fuxi</div>
+</template>

application/components/helpful-links.vue

@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <nuxt-link to="/about">About</nuxt-link>
+  </div>
+</template>

application/components/problems/list.vue

@@ -0,0 +1,30 @@
+<template>
+  <div>
+    <n-card segmented content-style="padding: 0">
+      <template #header>
+        <div>Problems</div>
+        <div class="text-xs font-normal">每天进步一点点！</div>
+      </template>
+      <n-list clickable hoverable>
+        <n-list-item v-for="item in (problems as any[])" class="px-[24px]">
+          <n-thing :title="item?.title">
+            <template #description>
+              <div class="text-xs flex gap-2">
+                <n-tag size="tiny" class="case-capital">{{ item?.type }}</n-tag>
+                <div>Published at {{ new Date(item?.created_at).toLocaleString() }}</div>
+              </div>
+            </template>
+          </n-thing>
+        </n-list-item>
+      </n-list>
+    </n-card>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { NCard, NList, NListItem, NThing, NTag } from "naive-ui";
+
+const client = useSupabaseClient();
+
+const { data: problems } = await client.from("problems").select(`*`).limit(20);
+</script>