+33
-10
@@ -582,18 +582,41 @@
|
||||
|
||||
/* 响应式:手机适配(≤ 768px) */
|
||||
@media (max-width: 768px) {
|
||||
/* 顶部导航变两行,把 --hdr-h 调大供 formbar margin 跟随 */
|
||||
:root { --hdr-h: 88px; }
|
||||
|
||||
/* 页面滚动交给整页而非固定容器,避免 fixed 高度硬编码 bug */
|
||||
html, body { height: auto; }
|
||||
|
||||
/* 顶部导航压缩 */
|
||||
.hdr { padding: 0 10px; gap: 8px; }
|
||||
.hdr-brand { font-size: 13px; }
|
||||
/* 顶部导航:允许换行,分两行显示,防止文字被挤压竖排 */
|
||||
.hdr {
|
||||
height: auto;
|
||||
min-height: var(--hdr-h);
|
||||
flex-wrap: wrap;
|
||||
padding: 6px 10px;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
}
|
||||
.hdr-brand { font-size: 13px; flex-shrink: 0; }
|
||||
.hdr-brand small { display: none; }
|
||||
.hdr-stats { gap: 10px; }
|
||||
.hstat-v { font-size: 12px; }
|
||||
.hstat-l { font-size: 9px; }
|
||||
.btn-pause { padding: 4px 10px; font-size: 11px; }
|
||||
.state-pill { padding: 2px 6px; font-size: 11px; }
|
||||
.hdr-divider { display: none; }
|
||||
.hdr-right { margin-left: auto; gap: 6px; flex-shrink: 0; }
|
||||
.state-pill { padding: 3px 8px; font-size: 11px; white-space: nowrap; flex-shrink: 0; }
|
||||
.btn-pause { padding: 5px 12px; font-size: 11px; white-space: nowrap; flex-shrink: 0; }
|
||||
|
||||
/* 统计数字独占第二行(order: 5 让它换到 brand/right 之后) */
|
||||
.hdr-stats {
|
||||
order: 5;
|
||||
flex-basis: 100%;
|
||||
width: 100%;
|
||||
gap: 0;
|
||||
padding-top: 6px;
|
||||
border-top: 1px solid var(--border);
|
||||
justify-content: space-around;
|
||||
}
|
||||
.hstat { text-align: center; white-space: nowrap; }
|
||||
.hstat-v { font-size: 13px; white-space: nowrap; }
|
||||
.hstat-l { font-size: 10px; white-space: nowrap; margin-top: 1px; }
|
||||
|
||||
/* 表单栏:取消固定定位,改为跟内容一起滚;字段全占满宽度 */
|
||||
.formbar {
|
||||
@@ -655,8 +678,8 @@
|
||||
.wiz-title { font-size: 15px; }
|
||||
.ws-num { width: 22px; height: 22px; font-size: 10px; }
|
||||
|
||||
/* Toast 通知全宽居中 */
|
||||
.toasts { top: 56px; right: 8px; left: 8px; }
|
||||
/* Toast 通知全宽居中(避开变高的 hdr) */
|
||||
.toasts { top: calc(var(--hdr-h) + 6px); right: 8px; left: 8px; }
|
||||
.toast { font-size: 12px; }
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user