168 lines
3.2 KiB
Plaintext
168 lines
3.2 KiB
Plaintext
/* packageE/loveRanking/loveRanking.wxss */
|
|
|
|
view,
|
|
icon,
|
|
text {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.wrapper {
|
|
position: relative;
|
|
}
|
|
|
|
.wrapper .bg {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 12rem;
|
|
background-image: url(https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/axphb_bg@2x.png);
|
|
background-size: cover;
|
|
}
|
|
|
|
.wrapper .content {
|
|
position: absolute;
|
|
width: 100%;
|
|
min-height: calc(100vh - 2.938rem - 11rem);
|
|
top: 11rem;
|
|
left: 0;
|
|
background: #fff;
|
|
border-radius: 1rem 1rem 0 0;
|
|
padding: 1rem;
|
|
}
|
|
|
|
.wrapper .content .userInfo {
|
|
width: 700rpx;
|
|
height: 154rpx;
|
|
padding: 0 1rem;
|
|
background-color: #fff;
|
|
box-shadow: 0.1rem 0.1rem 0.5rem 0.5rem rgba(101, 101, 101, 0.05);
|
|
display: grid;
|
|
grid-template-columns: 80rpx 80rpx 1fr 120rpx 120rpx;
|
|
grid-column-gap: 20rpx;
|
|
}
|
|
|
|
.wrapper .content .userInfo .c1 {
|
|
width: 80rpx;
|
|
color: #018ced;
|
|
font-size: 1rem;
|
|
}
|
|
|
|
/* .wrapper .content .userInfo .c2{} */
|
|
|
|
.wrapper .content .userInfo .c2 image {
|
|
width: 72rpx;
|
|
height: 72rpx;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.wrapper .content .userInfo .c3 {
|
|
width: 200rpx;
|
|
height: 154rpx;
|
|
line-height: 154rpx;
|
|
font-size: 0.875rem;
|
|
color: #171732;
|
|
overflow: hidden;/* 超出部分隐藏 */
|
|
white-space: nowrap;/* 不换行 */
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.wrapper .content .userInfo .c4 {
|
|
justify-content: center;
|
|
color: #018ced;
|
|
}
|
|
|
|
.wrapper .content .userInfo .c5 {
|
|
justify-content: center;
|
|
font-size: 0.875rem;
|
|
color: #018ced;
|
|
}
|
|
|
|
.wrapper .content .userInfo .c1,
|
|
.wrapper .content .userInfo .c2,
|
|
.wrapper .content .userInfo .c4,
|
|
.wrapper .content .userInfo .c5 {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.wrapper .content .listData {
|
|
padding-top: 2rem;
|
|
}
|
|
|
|
.wrapper .content .listData .item {
|
|
display: grid;
|
|
grid-template-columns: 100rpx 100rpx 1fr 130rpx 90rpx;
|
|
grid-column-gap: 15rpx;
|
|
height: 108rpx;
|
|
}
|
|
|
|
.wrapper .content .listData .item .c1 {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.wrapper .content .listData .item .c1 image {
|
|
width: 72rpx;
|
|
height: 72rpx;
|
|
}
|
|
|
|
.wrapper .content .listData .item .c3 {
|
|
letter-spacing: 0.044rem;
|
|
color: #2c2f32;
|
|
width: 200rpx;
|
|
}
|
|
|
|
.wrapper .content .listData .item .c4 {
|
|
letter-spacing: 0.044rem;
|
|
color: #000;
|
|
text-align: center;
|
|
}
|
|
|
|
.wrapper .content .listData .head {
|
|
color: #b4b6b8;
|
|
height: 2rem;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.wrapper .content .listData .head .c1,
|
|
.wrapper .content .listData .head .c2,
|
|
.wrapper .content .listData .head .c3,
|
|
.wrapper .content .listData .head .c4,
|
|
.wrapper .content .listData .head .c5 {
|
|
font-size: 24rpx;
|
|
color: #b4b6b8;
|
|
}
|
|
|
|
.wrapper .content .listData .child .c2 {
|
|
height: 3rem;
|
|
}
|
|
|
|
.wrapper .content .listData .child .c2 image {
|
|
width: 2rem;
|
|
height: 2rem;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.wrapper .content .listData .child .c3 {
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.wrapper .content .listData .item .c2,
|
|
.wrapper .content .listData .item .c5 {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.wrapper .content .listData .child .c3,
|
|
.wrapper .content .listData .child .c4 {
|
|
line-height: 3rem;
|
|
overflow: hidden;/* 超出部分隐藏 */
|
|
white-space: nowrap;/* 不换行 */
|
|
text-overflow: ellipsis;
|
|
}
|