ittwxcust/pages/appointment/appointment.wxss

/* pages/appointment/appointment.wxss */
.appointment {
  width: 100%;
  height: 100%;
  background: #F7F7F7;
}
.main-con {
  width: 690rpx;
  min-height: 100%;
  margin: 0 auto;
  overflow-y: auto;
  padding-bottom: 50rpx;
}
.ac-title {
  width: 100%;
  height: 82rpx;
  font-size: 30rpx;
  font-weight: 600;
  color: #333333;
  line-height: 82rpx;
}
.ac-card {
  width: 690rpx;
  height: 160rpx;
  background: #FFFFFF;
  border-radius: 20rpx;
}
.ac-item {
  width: 50%;
  height: 100%;
}
.ac-avat {
  width: 80rpx;
  height: 80rpx;
  border-radius: 50%;
  background-color: #f66;
  margin: 0 14rpx 0 20rpx;
}
.ac-name {
  font-size: 30rpx;
  font-weight: 600;
  color: #333333;
}
.ac-right {
  justify-content: flex-end;
  align-items: baseline;
  line-height: 160rpx;
}
.ac-count {
  font-size: 48rpx;
  font-weight: 600;
  color: #333333;
}
.ac-unit {
  font-size: 26rpx;
  font-weight: 400;
  color: #333333;
  margin: 0 20rpx 0 10rpx;
}
.address {
  width: 100%;
  min-height: 100rpx;
}
.ad-title {
  font-size: 30rpx;
  font-weight: 600;
  color: #333333;
  margin: 40rpx 0 20rpx 0;
}
.no-address {
  width: 248rpx;
  height: 60rpx;
  background: var(--maincolor);
  border-radius: 10rpx;
  font-size: 26rpx;
  font-weight: 400;
  color: #FFFFFF;
}
.address-card {
  width: 100%;
  height: 194rpx;
  background: #FFFFFF;
  border-radius: 20rpx;
}
.ad-left {
  width: calc(70% - 20rpx);
  height: 100%;
  padding-left: 20rpx;
}
.ad-right {
  width: 30%;
  height: 100%;
}
.chose-address-btn {
  width: 144rpx;
  height: 60rpx;
  border-radius: 10rpx;
}
.ad-top {
  height: 92rpx;
  width: 100%;
}
.ad-name {
  font-size: 30rpx;
  font-weight: 600;
  color: #333333;
  margin-right:20rpx;
}
.ad-phone {
  font-size: 26rpx;
  font-weight: 400;
  color: #999999;
}
.address-detail {
  font-size: 26rpx;
  font-weight: 400;
  color: #333333;
  line-height: 36rpx;
}
.ad-tips {
  font-size: 26rpx;
  font-weight: 400;
  color: #9A1D16;
  margin-top: 20rpx;
}
.ca-title {
  font-size: 30rpx;
  font-weight: 600;
  color: #333333;
  margin: 40rpx 0 20rpx 0;
}
.calendar-card {
  width: 690rpx;
  min-height: 500rpx;
  background: #FFFFFF;
  border-radius: 20rpx;
  border-bottom: 1rpx solid #DDDDDD;
}
.calendar-card-header {
  width: 100%;
  height: 84rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.curr-date {
  font-size: 32rpx;
  font-weight: 600;
  color: #333333;
  margin-left: 20rpx;
}
.warn-icon {
  width: 20rpx;
  height: 20rpx;
  background: #9A1D16;
  border-radius: 50%;
}
.warn-text{
  font-size: 26rpx;
  font-weight: 400;
  color: #333333;
  margin: 0 20rpx 0 10rpx;
}
.calendar {
  --calendar-height: 450rpx;
}
view .van-calendar__selected-day {
  width: 68rpx;
  height: 68rpx;
  border-radius: 50%;
}
view .van-calendar__month-title {
  display: none;
}
view .van-calendar__days {
  background-color: #fff;
}
.time-list {
  width: 100%;
  height: 148rpx;
  justify-content: space-around;
  background-color: #fff;
}
.time-item {
  width: 190rpx;
  height: 68rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #FFFFFF;
  border-radius: 10rpx;
  border: 1rpx solid #DDDDDD;
}
.t-text {
  font-size: 26rpx;
  font-weight: 400;
  color: #333333;
}
.time-nurse-text {
  font-size: 22rpx;
  font-weight: 400;
  color: #9A1D16;
}
.time-nurse {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.time-active {
  background-color: var(--maincolor);
}
.time-active .t-text{
  color: #fff;
}
.footer-actions {
  width: 100%;
  height: 80rpx;
  margin-top: 40rpx;
}
.f-btn {
  width: 324rpx;
  height: 80rpx;
  border-radius: 10rpx;
}
.cancel-btn {
  background-color: #F7F7F7;
  border: 1rpx solid #333333;
}