84 lines
7.1 KiB
Plaintext
84 lines
7.1 KiB
Plaintext
page { min-height: 100%; background: #f7f7f7; color: #111; }
|
|
.page { min-height: 100vh; padding: 0 20rpx calc(36rpx + env(safe-area-inset-bottom)); box-sizing: border-box; }
|
|
|
|
.state-card { min-height: 440rpx; margin-top: 24rpx; padding: 70rpx 38rpx; border-radius: 14rpx; display: flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; color: #8d8d8d; background: #fff; text-align: center; }
|
|
.state-icon { width: 70rpx; height: 70rpx; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #1d63c3; background: #eef4fc; font-size: 36rpx; font-weight: 700; }
|
|
.state-title { margin-top: 26rpx; color: #222; font-size: 30rpx; font-weight: 700; }
|
|
.state-desc { max-width: 560rpx; margin-top: 14rpx; font-size: 23rpx; line-height: 1.65; }
|
|
.retry-btn { width: 260rpx; margin-top: 32rpx; color: #fff; background: #1d63c3; font-size: 25rpx; }
|
|
.retry-btn--plain { color: #1d63c3; background: #edf4fc; }
|
|
.loading-ring { width: 52rpx; height: 52rpx; margin-bottom: 24rpx; border: 6rpx solid #dfe9f6; border-top-color: #1d63c3; border-radius: 50%; }
|
|
|
|
.event-header { min-height: 76rpx; padding: 20rpx 30rpx 14rpx; display: flex; align-items: center; justify-content: center; box-sizing: border-box; background: #fff; }
|
|
.event-name { max-width: 650rpx; color: #000; font-size: 28rpx; line-height: 1.45; font-weight: 700; text-align: center; }
|
|
.prototype-section { padding: 0 18rpx; }
|
|
.prototype-title { display: block; font-size: 26rpx; line-height: 1.4; letter-spacing: 2rpx; font-weight: 500; }
|
|
.current-checkin-section { margin-top: 10rpx; }
|
|
.current-checkin-card { min-height: 126rpx; margin-top: 10rpx; padding: 26rpx 22rpx; border-radius: 13rpx; display: flex; align-items: center; box-sizing: border-box; color: #fff; background: linear-gradient(115deg, #1d62c5 0%, #3389e2 100%); font-size: 29rpx; line-height: 1.5; letter-spacing: 2rpx; box-shadow: inset -16rpx -14rpx 36rpx rgba(255,255,255,.08); }
|
|
.current-checkin-card--abnormal { background: linear-gradient(115deg, #b93a3a, #e06969); }
|
|
|
|
.sequence-section { margin-top: 32rpx; }
|
|
.timeline { margin-top: 20rpx; padding-left: 58rpx; }
|
|
.timeline-item { position: relative; min-height: 118rpx; display: flex; }
|
|
.timeline-axis { position: absolute; left: 0; top: 0; bottom: 0; width: 34rpx; }
|
|
.timeline-dot { position: absolute; z-index: 2; left: 0; top: 4rpx; width: 30rpx; height: 30rpx; border: 3rpx solid #1d63c3; border-radius: 50%; box-sizing: border-box; display: flex; align-items: center; justify-content: center; background: #f7f7f7; }
|
|
.timeline-dot-core { width: 14rpx; height: 14rpx; border-radius: 50%; background: #1d63c3; }
|
|
.timeline-line { position: absolute; left: 14rpx; top: 33rpx; bottom: -4rpx; width: 2rpx; background: #1d63c3; }
|
|
.timeline-item:last-child .timeline-line { display: none; }
|
|
.timeline-content { min-width: 0; padding-left: 52rpx; padding-bottom: 24rpx; }
|
|
.timeline-name { display: block; color: #111; font-size: 25rpx; line-height: 1.45; letter-spacing: 2rpx; }
|
|
.timeline-status-line { margin-top: 3rpx; display: flex; align-items: center; }
|
|
.timeline-status { font-size: 25rpx; font-weight: 700; letter-spacing: 2rpx; }
|
|
.timeline-progress { margin-left: 14rpx; color: #aaa; font-size: 20rpx; }
|
|
.timeline-item--status-1 .timeline-status { color: #01b06f; }
|
|
.timeline-item--status-2 .timeline-status { color: #f49920; }
|
|
.timeline-item--status-3 .timeline-status { color: #959595; }
|
|
.timeline-item--status-4 .timeline-status { color: #1d63c3; }
|
|
.timeline-item--abnormal .timeline-dot { border-color: #cf3e3e; }
|
|
.timeline-item--abnormal .timeline-status { color: #cf3e3e; }
|
|
.timeline-abnormal { display: block; margin-top: 5rpx; color: #cf3e3e; font-size: 19rpx; }
|
|
.timeline-empty { padding: 24rpx 0 34rpx; color: #999; font-size: 23rpx; }
|
|
|
|
.prototype-divider { height: 1rpx; margin: 2rpx 18rpx 24rpx; background: #cfcfcf; }
|
|
.competing-section { padding-bottom: 26rpx; }
|
|
.competing-heading { display: flex; align-items: center; justify-content: space-between; }
|
|
.registration-tag { min-width: 220rpx; padding: 7rpx 18rpx; border: 2rpx dashed #ff5aad; border-radius: 6rpx; box-sizing: border-box; color: #ff3399; font-size: 23rpx; text-align: center; }
|
|
.competing-card { margin-top: 10rpx; padding: 20rpx 18rpx; border-radius: 12rpx; color: #fff; background: linear-gradient(115deg, #1d62c5 0%, #3389e2 100%); box-shadow: inset -16rpx -14rpx 36rpx rgba(255,255,255,.08); }
|
|
.competing-row { display: flex; align-items: flex-start; margin-top: 17rpx; font-size: 25rpx; line-height: 1.45; font-weight: 700; letter-spacing: 1rpx; }
|
|
.competing-row:first-child { margin-top: 0; }
|
|
.competing-label { width: 92rpx; flex-shrink: 0; text-align: right; }
|
|
.competing-label--wide { width: 142rpx; }
|
|
.competing-value { flex: 1; min-width: 0; }
|
|
.competing-empty { margin-top: 10rpx; padding: 38rpx; border-radius: 12rpx; color: #999; background: #fff; text-align: center; font-size: 23rpx; }
|
|
|
|
.mine-detail-section { margin-top: 16rpx; padding-top: 28rpx; border-top: 14rpx solid #efefef; }
|
|
.detail-heading,.mine-head,.mine-info,.round-head { display: flex; align-items: center; justify-content: space-between; }
|
|
.detail-heading { margin: 0 18rpx 16rpx; }
|
|
.detail-heading-title { font-size: 28rpx; font-weight: 700; }
|
|
.detail-heading-count { color: #999; font-size: 21rpx; }
|
|
.mine-card { margin-bottom: 18rpx; padding: 24rpx; border: 2rpx solid transparent; border-radius: 14rpx; background: #fff; }
|
|
.mine-card--abnormal { border-color: #e9a3a3; background: #fff9f9; }
|
|
.mine-title-wrap { flex: 1; min-width: 0; margin-right: 18rpx; }
|
|
.mine-title,.athletes { display: block; }
|
|
.mine-title { font-size: 26rpx; font-weight: 700; }
|
|
.athletes { margin-top: 7rpx; color: #888; font-size: 21rpx; }
|
|
.status-tag { padding: 7rpx 13rpx; border-radius: 999rpx; flex-shrink: 0; color: #777; background: #eee; font-size: 19rpx; }
|
|
.status-tag--status-1 { color: #087b50; background: #e3f6ee; }
|
|
.status-tag--status-2,.status-tag--status-3 { color: #175fac; background: #e8f1fc; }
|
|
.status-tag--abnormal { color: #b83030; background: #fde5e5; }
|
|
.mine-info { margin-top: 18rpx; color: #777; font-size: 21rpx; }
|
|
.notice { margin-top: 17rpx; padding: 14rpx 17rpx; border-radius: 8rpx; color: #1d63c3; background: #edf4fc; font-size: 21rpx; }
|
|
.notice--abnormal { color: #b83030; background: #fde9e9; }
|
|
.round-list { margin-top: 22rpx; padding-top: 18rpx; border-top: 1rpx solid #e8e8e8; }
|
|
.round { display: flex; padding-bottom: 22rpx; }
|
|
.round:last-child { padding-bottom: 0; }
|
|
.round-marker { width: 40rpx; height: 40rpx; margin-right: 16rpx; border: 2rpx solid #1d63c3; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #1d63c3; background: #fff; font-size: 19rpx; font-weight: 700; }
|
|
.round--passed .round-marker { color: #fff; border-color: #01b06f; background: #01b06f; }
|
|
.round--abnormal .round-marker { color: #fff; border-color: #cf3e3e; background: #cf3e3e; }
|
|
.round-main { flex: 1; min-width: 0; }
|
|
.round-name { font-size: 23rpx; font-weight: 700; }
|
|
.round-state { color: #999; font-size: 20rpx; }
|
|
.round--passed .round-state { color: #01a466; }
|
|
.round-detail { display: block; margin-top: 7rpx; color: #777; font-size: 20rpx; }
|
|
.round-empty { padding: 18rpx; color: #999; text-align: center; font-size: 21rpx; }
|