57 lines
5.6 KiB
SCSS
57 lines
5.6 KiB
SCSS
.fulfillment-page { height: 100vh; overflow: hidden; }
|
|
.fulfillment-scroll { height: calc(100vh - 48px - var(--status-bar-height, 0px)); }
|
|
.fulfillment-content { padding-bottom: 44px; }
|
|
.fulfillment-heading { margin: 4px 2px 12px; }
|
|
.fulfillment-title, .fulfillment-subtitle, .scan-help, .state-title, .fulfillment-error text, .fulfillment-success text, .task-meta, .card-title, .gate-note, .gate-warning, .gate-success, .offline-note { display: block; }
|
|
.fulfillment-title { color: #14263d; font-size: 21px; font-weight: 800; }
|
|
.fulfillment-subtitle { margin-top: 4px; color: #708197; font-size: 11px; line-height: 17px; }
|
|
.fulfillment-card { box-sizing: border-box; margin-bottom: 10px; padding: 14px; border: 1px solid #dce5f0; border-radius: 13px; background: #fff; box-shadow: 0 4px 15px rgba(32,67,111,.06); }
|
|
.secondary-button, .primary-button, .depart-button, .link-button { box-sizing: border-box; width: 100%; min-height: 44px; margin: 10px 0 0; border-radius: 8px; font-size: 13px; line-height: 44px; }
|
|
.secondary-button { border: 1px solid #9dc0f4; color: #135ee8; background: #f8fbff; }
|
|
.primary-button { color: #fff; font-weight: 800; background: #135ee8; }
|
|
.depart-button { color: #fff; font-weight: 800; background: #0a8754; }
|
|
.link-button { color: #5d6f84; background: #f1f4f8; }
|
|
.secondary-button[disabled], .primary-button[disabled], .depart-button[disabled], .link-button[disabled] { color: #9aa7b5; background: #e8edf3; opacity: 1; }
|
|
.scan-help, .gate-note { margin-top: 8px; color: #718095; font-size: 10px; line-height: 16px; }
|
|
.fulfillment-state { margin-bottom: 10px; padding: 28px 16px; border-radius: 12px; color: #748399; font-size: 11px; line-height: 18px; text-align: center; background: #fff; }
|
|
.state-title { margin-bottom: 4px; color: #263b55; font-size: 14px; font-weight: 800; }
|
|
.fulfillment-error, .fulfillment-success { margin-bottom: 10px; padding: 12px; border-radius: 10px; font-size: 10px; line-height: 17px; }
|
|
.fulfillment-error { color: #a62323; background: #fff0f0; }
|
|
.fulfillment-success { color: #087443; background: #e8f8ef; }
|
|
.offline-note { margin-top: 7px; color: #8a5a00; }
|
|
.list-toolbar, .task-head, .count-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
|
|
.list-toolbar { margin: 16px 2px 10px; color: #233951; font-size: 13px; font-weight: 800; }
|
|
.list-title, .list-count, .detail-kicker, .detail-title, .task-enter { display: block; }
|
|
.list-count { margin-top: 2px; color: #8795a7; font-size: 10px; font-weight: 500; }
|
|
.list-toolbar button { min-height: 32px; margin: 0; padding: 0 12px; border-radius: 7px; color: #135ee8; font-size: 11px; line-height: 32px; background: #e9f2ff; }
|
|
.task-list, .item-list { display: flex; flex-direction: column; gap: 9px; }
|
|
.task-card { box-sizing: border-box; width: 100%; min-height: 76px; margin: 0; padding: 13px; border: 1px solid #dce5f0; border-radius: 11px; text-align: left; background: #fff; }
|
|
.task-card::after { border: 0; }
|
|
.task-code-row { display: flex; min-width: 0; align-items: center; gap: 7px; }
|
|
.business-code { color: #16304d; font-size: 15px; font-weight: 800; overflow-wrap: anywhere; }
|
|
.recent-badge { flex-shrink: 0; padding: 3px 6px; border-radius: 99px; color: #8a570c; font-size: 9px; line-height: 14px; background: #fff1dd; }
|
|
.status-badge { flex-shrink: 0; padding: 4px 7px; border-radius: 99px; color: #165fbf; font-size: 10px; background: #e6f0ff; }
|
|
.task-meta { margin-top: 6px; color: #718095; font-size: 10px; line-height: 16px; }
|
|
.task-enter { margin-top: 8px; color: #135ee8; font-size: 10px; font-weight: 700; text-align: right; }
|
|
.detail-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 4px 0 10px; padding: 10px 12px; border: 1px solid #bed4f6; border-radius: 11px; background: #eef5ff; }
|
|
.detail-kicker { color: #6580a4; font-size: 9px; }
|
|
.detail-title { margin-top: 2px; color: #153d74; font-size: 14px; font-weight: 800; }
|
|
.detail-toolbar button { flex-shrink: 0; min-height: 34px; margin: 0; padding: 0 11px; border-radius: 8px; color: #135ee8; font-size: 10px; line-height: 34px; background: #fff; }
|
|
.summary-card { display: block; }
|
|
.metrics { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); margin-top: 12px; padding: 10px 0; border-radius: 9px; background: #f5f8fc; }
|
|
.metrics view { display: flex; align-items: center; flex-direction: column; gap: 3px; color: #718095; font-size: 9px; }
|
|
.metrics view + view { border-left: 1px solid #dce5f0; }
|
|
.metric-value { color: #135ee8; font-size: 20px; font-weight: 800; }
|
|
.metric-value.success { color: #087443; }
|
|
.metric-value.warning { color: #a56800; }
|
|
.item-card { margin: 0; }
|
|
.item-card.selected { border: 2px solid #135ee8; background: #f8fbff; }
|
|
.progress { height: 6px; margin-top: 10px; overflow: hidden; border-radius: 99px; background: #e4eaf1; }
|
|
.progress view { height: 100%; border-radius: 99px; background: #20a464; }
|
|
.card-title { color: #17314f; font-size: 13px; font-weight: 800; }
|
|
.count-row { margin-top: 12px; color: #65768b; font-size: 10px; }
|
|
.count-row input { box-sizing: border-box; width: 78px; height: 42px; padding: 0 8px; border: 2px solid #135ee8; border-radius: 8px; color: #17314f; font-size: 17px; text-align: center; background: #fff; }
|
|
.gate-card textarea { box-sizing: border-box; width: 100%; height: 76px; margin-top: 10px; padding: 9px; border: 1px solid #d3dde9; border-radius: 8px; color: #27384d; font-size: 12px; background: #fbfcfe; }
|
|
.gate-warning { margin-top: 8px; color: #a56800; font-size: 11px; line-height: 17px; }
|
|
.gate-success { margin-top: 8px; color: #087443; font-size: 11px; line-height: 17px; }
|