💄 居中

This commit is contained in:
目棃
2025-02-04 12:11:19 +08:00
parent 25fdbd8444
commit dfa9251ae9

View File

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