.containers{ padding-top: 0; } .mine-top{ margin-top: 16rpx; position: relative; width: 732rpx; height: 220rpx; display: flex; align-items: center; background: #fff; border-radius: 20rpx; } .avatar-box { margin: 50rpx 0 50rpx 50rpx; width: 120rpx; height: 120rpx; border-radius: 50%; } .avatar-box image{ width: 100%; height: 100%; border-radius: 50%; } .mine-info{ margin-left: 24rpx; } .mine-info :nth-child(1){ width: 308rpx; height: 44rpx; font-size: 32rpx; color: #030303; } .mine-info :nth-child(2){ width: 422rpx; height: 38rpx; font-size: 30rpx; color: #8F8E94; } .mine-top .edit{ position: absolute; right: 0; bottom: 0; width: 72rpx; height: 72rpx; display: flex; align-items: center; justify-content: center; background: #C3C3C3; border-radius: 20rpx 0 20rpx 0; } .mine-top .edit .icon{ width: 48rpx; height: 48rpx; background: #FFFFFF; } .category{ margin-top: 8rpx; position: relative; width: 732rpx; height: 180rpx; display: flex; align-items: center; border-radius: 20rpx; background: #fff; font-weight: 500; font-family: SourceHanSansSC-regular; color: #030303; } .attentionCount{ position: absolute; top: 20rpx; left: 313rpx; width: 50rpx; height: 44rpx; line-height: 44rpx; text-align: center; color: red; font-size: 28rpx; font-weight: lighter; } .category text{ color: #959595; font-weight: 500; font-size: 36rpx; } .play,.attention,.point,.red-flower{ flex: 1; text-align: center; } .wallet,.grouping,.reader,.keep,.attention-me{ margin-top: 8rpx; width: 732rpx; height: 120rpx; background: #FFFFFF; border-radius: 20rpx; display: flex; align-items: center; justify-content: space-between; } .wallet-title,.grouping-title,.reader-title,.keep-title,.attention-me-title{ margin-left: 50rpx; } .image-box{ display: inline-block; width: 56rpx; height: 56rpx; } .wallet image,.grouping image,.reader image,.keep image,.attention-me image{ width: 100%; height: 100%; vertical-align: bottom; } .wallet .text,.grouping .text,.reader .text,.keep .text,.attention-me .text{ display: inline-block; margin-left: 14rpx; font-size: 36rpx; color: #101010; } .wallet .wallet-detail,.grouping .grouping-detail,.reader-detail,.keep-detail,.attention-me-detail{ width: 48rpx; height: 48rpx; line-height: 48rpx; color: #101010; text-align: center; margin-right: 20rpx; }