Files
Wechat/styles/dashou-xym-order-card.wxss

342 lines
5.7 KiB
Plaintext

/* 抢单订单卡片 - 逍遥梦布局(星阙数据) */
.flex { display: flex; align-items: center; }
.flexb { display: flex; align-items: center; justify-content: space-between; }
.flexa { display: flex; align-items: center; justify-content: center; }
.myflex { display: flex; align-items: center; }
.dingdan-list {
padding: 0 0 24rpx;
}
.xym-order-item {
margin-bottom: 24rpx;
position: relative;
overflow: visible;
border-radius: 30rpx;
box-shadow: 0 10rpx 28rpx rgba(0, 0, 0, 0.09);
}
/* 平台订单 - 紫色主题 */
.xym-pingtai-order {
padding-bottom: 5rpx;
background: #7c3aed;
}
.xym-pingtai-head {
height: 72rpx;
padding: 0 24rpx;
background: linear-gradient(50deg, #6d28d9, #9333ea);
border-radius: 30rpx 30rpx 0 0;
}
.xym-head-time {
font-size: 24rpx;
color: #e9d5ff;
}
.xym-head-tag {
font-size: 22rpx;
padding: 4rpx 16rpx;
border-radius: 8rpx;
font-weight: 600;
background: rgba(196, 181, 253, 0.28);
color: #f5f3ff;
border: 1rpx solid rgba(196, 181, 253, 0.55);
}
.xym-pingtai-body {
border-radius: 40rpx 10rpx 30rpx 30rpx;
padding: 0 20rpx 24rpx;
background: linear-gradient(to bottom, #5b21b6, #c4b5fd);
}
/* 商家订单 */
.xym-shangjia-order {
padding-bottom: 5rpx;
background: linear-gradient(to bottom, #f5f3ff, #ddd6fe);
overflow: hidden;
}
.xym-shangjia-body {
border-radius: 10rpx 10rpx 30rpx 30rpx;
padding: 0 20rpx 24rpx;
}
.xym-shangjia-head {
padding: 16rpx 24rpx 8rpx;
}
.xym-shangjia-head .xym-head-time {
color: #888;
}
.xym-shangjia-head .xym-head-tag {
background: rgba(255, 255, 255, 0.65);
color: #492f00;
border-color: rgba(147, 51, 234, 0.5);
}
.order-con {
position: relative;
min-height: 108rpx;
}
.order-row {
align-items: flex-start;
padding: 24rpx 10rpx 14rpx;
}
.o-logo {
width: 88rpx;
height: 88rpx;
border-radius: 12rpx;
margin-right: 14rpx;
flex-shrink: 0;
background: #eee;
}
.o-col {
flex: 1;
min-width: 0;
padding-right: 136rpx;
box-sizing: border-box;
}
.o-goods {
font-weight: 700;
font-size: 30rpx;
line-height: 1.5;
color: #333;
}
.o-goods.light {
color: #fff;
}
.line2 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.merchant-line {
display: flex;
align-items: center;
padding: 0 10rpx 12rpx;
gap: 12rpx;
}
.m-avatar-sm {
width: 56rpx;
height: 56rpx;
border-radius: 50%;
flex-shrink: 0;
background: #eee;
}
.m-name-sm {
font-size: 26rpx;
font-weight: 600;
color: #333;
}
.zhiding-strip {
margin: 0 10rpx 12rpx;
padding: 10rpx 16rpx;
background: rgba(255, 77, 109, 0.12);
border-radius: 12rpx;
flex-wrap: wrap;
gap: 8rpx;
}
.zhiding-strip.light {
background: rgba(255, 255, 255, 0.35);
}
.zhiding-strip .zhiding-label {
font-size: 22rpx;
color: #ff4d6d;
font-weight: 700;
padding: 2rpx 12rpx;
background: rgba(255, 77, 109, 0.15);
border-radius: 8rpx;
}
.zhiding-strip .zhiding-avatar {
width: 40rpx;
height: 40rpx;
border-radius: 50%;
}
.zhiding-strip .zhiding-name {
font-size: 24rpx;
color: #666;
max-width: 200rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.xym-pingtai-body .zhiding-strip .zhiding-name {
color: #ede9fe;
}
.reward-badge {
position: absolute;
right: 0;
top: 18rpx;
font-size: 24rpx;
padding: 6rpx 20rpx;
border-radius: 30rpx 10rpx 0 30rpx;
display: flex;
align-items: baseline;
z-index: 3;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
}
.reward-badge.normal-reward {
color: #4c1d95;
background: linear-gradient(to bottom, #c4b5fd, #a78bfa);
}
.reward-badge.platform-reward {
color: #fff;
background: linear-gradient(to right, #9333ea, #c4b5fd);
}
.xym-shangjia-body .reward-badge:not(.member-tip) {
top: 76rpx;
}
.reward-badge.member-tip {
background: rgba(255, 255, 255, 0.85);
padding: 8rpx 16rpx;
border-radius: 20rpx;
top: 16rpx;
right: 10rpx;
}
.reward-yen {
font-size: 28rpx;
}
.reward-num {
font-weight: 700;
font-size: 34rpx;
}
.reward-num.dark {
color: #c00;
}
.reward-tip {
font-size: 22rpx;
color: #c0392b;
font-weight: 600;
}
.reward-yen.sm {
font-size: 26rpx;
}
.remark-block {
font-size: 24rpx;
margin: 8rpx 10rpx 0;
padding: 12rpx 16rpx;
border-left: 4rpx solid;
border-radius: 0 8rpx 8rpx 0;
overflow: hidden;
}
.remark-block.gold {
color: #fff;
border-color: #c4b5fd;
background: rgba(196, 181, 253, 0.12);
}
.remark-block.dark {
color: #666;
border-color: #87ceeb;
background: rgba(135, 206, 235, 0.12);
}
.remark-label {
font-weight: 600;
}
.remark-block.gold .remark-label {
color: #c4b5fd;
}
.remark-block.dark .remark-label {
color: #87ceeb;
}
.xuqiu-tags-row {
margin: 12rpx 10rpx 0;
padding-top: 12rpx;
border-top: 2rpx dotted rgba(255, 255, 255, 0.35);
}
.xym-shangjia-body .xuqiu-tags-row {
border-top-color: rgba(0, 0, 0, 0.08);
}
.xuqiu-tags-row .xuqiu-label {
font-size: 22rpx;
color: #87ceeb;
margin-bottom: 8rpx;
display: block;
}
.o-foot {
margin-top: 18rpx;
padding: 0 10rpx 8rpx;
}
.o-amt {
font-size: 26rpx;
color: #999;
}
.o-amt.light {
color: #ede9fe;
}
.btn-bg {
background: linear-gradient(180deg, #c4b5fd, #a78bfa);
border-radius: 60rpx;
color: #492f00;
}
.qiangdan {
color: #4c1d95;
width: 180rpx;
min-width: 100rpx;
padding: 15rpx 10rpx;
border: 2rpx solid #fff;
box-sizing: border-box;
font-size: 26rpx;
font-weight: 700;
flex-shrink: 0;
}
.qiangdan.btn-qiang-brown {
background: linear-gradient(to right, #7c3aed 0%, #c4b5fd 100%) !important;
color: #fff !important;
}
.view-more-inline {
font-size: 22rpx;
color: #87ceeb;
margin-left: 4rpx;
}
.biaoqian-inline-scroll {
white-space: nowrap;
width: 100%;
}