/* parents//pages/growth_track/growth_track.wxss */ @import '../../../templates/footer/footer.wxss'; @import '../../../templates/nodata/nodata.wxss'; @import '../../../templates/loading/loading.wxss'; page{ background: #fff; } .li{ margin: 0 40rpx 98rpx 40rpx; padding: 0; } .li-img{ height: 205rpx; width: 100%; margin: 40rpx 0; border-radius:20rpx; } ff-canvas { width: 100%; height: 100%; } .li-rank{ margin: 30rpx 0; padding: 0; } .li-rank-title{ color: #41414C; font-size: 36rpx; margin-bottom: 24rpx; } .li-rank-items{ position: relative; height: 157rpx; margin: 10rpx 0; } .li-rank-items-bg{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 10; } .li-rank-item{ position: relative; z-index: 100; top: 40rpx; display: flex; justify-content: space-between; font-size: 30rpx; color: #fff; padding: 0 53rpx; text-align: center; } .head-month{ width:226rpx; height:48rpx; border:2rpx solid rgba(0,183,255,1); border-radius:29rpx; text-align: center; line-height: 41rpx; color: rgba(0,183,255,1); font-size: 28rpx; margin: 30rpx auto; } .li-rank-item-content{ top: 45rpx; } .li-rank-item-month{ font-size: 26rpx; } .li-rank-item-img{ width: 180rpx; height: 83rpx; } .li-canvas{ width:100%; height: 400rpx; } .li-balls{ position: relative; margin: 40rpx 0; font-size: 28rpx; text-align: center; height: 400rpx; width: 100%; } .head-item-month{ margin: 70rpx 40rpx 0rpx 40rpx; } .li-balls-one{ width:170rpx; height:170rpx; background:rgba(119,143,242,0.8); border-radius:50%; color: #2342C5; position: absolute; top: 70rpx; left: 249rpx; } .li-balls-two{ width:135rpx; height:135rpx; background:rgba(0,183,255,0.56); border-radius:50%; color: #0073A0; position: absolute; top: 150rpx; left: 85rpx; } .li-balls-three{ width:59rpx; height:59rpx; background:rgba(121,189,232,0.8); border-radius:50%; position: absolute; top: 90rpx; left: 185rpx; } .li-balls-four{ width:141rpx; height:141rpx; background:rgba(250,202,106,0.8); border-radius:50%; color: #9D6F13; position: absolute; top: 0rpx; right: 100rpx; } .li-balls-five{ width:136rpx; height:136rpx; background:rgba(143,232,121,0.8); border-radius:50%; color: #3DB021; position: absolute; bottom: 85rpx; right: 80rpx; } .li-rank-biao{ background:rgba(246,245,251,1); border-radius:20rpx; padding: 0 32rpx 2rpx 32rpx; } .li-rank-biao-title{ color: #fff; background: blue; text-align: center; line-height: 72rpx; height: 72rpx; border-radius:0 0 20rpx 20rpx; margin: auto; width: 200rpx; } .li-rank-biao-num{ color: #6C6C80; font-size: 28rpx; padding: 30rpx 0; } .li-rank-canvas{ height: 400rpx; position: relative; color: #41414C; font-size: 26rpx; } .li-rank-canvas-text{ position: absolute; left: 40%; top: 44%; width: 142rpx; line-height: 52rpx; } .head-month-img{ width: 25rpx; height: 15rpx; margin: 5rpx 0rpx 0rpx 15rpx; } .head-item{ margin: 40rpx; } .picker-day{ width:20%; display:inline-block; font-weight:700; } .picker-Info{ width:20%; display:inline-block; float:right; margin-top:25rpx; font-size:30rpx; color:#00B7FF; text-align:center; } .picker{ width:20%; display:inline-block; } .sign_in_num{ font-family:PingFang SC; font-weight:500; color:rgba(65,65,76,1); font-size:32rpx; width:20%; display:inline-block; } .sign_in_proportion{ width:10%; float:right; margin: 0 10rpx; display:inline-block; font-size:30rpx; color:rgba(108,108,128,1); } .sign_in_percent{ width:60%; display:inline-block; } .sign_month{ bottom: 5%; margin:0 40rpx; background:#F6F5FB; border-radius:5%; line-height:120rpx; } .sign_month_num{ width:60%; margin-left:10%; display:inline-block; } .sign_month_info{ margin-right:40rpx; display:inline-block; float:right; font-weight:700; font-size:30rpx; color:#00B7FF; } page { width: 100%; height: 100%; } .left { width: 300rpx; height: 300rpx; display: flex; justify-content: center; align-items: center; position: relative; margin:0 auto; } .white { width: 136rpx; height: 136rpx; border-radius: 50%; position: absolute; top: 50%; left: 50%; z-index: 10; background-color: #fff; transform: translate(-50%, -50%); }