| 1 |
- .my-box{height:100vh;background:#fff;overflow-y:auto}.my-box .my-content{display:flex;flex-direction:column;align-items:center;padding-bottom:80rpx}.my-box .my-top{height:260rpx;background-image:url(https://images.unsplash.com/photo-1558591710-4b4a1ae0f04d?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwyMDUzMDJ8MHwxfHNlYXJjaHw1fHxhYnN0cmFjdHxlbnwxfHx8fDE2NTI4OTYzNTU&ixlib=rb-1.2.1&q=80&w=1080);background-position:50%;background-size:cover;background-repeat:no-repeat;width:100%}.my-box .my-avatar{width:200rpx;height:200rpx;border-radius:50%;margin-top:-100rpx;border:6rpx solid #fff;background:#eee}.my-box .name{font-size:20px;font-weight:700;margin:10rpx 0}.my-box .organization{color:#8c8c8c;font-weight:300}.my-box .my-tab{width:100%;padding:0 30rpx;box-sizing:border-box;margin:40rpx 0}.my-box .my-tab .tab-box{height:160rpx;border-radius:24rpx;box-shadow:1px 1px 12px hsla(0,0%,64.3%,.25);display:flex;align-items:center}.my-box .my-tab .tab-item{flex:1;text-align:center}.my-box .my-tab .tab-number{font-size:40rpx;font-weight:600}.my-box .my-tab .tab-text{font-size:24rpx;font-weight:300;margin-top:10rpx}.my-box .my-list{width:100%;padding:0 30rpx;box-sizing:border-box}.my-box .my-list .my-list-box{border-radius:24rpx;box-shadow:1px 1px 12px hsla(0,0%,64.3%,.25);overflow:hidden}.my-box .my-list .my-item{display:flex;align-items:center;padding:20rpx 30rpx}.my-box .my-list .my-item:active{background:#f2f2f2}.my-box .my-list .my-icon{width:80rpx;height:80rpx;border-radius:16rpx;display:flex;align-items:center;justify-content:center;margin-right:20rpx;background:#c1c0c8}.my-box .my-list .my-icon.bg1{background:#88d498}.my-box .my-list .my-icon.bg2{background:#ffb997}.my-box .my-list .my-icon.bg3{background:#7ad9ff}.my-box .my-list .my-icon.bg4{background:#9ac0cd}.my-box .my-list .my-icon.bg5{background:#40e0d0}.my-box .my-list .my-forward{height:40rpx}.my-box .my-list .item-content{flex:1;width:0;overflow:hidden;font-weight:700}
|
