mine_order.wxss 4.2 KB
/* pages/mine_order/mine_order.wxss */

.flex_center {
    display: flex;
    flex-direction: column;
    align-content: center;
}

.layer_star {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.layer_between {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

page {
    background: #f9f9f9;
}

.tab {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    padding: 28rpx 32rpx;
    box-sizing: border-box;
}

.tab_one {
    font-size: 30rpx;
    font-weight: 400;
    color: rgba(140, 145, 152, 1);
}

.tab_ones {
    font-size: 30rpx;
    font-weight: bold;
    color: rgba(255, 90, 78, 1);
    position: relative;
}

.tab_ones:after {
    content: "";
    width: 48rpx;
    height: 6rpx;
    background: rgba(255, 90, 78, 1);
    opacity: 1;
    border-radius: 4rpx;
    position: absolute;
    bottom: 24rpx;
    left: 50%;
    transform: translate(-50%, 48rpx);
}

.no_order_num {
    display: none;
}

.no_order {
    text-align: center;
    margin-top: 150rpx;
}

.no_img image {
    width: 347rpx;
    height: 240rpx;
}

.no_word {
    font-size: 24rpx;
    font-weight: 500;
    color: rgba(140, 145, 152, 1);
}

/* 有数据的情况 */

.order {
    padding: 28rpx 32rpx 0;
    box-sizing: border-box;
}

.order_card {
    background: rgba(255, 255, 255, 1);
    box-shadow: 0 16rpx 36rpx rgba(0, 0, 0, 0.04);
    border-radius: 20rpx;
    margin: 12rpx 0;
    padding: 32rpx;
    box-sizing: border-box;
}

.order_title {
    font-size: 28rpx;
    font-weight: bold;
    color: rgba(6, 18, 30, 1);
    margin-bottom: 30rpx;
}

.address_icon {
    margin-right: 16rpx;
}

.address_icon image {
    width: 19rpx;
    height: 23rpx;
}

.order_word {
    font-size: 24rpx;
    font-weight: 400;
    color: rgba(140, 145, 152, 1);
}

.order_time {
    margin-top: 20rpx;
    border-bottom: 1rpx solid rgba(238, 238, 238, 1);
    padding-bottom: 34rpx;
}

.time_icon {
    margin-right: 14rpx;
}

.time_icon image {
    width: 20rpx;
    height: 20rpx;
}

.into {
    margin-right: 34rpx;
}

.leave {
    margin-right: 22rpx;
}

/* 待付款 */

.price_num {
    font-size: 24rpx;
    font-weight: bold;
    color: rgba(255, 90, 78, 1);
}

.price_num text {
    font-size: 40rpx;
}

.price_btn {
    background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
    border-radius: 40rpx;
    font-size: 28rpx;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
    padding: 10rpx 40rpx;
    box-sizing: border-box;
}

/* 待出行 */

.trip_cancel {
    background: rgba(189, 196, 206, 1);
    border-radius: 40rpx;
    font-size: 28rpx;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
    padding: 10rpx 40rpx;
    box-sizing: border-box;
}

.trip_see {
    margin-left: 20rpx;
    background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
    border-radius: 40rpx;
    font-size: 28rpx;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
    padding: 10rpx 40rpx;
    box-sizing: border-box;
}

/* 已入住 */

.order_check, .order_complete, .order_cancel, .order_trip, .order_price {
    margin-top: 32rpx;
}

/* 已完成 */

.complete_word {
    margin-top: 6rpx;
    font-size: 24rpx;
    font-weight: 400;
    color: rgba(91, 94, 99, 1);
}

.complete_share {
    background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
    border-radius: 40rpx;
    padding: 10rpx 22rpx;
    box-sizing: border-box;
}

.complete_share_icon {
    width: 40rpx;
    height: 40rpx;
}

.complete_share_icon image {
    width: 100%;
    height: 100%;
    font-size: 0;
}

.complete_share_btn {
    font-size: 28rpx;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
}

.complete_see {
    margin-left: 20rpx;
    background: linear-gradient(180deg, rgba(252, 169, 162, 1) 0%, rgba(255, 119, 117, 1) 100%);
    border-radius: 40rpx;
    font-size: 28rpx;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
    padding: 10rpx 40rpx;
    box-sizing: border-box;
}

/* 已取消 */

.cancel_price {
    text-decoration: line-through;
}

.cencel_word {
    margin-left: 26rpx;
    font-size: 24rpx;
    font-weight: 400;
    color: rgba(91, 94, 99, 1);
}