feat(detailedReport): 详细报告身体指标卡片静态实现

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
17792275749
2026-08-20 10:18:33 +08:00
co-authored by Claude Opus 4.7
parent 01bbcdecaf
commit 1f5cc2c743
3 changed files with 276 additions and 90 deletions
@@ -307,6 +307,91 @@
}
}
}
/* 指标卡片 */
.metricCard {
width: 100%;
border-radius: 24rpx;
background-color: #FFFFFF;
margin-bottom: 24rpx;
.metricCardTitle {
width: 100%;
height: 96rpx;
display: flex;
flex-wrap: nowrap;
align-items: center;
padding: 0 32rpx;
box-sizing: border-box;
border-bottom: 2rpx solid #EAECF1;
.metricCardBar {
width: 6rpx;
height: 20rpx;
border-radius: 4rpx;
background-color: #1385FA;
margin-right: 16rpx;
}
.metricCardTitleText {
color: #252535;
height: 32rpx;
font-size: 32rpx;
line-height: 32rpx;
}
}
.metricCardList {
width: 100%;
padding: 0 32rpx 40rpx;
box-sizing: border-box;
.metricCardRow {
width: 100%;
display: flex;
align-items: center;
padding: 20rpx 0;
border-bottom: 2rpx dashed #EAECF1;
.metricCardLabel {
flex: 1;
color: #77849E;
height: 28rpx;
font-size: 28rpx;
line-height: 28rpx;
}
.metricCardValue {
color: #252535;
height: 28rpx;
font-size: 28rpx;
line-height: 28rpx;
margin-right: 24rpx;
}
.metricCardStatus {
height: 40rpx;
padding: 0 10rpx;
border-radius: 8rpx;
font-size: 24rpx;
line-height: 40rpx;
color: #FFFFFF;
}
.metricCardStatus--normal {
background-color: #2AC79F;
}
.metricCardStatus--low {
background-color: #1385FA;
}
.metricCardStatus--high {
background-color: #F24439;
}
}
}
}
}
}
}