add more custom item in index

src/components/SimpleVideoCard.vue

@@ -0,0 +1,34 @@
+<script setup lang="ts">
+import { VideoCollectVideo } from '@/api/api-models'
+import { NCard, NEllipsis, NImage, NText } from 'naive-ui'
+
+const props = defineProps<{
+  video: VideoCollectVideo
+  width?: number
+}>()
+</script>
+
+<template>
+  <NCard size="small" hoverable :style="`max-width: ${width ?? 300}px;`">
+    <template #cover>
+      <NImage :src="video.cover" :img-props="{ referrerpolicy: 'no-referrer' }" />
+    </template>
+    <template #header>
+      <a :href="`https://bilibili.com/video/${video.id}`" target="_blank">
+        <NText>
+          <NEllipsis>{{ video.title }}</NEllipsis>
+        </NText>
+      </a>
+    </template>
+    <NText depth="3" style="white-space: pre-line">
+      <NEllipsis>
+        {{ video.description }}
+        <template #tooltip>
+          <div style="white-space: pre-line; max-width: 300px">
+            {{ video.description }}
+          </div>
+        </template>
+      </NEllipsis>
+    </NText>
+  </NCard>
+</template>