Fun/TeyvatGuide
1
0
Fork 0
mirror of https://github.com/BTMuli/TeyvatGuide.git synced 2025-12-12 09:18:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

💄 居中

Browse Source
This commit is contained in:
目棃
2025-02-04 12:11:19 +08:00
parent 25fdbd8444
commit dfa9251ae9
1 changed files with 26 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/components/viewPost/tp-avatar.vue
View File

@@ -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,