Paooofuu/miniprogram/pages/my-bookings/index.wxss

108 lines
1.7 KiB
Plaintext

page {
background: var(--bg-base);
}
.page {
padding-top: var(--space-4);
}
.title {
font-size: var(--font-title-md);
font-weight: 700;
color: var(--text-1);
}
.sub {
margin-top: var(--space-1);
color: var(--text-2);
font-size: var(--font-body);
}
.order-card {
margin-top: var(--space-3);
border-radius: var(--radius-md);
background: var(--surface-1);
border: 1px solid var(--border-soft);
padding: var(--space-4);
}
.row {
display: flex;
align-items: center;
justify-content: space-between;
}
.status {
border-radius: var(--radius-pill);
min-height: 52rpx;
padding: 0 16rpx;
font-size: var(--font-caption);
font-weight: 700;
display: flex;
align-items: center;
}
.status.pending {
color: var(--state-warning);
background: var(--state-warning-bg);
}
.status.confirmed {
color: var(--state-success);
background: var(--state-success-bg);
}
.status.cancelled {
color: var(--state-danger);
background: var(--state-danger-bg);
}
.duration {
color: var(--text-3);
font-size: var(--font-caption);
}
.time {
margin-top: var(--space-2);
font-size: var(--font-body-lg);
font-weight: 700;
color: var(--text-1);
}
.location,
.reason {
margin-top: 8rpx;
font-size: var(--font-caption);
color: var(--text-2);
}
.actions {
margin-top: var(--space-3);
display: flex;
gap: var(--space-2);
}
.btn {
flex: 1;
min-height: 88rpx;
border-radius: var(--radius-md);
display: flex;
align-items: center;
justify-content: center;
font-size: var(--font-body);
}
.btn.ghost {
background: #f4f4f4;
color: var(--text-2);
}
.btn.warn {
background: var(--surface-2);
color: var(--brand-main);
}
.btn.disabled {
opacity: 0.5;
}