Page { background-color: #f5f5f5; } .card { background-color: #fff; } .card-top { display: flex; align-items: center; padding: 0 40rpx; } .card-top-left { margin-right: 40rpx; position: relative; } .card-top-left .type { position: absolute; bottom: 0; right: 0; transform: translate(50%, 0); font-size: 24rpx; color: #fff; background-color: #ff523d; border-radius: 20rpx; padding: 5rpx 10rpx; white-space: nowrap; } .card-top .portrait { width: 128rpx; height: 128rpx; border-radius: 100%; display: block; } .card-top .name { font-size: 36rpx; color: #000; margin-right: 40rpx; } .card-top .state { color: #f39927; font-size: 28rpx; border-radius: 24rpx; background-color: #fef7ee; padding: 4rpx 20rpx; white-space: nowrap; } .info-wrap {} .wrap { overflow: hidden; } .wrap .title { font-size: 32rpx; color: #000; padding: 0 40rpx; font-weight: bold; } .wrap .item { border-bottom: 2rpx solid #f5f5f5; padding: 24rpx 40rpx; display: flex; } .item-l { font-size: 30rpx; color: #999; margin-right: 20rpx; position: relative; } .item-l image { width: 88rpx; height: 88rpx; display: block; position: relative; border-radius: 100%; } .item-r { flex: 1; font-size: 30rpx; color: #666; display: flex; flex-direction: column; word-break: break-all; } .item-r .item-r-top { overflow: hidden; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } .item-r .item-r-top .text-name { font-size: 34rpx; color: #000; /* font-weight: bold; */ } .item-r .item-r-top .text-position { font-size: 28rpx; color: #f39927; } .item-r .item-r-top .text-type { float: right; color: #f39927; font-size: 28rpx; } .item-r .item-r-top .text-job { font-size: 28rpx; color: #666; margin-left: 20rpx; } .item-r .item-r-bottom { font-size: 28rpx; color: #999; line-height: 40rpx; } .item-r .item-r-bottom.time { margin: 4rpx 0 10rpx; } .loading { width: 180rpx; height: 240rpx; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; } .swiper-tab { margin-top: 16rpx; background-color: #fff; display: flex; align-items: center; justify-content: space-around; padding: 24rpx 0; border-bottom: 2rpx solid #f5f5f5; font-size: 32rpx; } .swiper-item { color: #000; position: relative; } .swiper-item.active { color: #ff523d; } .swiper-item.active::after { content: ''; height: 4rpx; left: 0; right: 0; background: #ff523d; position: absolute; bottom: -24rpx; } .info-outer { padding-top: 12rpx; padding-bottom: 28rpx; background-color: #fff; } .follow-up-list .item:last-child .item-r, .team .item:last-child .item-r { border: 0; } .team .item, .follow-up-list .item { border: 0; padding-bottom: 0; } .team .item .item-r, .follow-up-list .item .item-r { padding-bottom: 24rpx; border-bottom: 1px solid #f5f5f5; } .icon-hooli-wechatx { background-color: #02dd64; color: #fff; } .icon-hooli-phonex { background-color: #eee; color: #999; } .icon-hooli-qqx { background-color: #88CBF5; color: #fff; } .icon-hooli-emailx { background-color: #eee; color: #999; } .icon { width: 40rpx; height: 40rpx; font-size: 20rpx; text-align: center; line-height: 40rpx; border-radius: 100%; } .trade-info .item-l { min-width: 180rpx; } .empty { font-size: 30rpx; text-align: center; margin-top: 20rpx; color: #000; } .order-list card { background-color: #fff; margin-bottom: 16rpx; padding: 24rpx 0; } .order-list .item-top-wrap { padding-bottom: 24rpx; border-bottom: 2rpx solid #f4f4f4; margin-bottom: 24rpx; } .order-list .item-top-wrap .card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30rpx; } .order-list .card-top .title { font-size: 32rpx; color: #000; } .order-list .card-top .new-tag { font-size: 28rpx; color: #ff523d; } .order-list .item { display: flex; align-items: center; margin-top: 10rpx; padding: 0 40rpx; justify-content: flex-start; } .order-list .item-left { font-size: 30rpx; color: #999; margin-right: 20rpx; width: 185rpx; } .order-list .item-right { font-size: 30rpx; color: #666; flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; width: 0; }