fix(web): 1:1 对齐——页头通栏、内部滚动、侧栏菜单与详情导航
- Layout: screen 模式下约束 body/main 高度,恢复内容区内部滚动(原来内容把根撑高被裁切) - Layout: contentOffset=88,滚动区从页头下方开始,内容不再从悬浮搜索框下穿过 - 页头改回通栏 60px(contained 只包页身);资料卡头像恢复 64px 图标 + 品牌底色 - 详情导航条左右撑开(返回 / 面包屑),不再挤在左侧 - 侧栏菜单:行高 39、字重 500、圆角 8、CSS chevron、项间距 4px - 服务面板去掉多余分隔线与外边距,恢复原高度
This commit is contained in:
+24
-3
@@ -35,7 +35,11 @@
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: var(--su-space-4);
|
||||
height: var(--su-header-height);
|
||||
width: 100%;
|
||||
max-width: var(--su-layout-width);
|
||||
height: calc(var(--su-header-height) - 1px);
|
||||
margin: 0 auto;
|
||||
padding: 0 var(--su-space-5);
|
||||
}
|
||||
|
||||
.site-brand {
|
||||
@@ -89,7 +93,6 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--su-space-5);
|
||||
padding-top: 88px;
|
||||
padding-bottom: var(--su-space-10);
|
||||
}
|
||||
|
||||
@@ -111,6 +114,10 @@
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.profile-bio {
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.service-panel {
|
||||
padding: 12px 14px;
|
||||
}
|
||||
@@ -118,8 +125,18 @@
|
||||
.service-stats {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.service-actions {
|
||||
display: flex;
|
||||
gap: var(--su-space-2);
|
||||
margin: var(--su-space-3) 0;
|
||||
margin-top: var(--su-space-3);
|
||||
}
|
||||
|
||||
.service-actions > * {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.service-host {
|
||||
@@ -210,6 +227,10 @@
|
||||
padding: 12px var(--su-space-5);
|
||||
}
|
||||
|
||||
.detail-nav > * {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.detail-back {
|
||||
color: var(--su-color-primary);
|
||||
font-size: var(--su-font-size-md);
|
||||
|
||||
Reference in New Issue
Block a user