From 38cd0b1653c8f19713cb2e1b311d0505fd57de2d Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Tue, 4 Feb 2025 23:42:42 +0330
Subject: [PATCH] added avatar component

---
 frontend/components/global/Avatar.vue | 30 +++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 frontend/components/global/Avatar.vue

diff --git a/frontend/components/global/Avatar.vue b/frontend/components/global/Avatar.vue
new file mode 100644
index 0000000..1b2111e
--- /dev/null
+++ b/frontend/components/global/Avatar.vue
@@ -0,0 +1,30 @@
+<script setup lang="ts">
+// types
+
+type Props = {
+    src: string;
+    alt: string;
+};
+
+// props
+
+defineProps<Props>();
+</script>
+
+<template>
+    <AvatarRoot
+        class="bg-black inline-flex size-[45px] select-none items-center justify-center overflow-hidden rounded-full align-middle"
+    >
+        <AvatarImage
+            class="h-full w-full rounded-[inherit] object-cover"
+            :src="src"
+            :alt="alt"
+        />
+        <AvatarFallback
+            class="text-slate-300 leading-1 flex h-full w-full items-center justify-center bg-white text-sm font-medium"
+            :delay-ms="600"
+        >
+            {{ alt }}
+        </AvatarFallback>
+    </AvatarRoot>
+</template>