skeleton loader

src/components/Skeleton/SkeletonSidebarItem.vue

@@ -0,0 +1,18 @@
+<script setup lang="ts">
+const props = withDefaults(
+  defineProps<{
+    n?: number
+  }>(),
+  { n: 1 }
+)
+</script>
+<template>
+  <div class="flex w-full animate-pulse flex-col">
+    <div class="h-[1.35rem] w-full rounded bg-secondary mt-1" v-for="i in props.n" :key="i"></div>
+  </div>
+</template>
+<style scoped>
+.bg-secondary {
+  @apply bg-secondary/25;
+}
+</style>