vt3e.cat
wip bsky client for the web & android
bbell.vt3e.cat
1<script setup lang="ts">
2defineProps<{
3 width?: string;
4 height?: string;
5 circle?: boolean;
6}>();
7</script>
8
9<template>
10 <div class="skeleton" :class="{ circle }" :style="{ width, height }"></div>
11</template>
12
13<style scoped>
14.skeleton {
15 background-color: hsl(var(--surface0));
16 border-radius: var(--radius-sm);
17 animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
18}
19.circle {
20 border-radius: 50%;
21}
22
23@keyframes pulse {
24 0%,
25 100% {
26 opacity: 1;
27 }
28 50% {
29 opacity: 0.5;
30 }
31}
32</style>