wxmp-wodeshebao/public/pages/public-view.wxss

/* customer-header-view */
.customer-header-view {
  width: 100%;
  height: 240rpx;
  background-color: #28AFF0;
  display: flex;
  flex-direction: column;
}

.customer-header-view>view {
  width: 100%;
  height: 240rpx;
  display: flex;
  flex-direction: column;
}

.customer-header-view>view text {
  color: white;
  margin-left: 30rpx;
}

.customer-header-view>view>text:nth-child(1) {
  font-size: 36rpx;
  margin-top: 48rpx;
}

.customer-header-view>view>text:nth-child(2) {
  font-size: 24rpx;
  margin-top: 8rpx;
}

.customer-header-view>image {
  width: 240rpx;
  height: 148rpx;
  margin-left: 466rpx;
  margin-top: -212rpx;
  display: block;
}

/* bottom-view-botton */

.bottom-view>button, .bottom-view-X>button {
  margin: 12rpx 20rpx 0;
  background-color: #3296FB;
  color: white;
  font-size: 32rpx;
  font-weight: bold;
  line-height: 90rpx;
  text-align: center;
  height: 90rpx;
  border-radius: 45rpx;
  z-index: 1000;
}

/* line */
.right-line, .line, .both-line {
  width: 100%;
  height: 0.7px;
  background-color: white;
}

.right-line>view, .line>view, .both-line>view {
  height: 0.7px;
  background-color: #eeeeee;
} 

.right-line>view {
  margin: 0 0 0 30rpx;
}

.both-line>view {
  margin: 0 30rpx;
}

.line>view {
  margin: 0 0;
}

/* tips-view */
.tips-view {
  width: 100%;
  display: flex;
  background-color: #FDF8EC;
}

.tips-view>view {
  display: flex;
  flex-direction: column;
  margin: 30rpx 30rpx;
}

.tips-view>view>view {
  display: flex;
}

.tips-view>view>view>view {
  padding-right: 16rpx;
  height: 36rpx;
  display: flex;
}

.tips-view image {
  width: 10rpx;
  height: 36rpx;
}

.tips-view text {
  display: block;
  margin: 0rpx 0rpx 0rpx 0rpx;
  font-size: 24rpx;
  line-height: 36rpx;
  color: #FF801A;
}

/* discount-item */
.discount-item {
  margin: 24rpx 24rpx 0;
  height: 210rpx;
  border-radius: 4rpx;
  box-shadow: 0rpx 4rpx 14rpx rgba(0, 0, 0, 0.1);
  overflow: hidden;
  display: flex;
}

.discount-item-use, .discount-item-unuse {
  width: 210rpx;
  height: 210rpx;
  display: flex;
  flex-direction: column;
}

.discount-item-use {
  background: linear-gradient(#21BFD5, #2C8FD8);
} 

.discount-item-unuse {
  background: linear-gradient(#D2D2D2, #B4B4B4);
}

.discount-item>view:first-child text {
  color: white;
}

.discount-item>view:first-child>view {
  height: 94rpx;
  display: flex;
  margin-top: 40rpx;
}

.discount-item>view:first-child>view>text:first-child {
  font-family: DINAlternate-Bold;
  font-size: 34rpx;
  margin: auto 10rpx 16rpx auto;
}

.discount-item>view:first-child>view>text:last-child {
  font-family: DINAlternate-Bold;
  font-size: 80rpx;
  line-height: 94rpx;
  margin: auto auto auto 0rpx;
}

.discount-item>view:first-child>text {
  width: 100%;
  font-size: 20rpx;
  text-align: center;
  margin: 10rpx 0 auto;
}

.discount-item>view:nth-child(2) {
  display: flex;
  flex-direction: column;
  margin-left: 28rpx;
}

.discount-item>view:nth-child(2)>text:first-child {
  font-size: 30rpx;
  color: #666666;
  margin-top: auto;
  margin-bottom: 8rpx;
}

.discount-item>view:nth-child(2)>text:nth-child(2),
 .discount-item>view:nth-child(2)>text:nth-child(3) {
  font-size: 24rpx;
  color: #999999;
  line-height: 46rpx;
}

.discount-item>view:nth-child(2)>text:nth-child(3) {
  margin-bottom: auto;
}

.discount-choose {
  width: 48rpx;
  height: 48rpx;
  margin: auto 48rpx auto auto;
}

.discount-use {
  width: 88rpx;
  height: 210rpx;
  margin: auto 0 auto auto;
}