/* ═════ 历史报告 —— 逐条对照 H5: style.css .card(L355-358) .toast(L588-599) .policy-header .history-clear ui-20261009.css L8(#s-history 字体栈) L33-44(.history-content/.history-count/.identity-note/ .history-item/.history-detail/.history-retry) L99-106(.font-credit/.account-status) ui-20261009.css L47(.report-title 全局:font-size 23px / padding 0 / margin-bottom) ui-20261009.css L92(.report-title font-weight 600) 换算:calc(N * var(--u)) → 2N rpx;字号/行高/圆角固定 px 原样保留。 ═════ */ page { background: #EFEFEF; } /* H5 .screen#s-history */ .history { position: relative; min-height: 100vh; background: #efefef; } /* H5 #s-history 的 background-image center/cover + background-attachment:fixed → 等价实现:fixed 定位、铺满视口的 image */ .history-bg { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 0; } /* H5 .history-content(ui-20261009 L34) */ .history-content { position: relative; z-index: 1; padding: 56rpx 34rpx 72rpx; /* calc(28*u) calc(17*u) calc(36*u) */ box-sizing: border-box; } /* H5 .report-title(style.css L350-354 + ui-20261009 L47/L92) */ .report-title { font-size: 23px; font-weight: 600; color: #282828; text-align: center; letter-spacing: 1rpx; /* calc(.5 * var(--u)) */ padding: 0; margin-bottom: 46rpx; /* calc(23 * var(--u)) */ } /* H5 .card(style.css L355-358 + ui-20261009 L48:圆角 calc(7*u)) */ .history .card { background: #fff; border-radius: 14rpx; margin-bottom: 24rpx; /* calc(12 * var(--u)) */ box-sizing: border-box; } /* H5 .account-status / .account-status-history(ui-20261009 L100/L106) */ .account-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-radius: 8px; font-size: 12px; box-sizing: border-box; } .account-status-history { width: 100%; background: #fff; margin-bottom: 14px; text-align: left; } .account-label { display: flex; align-items: center; } .account-dot { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: #b7bac0; flex-shrink: 0; } .account-status-on .account-dot { background: #34ca7b; } .account-text { white-space: nowrap; } /* H5 .account-logout(ui-20261012 L4) */ .account-logout { font-size: 11px; opacity: .8; white-space: nowrap; } /* H5 .history-count(ui-20261009 L35-38) H5 里 .history-count 没设 font-size,行盒取浏览器默认 16px;app.acss 把 page 设成 14px,所以这里显式补回 16px,内联的「测试数量」才会落在同一基线上。 */ .history .history-count { text-align: center; padding: 32rpx 24rpx 42rpx; /* calc(16*u) calc(12*u) calc(21*u) */ font-size: 16px; } /* H5 .history-count > span 是内联元素(内含 display:block 的 ::after 分隔线) */ .history-count-label { display: inline; color: #888; font-size: 12px; } /* H5 .history-count > span::after */ .history-count-label::after { content: ''; display: block; width: 90rpx; /* calc(45 * var(--u)) */ margin: 24rpx auto; /* calc(12 * var(--u)) auto */ border-bottom: 1px solid #eee; } .history-count-value { font-size: 12px; } /* H5 .identity-note(ui-20261009 L39) */ .identity-note { color: #888; font-size: 10px; line-height: 1.6; margin: 24rpx 8rpx 40rpx; /* calc(12*u) calc(4*u) calc(20*u) */ } /* H5 .history-empty(style.css L637) */ .history-empty { text-align: center; color: #868686; font-size: 12.5px; padding: 60px 0; } /* H5 的加载中/失败文案是直接写进 #history-list 的纯文本(继承 16px、左对齐、无内边距) */ .history-list-note { font-size: 16px; color: #282828; } /* H5 .history-item(ui-20261009 L40-42) */ .history .history-item { padding: 26rpx 38rpx 20rpx; /* calc(13*u) calc(19*u) calc(10*u) */ overflow: hidden; margin-top: 12rpx; /* calc(6 * var(--u)) */ } .history-item-line { font-size: 12px; padding-bottom: 14rpx; /* calc(7 * var(--u)) */ border-bottom: 1px solid #eee; } .history-item-label { color: #888; margin-right: 16rpx; /* calc(8 * var(--u)) */ } /* H5 .history-detail(ui-20261009 L43) */ .history .history-detail { display: block; margin: 14rpx 0 0 auto; /* calc(7 * var(--u)) 0 0 auto */ background: #F5F078; border-radius: 10rpx; /* calc(5 * var(--u)) */ width: 160rpx; /* calc(80 * var(--u)) */ min-height: 46rpx; /* calc(23 * var(--u)) */ font-size: 12px; color: #282828; line-height: 46rpx; text-align: center; padding: 0; border: none; box-sizing: border-box; } .history .history-detail::after { border: none; } /* H5 .history-retry(ui-20261009 L44) */ .history .history-retry { display: block; width: fit-content; /* H5 是 block + width:auto 的按钮 → 收缩到文字宽再 margin:auto 居中 */ margin: 20px auto; text-align: center; color: #707070; text-decoration: underline; font-size: 12px; background: none; border: none; padding: 0; line-height: normal; box-sizing: border-box; } .history .history-retry::after { border: none; } /* ─── H5 .toast ─── */ .toast { position: fixed; left: 50%; bottom: 15%; transform: translateX(-50%) translateY(8px); max-width: 86%; background: rgba(20, 20, 20, .85); color: #fff; font-size: 13px; line-height: 1.5; text-align: center; padding: 9px 18px; border-radius: 18px; opacity: 0; pointer-events: none; transition: all .25s ease; z-index: 99; box-sizing: border-box; } .toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }