From dfa9251ae97700173114803005bc037dab812ffb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=9B=AE=E6=A3=83?= <BT-Muli@outlook.com>
Date: Tue, 4 Feb 2025 12:11:19 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20=E5=B1=85=E4=B8=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/viewPost/tp-avatar.vue | 34 ++++++++++++++++++++-------
 1 file changed, 26 insertions(+), 8 deletions(-)

diff --git a/src/components/viewPost/tp-avatar.vue b/src/components/viewPost/tp-avatar.vue
index 764493f6..a4082d3a 100644
--- a/src/components/viewPost/tp-avatar.vue
+++ b/src/components/viewPost/tp-avatar.vue
@@ -5,14 +5,12 @@
       <div :title="authorDesc">{{ authorDesc }}</div>
     </div>
     <div class="tpa-img">
-      <TMiImg :ori="true" :src="props.data.avatar_url" alt="avatar" class="tpa-icon" />
-      <TMiImg
-        :ori="true"
-        :src="props.data.pendant"
-        alt="pendant"
-        class="tpa-pendant"
-        v-if="props.data.pendant !== ''"
-      />
+      <div class="tpa-icon">
+        <TMiImg :ori="true" :src="props.data.avatar_url" alt="avatar" />
+      </div>
+      <div v-if="props.data.pendant !== ''" class="tpa-pendant">
+        <TMiImg :ori="true" :src="props.data.pendant" alt="pendant" />
+      </div>
       <div
         :class="{
           'tpa-level-left': props.position === 'left',
@@ -97,18 +95,38 @@ const levelColor = computed<string>(() => {
   position: absolute;
   top: 5px;
   left: 5px;
+  display: flex;
   width: 40px;
   height: 40px;
+  align-items: center;
+  justify-content: center;
   border-radius: 50%;
   background: var(--common-shadow-1);
+
+  img {
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    object-fit: contain;
+  }
 }
 
 .tpa-pendant {
   position: absolute;
   top: 0;
   left: 0;
+  display: flex;
   width: 50px;
   height: 50px;
+  align-items: center;
+  justify-content: center;
+
+  img {
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    object-fit: contain;
+  }
 }
 
 .tpa-level-left,