56 lines
992 B
SCSS
56 lines
992 B
SCSS
.nut-avatar {
|
|
position: relative;
|
|
display: inline-block;
|
|
flex: 0 0 auto; // 防止被压缩
|
|
text-align: center;
|
|
vertical-align: top;
|
|
background-repeat: no-repeat;
|
|
background-position: center center;
|
|
background-size: 100% 100%;
|
|
|
|
image {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.nut-icon {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
background-size: 100% 100%;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
}
|
|
|
|
.nut-avatar-large {
|
|
width: $avatar-large-width;
|
|
height: $avatar-large-height;
|
|
line-height: $avatar-large-height;
|
|
}
|
|
|
|
.nut-avatar-normal {
|
|
width: $avatar-normal-width;
|
|
height: $avatar-normal-height;
|
|
line-height: $avatar-normal-height;
|
|
}
|
|
|
|
.nut-avatar-small {
|
|
width: $avatar-small-width;
|
|
height: $avatar-small-height;
|
|
line-height: $avatar-small-height;
|
|
}
|
|
|
|
.nut-avatar-square {
|
|
border-radius: $avatar-square;
|
|
}
|
|
|
|
.nut-avatar-round {
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.nut-avatar-square,
|
|
.nut-avatar-round {
|
|
overflow: hidden;
|
|
}
|