feat : ajout loader skeleton
This commit is contained in:
17
frontend/components/skeleton/skeletonForm.vue
Normal file
17
frontend/components/skeleton/skeletonForm.vue
Normal file
@@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<div class="grid grid-cols-2 items-start gap-y-8 gap-x-40 mb-16">
|
||||
<UiSkeletonBlock height="48px"/>
|
||||
<div class="flex flex-col gap-2" v-for="i in 9">
|
||||
<UiSkeletonBlock width="96px"/>
|
||||
<UiSkeletonBlock width="100%" height="42px"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-center">
|
||||
<UiSkeletonBlock
|
||||
width="272px"
|
||||
height="50px"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
13
frontend/components/skeleton/skeletonTable.vue
Normal file
13
frontend/components/skeleton/skeletonTable.vue
Normal file
@@ -0,0 +1,13 @@
|
||||
<template>
|
||||
<div class="ps-20">
|
||||
<UiSkeletonBlock height="48px" class="my-4"/>
|
||||
<div class="grid grid-cols-3 justify-evenly bg-slate-100 py-4">
|
||||
<UiSkeletonBlock v-for="i in 3"/>
|
||||
</div>
|
||||
<div
|
||||
class="grid grid-cols-3 gap-4 px-4 py-4 text-sm hover:bg-slate-50 cursor-pointer border-t border-slate-200"
|
||||
v-for="i in 3">
|
||||
<UiSkeletonBlock v-for="i in 3"/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user