武田小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

189 lines
4.6 KiB

page {
background-color: #f6f6f6;
}
.page {
.header {
padding: 32rpx;
background-color: #fff;
border-radius: 0 0 0 32rpx;
display: flex;
align-items: center;
justify-content: space-between;
gap: 48rpx;
.range {
padding: 0 20rpx;
display: flex;
align-items: center;
justify-content: space-between;
width: 390rpx;
background: #f6f6f6;
border-radius: 12rpx 12rpx 12rpx 12rpx;
.date {
flex: 1;
.date-content {
padding: 16rpx;
font-size: 28rpx;
color: #999999;
line-height: 1;
text-align: center;
}
}
.icon {
flex-shrink: 0;
width: 32rpx;
height: 32rpx;
}
}
.status {
flex: 1;
display: flex;
align-items: center;
gap: 16rpx;
.label {
font-size: 28rpx;
color: #141515;
}
.picker {
flex: 1;
.picker-content {
display: flex;
align-items: center;
justify-content: space-between;
padding: 16rpx;
font-size: 28rpx;
color: #999999;
line-height: 1;
text-align: center;
border-radius: 12rpx;
background-color: #f6f6f6;
}
}
}
}
.list {
padding: 32rpx;
.doctor {
position: relative;
padding: 32rpx;
background: linear-gradient(180deg, #e5f5f7 0%, #ffffff 50%);
box-shadow: 0rpx 4rpx 20rpx 0rpx rgba(0, 0, 0, 0.1);
border-radius: 16rpx 16rpx 16rpx 16rpx;
border: 2rpx solid #ffffff;
margin-bottom: 20rpx;
.d-status {
position: absolute;
top: 0;
right: 0;
width: 156rpx;
height: 50rpx;
}
.d-container {
display: flex;
gap: 24rpx;
&:last-of-type {
margin-bottom: 0;
}
.avatar {
flex-shrink: 0;
position: relative;
width: 112rpx;
height: 112rpx;
}
.wrap {
padding-top: 20rpx;
.w-header {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 16rpx;
line-height: 1;
.name {
font-size: 36rpx;
color: rgba(20, 21, 21, 1);
font-weight: bold;
}
.label {
font-size: 28rpx;
color: rgba(20, 21, 21, 1);
}
.line {
width: 1px;
height: 24rpx;
background-color: rgba(205, 205, 205, 1);
}
}
.w-container {
margin-top: 24rpx;
.hostipal {
margin-right: 12rpx;
font-size: 28rpx;
color: rgba(20, 21, 21, 1);
}
.tag {
margin-right: 12rpx;
display: inline-block;
padding: 0 8rpx;
border-radius: 4rpx;
font-size: 24rpx;
color: rgba(255, 255, 255, 1);
line-height: 32rpx;
background-color: rgba(0, 180, 197, 1);
}
.site {
display: inline-block;
padding: 0 8rpx;
font-size: 24rpx;
color: rgba(148, 87, 30, 1);
line-height: 32rpx;
border-radius: 4rpx;
background-color: rgba(250, 229, 206, 1);
}
}
.w-footer {
margin-top: 16rpx;
display: flex;
gap: 12rpx;
flex-wrap: wrap;
.wf-label {
flex-shrink: 0;
width: 48rpx;
height: 32rpx;
}
.wf-tag {
flex-shrink: 0;
padding: 0 8rpx;
font-size: 22rpx;
color: rgba(0, 180, 197, 1);
line-height: 32rpx;
border: 1px solid rgba(191, 239, 244, 1);
}
}
}
}
.d-footer {
margin-top: 32rpx;
padding: 0 32rpx;
background: #f6f6f6;
border-radius: 16rpx 16rpx 16rpx 16rpx;
.row {
padding: 32rpx 0;
display: flex;
border-bottom: 1px solid rgba(20, 21, 21, 0.08);
&:last-of-type {
border: none;
}
.label {
flex-shrink: 0;
margin-right: 16rpx;
font-size: 32rpx;
color: #999999;
}
.content {
font-size: 32rpx;
color: #141515;
}
}
}
}
}
}