fix: compact mobile admin navigation

This commit is contained in:
nianzhibai
2026-05-28 20:00:38 +08:00
parent 137cfbcf82
commit d0159435c0
2 changed files with 26 additions and 6 deletions
+15 -6
View File
@@ -959,12 +959,13 @@
.admin-sidebar {
position: sticky;
top: 0;
height: auto;
height: 48px;
min-height: 48px;
flex-direction: row;
align-items: center;
overflow-x: auto;
overflow-y: hidden;
padding: var(--space-2) var(--space-3);
padding: 6px var(--space-2);
background: var(--glass-nav);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
@@ -980,23 +981,33 @@
.admin-sidebar__footer { display: none; }
.admin-nav {
flex: 0 0 auto;
flex-direction: row;
flex-wrap: nowrap;
width: max-content;
margin: 0;
padding: 0;
gap: var(--space-2);
gap: 6px;
align-items: center;
}
.admin-nav__link {
flex: 0 0 auto;
height: 34px;
padding: 0 var(--space-3);
padding: 0 11px;
border-radius: var(--radius-pill);
white-space: nowrap;
font-size: var(--font-sm);
line-height: 1;
border: 1px solid transparent;
}
.admin-nav__link svg {
width: 14px;
height: 14px;
flex: 0 0 auto;
}
.admin-nav__link:hover {
background: rgba(255, 255, 255, 0.05);
transform: none;
@@ -2185,5 +2196,3 @@
color: var(--text-default);
}
+11
View File
@@ -78,3 +78,14 @@ test("admin modals and action footers adapt on mobile", () => {
// 共享 body),所以走 ruleBodyByContains 而不是简单正则。
assert.match(ruleBodyByContains(css, ".admin-form__row input"), /width\s*:\s*100%/);
});
test("mobile admin top navigation stays compact", () => {
const css = mobileCss();
assert.match(ruleBody(css, ".admin-sidebar"), /height\s*:\s*48px/);
assert.match(ruleBody(css, ".admin-sidebar"), /min-height\s*:\s*48px/);
assert.match(ruleBody(css, ".admin-nav"), /align-items\s*:\s*center/);
assert.match(ruleBody(css, ".admin-nav__link"), /height\s*:\s*34px/);
assert.match(ruleBody(css, ".admin-nav__link"), /line-height\s*:\s*1/);
assert.match(ruleBody(css, ".admin-nav__link"), /flex\s*:\s*0\s+0\s+auto/);
});