fix: menu side bar scroll with main content area
This commit is contained in:
@@ -58,7 +58,7 @@ const LayoutWrapper: React.FC = () => {
|
|||||||
showInput={isHome || isList}
|
showInput={isHome || isList}
|
||||||
/>
|
/>
|
||||||
{/* 下方为主布局:左侧菜单 + 右侧内容 */}
|
{/* 下方为主布局:左侧菜单 + 右侧内容 */}
|
||||||
<Layout ref={layoutShellRef as any}>
|
<Layout ref={layoutShellRef as any} className="layout-shell">
|
||||||
<SiderMenu
|
<SiderMenu
|
||||||
onNavigate={handleNavigate}
|
onNavigate={handleNavigate}
|
||||||
selectedKey={selectedKey}
|
selectedKey={selectedKey}
|
||||||
|
|||||||
@@ -6,6 +6,13 @@
|
|||||||
/* 消除 Ant Layout 默认白底,避免顶栏下方看到白边 */
|
/* 消除 Ant Layout 默认白底,避免顶栏下方看到白边 */
|
||||||
.layout-wrapper .ant-layout { background: transparent; }
|
.layout-wrapper .ant-layout { background: transparent; }
|
||||||
|
|
||||||
|
/* 顶栏下的主布局容器:固定视口高度,隐藏外层滚动 */
|
||||||
|
.layout-shell {
|
||||||
|
height: calc(100vh - 56px);
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.layout-shell .ant-layout { height: 100%; }
|
||||||
|
|
||||||
/* 侧栏头部区域 */
|
/* 侧栏头部区域 */
|
||||||
.sider-header {
|
.sider-header {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -28,6 +35,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
overflow: auto; /* 仅主内容区滚动 */
|
||||||
background: var(--bg-app);
|
background: var(--bg-app);
|
||||||
}
|
}
|
||||||
.content-body {
|
.content-body {
|
||||||
|
|||||||
Reference in New Issue
Block a user