style(users): 优化搜索框图标间距与详情 Tab 左边距
ci / 质量门禁 (push) Canceled after 0s

背景:
- 用户与组织页搜索框的前缀图标与占位文字仅 8px,视觉偏挤;
- 详情卡片的 Semi Tab 标题默认无内边距,基本资料等标签贴住卡片左边缘。

改动:
- 搜索框前缀图标改为左 10px / 右 12px;
- 详情 Tab bar 左右内边距 20px(1024 断点下与内容一起收紧为 16px),
  使 Tab 标题与下方「身份 / 权限 / 状态」内容左对齐。

影响面:
- 仅用户与组织页样式,不影响交互与接口。

回滚方式:
- 回滚本提交即恢复原间距。

验证证据:
- 1440×900 实测:前缀图标左 268 / 输入文字左 296,Tab 标题与内容均从 677 开始;
- pnpm format:check / web lint / typecheck / test(15 files / 55 tests)通过。
This commit is contained in:
Stev_Wang committed 2026-11-03 09:53:08 +08:00
1 parent 2c8dd5040f
commit f8b6232b4c
1 file changed
+15
+15
View File
@@ -59,6 +59,15 @@
box-shadow: var(--lx-shadow-panel);
}
/* 搜索框:图标与占位文字之间留出呼吸感 */
.lx-user-filters .semi-input-prefix {
margin: 0 12px 0 10px;
}
.lx-user-filters .semi-input-prefix-icon {
margin: 0;
}
.lx-user-filters__keyword {
width: 252px;
flex: 0 0 252px;
@@ -423,6 +432,11 @@
flex-direction: column;
}
/* Tab 标题与卡片左侧内容对齐(Semi 默认 tab bar 无内边距) */
.lx-user-detail__tabs .semi-tabs-bar {
padding: 0 var(--lx-space-5);
}
.lx-user-detail__tabs .semi-tabs-content {
min-height: 0;
flex: 1;
@@ -919,6 +933,7 @@
}
.lx-user-detail__head,
.lx-user-detail__tabs .semi-tabs-bar,
.lx-user-detail__tabs .semi-tabs-pane {
padding-right: var(--lx-space-4);
padding-left: var(--lx-space-4);