epdc-resident-mp-js/subpages/discussion/pages/discussionDetail/components/handleProgressItem/handleProgressItem.wxss

.handle-progress-item {
  width: 100%;
  height: auto;
  border-left: 1rpx solid #D9E2EA;
  box-sizing: border-box;
  padding-left: 30rpx;
  padding-bottom: 15rpx;
  position: relative;
  margin-bottom: 10rpx;
}

.handle-progress-item .item-type {
  position: absolute;
  top: 0;
  width: 50rpx;
  height: 40rpx;
  display: flex;
  justify-content: center;
  left: -25rpx;
  background: #fff;
}
.handle-progress-item .item-type .issue, .handle-progress-item .item-type .project {
  width: 46rpx;
  height: 26rpx;
  object-fit: cover;
  position: relative;
  top: 5rpx;
}
.handle-progress-item .item-type .point {
  width: 20rpx;
  height: 20rpx;
  border-radius: 50%;
  background: #c2ced8;
  position: relative;
  top: 10rpx;
}

.handle-progress-item .type {
  display: flex;
  align-items: center;
}
.handle-progress-item .type .type {
  font-size: 30rpx;
  color: #909DA7;
  height: 36rpx;
  line-height: 36rpx;
  text-indent: -12rpx;
}
.handle-progress-item .type .satisfy-image {
  width: 34rpx;
  height: 34rpx;
  object-fit: cover;
  margin: 0 6rpx 0 6rpx;
}
.handle-progress-item .type .satisfy-status {
  font-size: 24rpx;
  color: #333;
}

.handle-progress-item .time {
  font-size: 20rpx;
  color: #909DA7;
  height: 30rpx;
  line-height: 30rpx;
}

.handle-progress-item .handle-apartment {
  line-height: 50rpx;
  font-size: 32rpx;
  overflow: hidden;
}
.handle-progress-item .handle-apartment .title {
  color: #909DA7;
  width: 160rpx;
  float:left;
}
.handle-progress-item .handle-apartment .content {
  color: #333;
  width: calc(100% - 160rpx);
  float:left;
}

.handle-progress-item .blow-apartment {
  line-height: 45rpx;
  font-size: 32rpx;
  overflow: hidden;
}
.handle-progress-item .blow-apartment .title {
  color: #909DA7;
  width: 200rpx;
  float:left;
}
.handle-progress-item .blow-apartment .content {
  color: #333;
  width: calc(100% - 200rpx);
  float:left;
}
.handle-progress-item .blow-apartment .content .apartment + .apartment {
  margin-top: 10rpx;
}

.handle-progress-item .handle-advice {
  line-height: 45rpx;
  font-size: 32rpx;
  overflow: hidden;
  padding-bottom: 25rpx;
  border-bottom: 1rpx solid #D9E2EA;
}
.handle-progress-item .handle-advice .title {
  color: #909DA7;
  width: 160rpx;
  float:left;
}
.handle-progress-item .handle-advice .content {
  color: #333;
  width: calc(100% - 160rpx);
  float:left;
}
.handle-progress-item .handle-advice .content .image-list {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, 140rpx);
  grid-gap: 10rpx;
  grid-template-rows: 100rpx;
  margin-top: 15rpx;
}
.handle-progress-item .handle-advice .content .image-list image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8rpx;
}

.handle-progress-item .handle-advice .satisfaction-judgement-title {
  color: #F40D0D;
  width: 160rpx;
  float:left;
}
.handle-progress-item .handle-advice .satisfaction-judgement-content {
  color: #F40D0D;
  width: calc(100% - 160rpx);
  float:left;
}

.handle-progress-item .origin-association {
  line-height: 50rpx;
  font-size: 32rpx;
  overflow: hidden;
}
.handle-progress-item .origin-association .title {
  color: #909DA7;
  width: 160rpx;
  float:left;
}
.handle-progress-item .origin-association .content {
  color: #333;
  width: calc(100% - 160rpx);
  float:left;
}

.handle-progress-item .handle-operationer {
  line-height: 50rpx;
  font-size: 32rpx;
  overflow: hidden;
}
.handle-progress-item .handle-operationer .title {
  color: #909DA7;
  width: 130rpx;
  float:left;
}
.handle-progress-item .handle-operationer .content {
  color: #333;
  width: calc(100% - 130rpx);
  float:left;
}

.handle-progress-item .handler-phone {
  line-height: 45rpx;
  font-size: 32rpx;
  overflow: hidden;
}
.handle-progress-item .handler-phone .title {
  color: #909DA7;
  width: 190rpx;
  float:left;
}
.handle-progress-item .handler-phone .content {
  color: #333;
  width: calc(100% - 190rpx);
  float:left;
}