From abb370d701afa1319b9701a80b8fbdd31c680b06 Mon Sep 17 00:00:00 2001
From: BaboonKing <changfan.xu.up@gmail.com>
Date: Thu, 30 May 2024 16:31:22 +0800
Subject: [PATCH] feat: merge code of Avatar

---
 apps/client/components/user-home/index.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/apps/client/components/user-home/index.vue b/apps/client/components/user-home/index.vue
index c759fb376..d2d0de4ca 100644
--- a/apps/client/components/user-home/index.vue
+++ b/apps/client/components/user-home/index.vue
@@ -2,9 +2,12 @@
   <div class="mt-8 flex w-full justify-between">
     <!-- 左侧头像区域 -->
     <div class="mr-16 hidden w-72 md:block">
-      <div class="mx-auto h-56 w-56 overflow-hidden">
+      <div
+        class="mx-auto h-56 w-56 overflow-hidden rounded-full border-2 border-gray-300 bg-gray-300 dark:border-gray-700 dark:bg-gray-700"
+      >
+        <!-- 通过给定高度来自适应拉伸图片，如果图片不存在或者加载失败则显示外层的背景色（没有宽度） -->
         <img
-          class="h-full w-full rounded-full border-2 border-gray-300 bg-gray-300 object-cover dark:border-gray-700 dark:bg-gray-700"
+          class="h-full object-cover"
           :src="user?.avatar"
         />
       </div>