🎨 头像展示效果调整

This commit is contained in:
x ronger 2020-09-14 20:59:56 +08:00
parent 179cac9a97
commit 9de574ceba

View File

@ -7,7 +7,7 @@
<div v-else class="card-header"
:style="{backgroundImage:'url(https://static.rymcu.com/article/1574441651963.jpg)', backgroundSize:'cover', backgroundPosition:'50%'}"></div>
<div class="card-body text-center">
<img v-if="user.avatarUrl" class="card-profile-img" :src="user.avatarUrl">
<img v-if="user.avatarUrl" class="card-profile-img-avatar" :src="user.avatarUrl">
<img v-else class="card-profile-img" src="https://static.rymcu.com/article/1578475481946.png">
<h3 class="mb-3">{{ user.nickname }}</h3>
<p class="mb-4" v-html="user.signature"></p>
@ -127,6 +127,7 @@ export default {
},
mounted() {
let _ts = this;
this.$store.commit('setActiveMenu', 'user')
if (_ts.oauth) {
_ts.$axios.$get('/api/follow/is-follow', {
params: {
@ -202,8 +203,19 @@ body {
}
.card-profile-img {
max-width: 6rem;
margin-top: -5rem;
max-width: 16rem;
margin-top: -7rem;
margin-bottom: 1rem;
border: 3px solid #fff;
border-radius: 100%;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
background-color: #ffffff;
}
.card-profile-img-avatar {
max-width: 16rem;
height: auto;
margin-top: -10rem;
margin-bottom: 1rem;
border: 3px solid #fff;
border-radius: 100%;