固定后台侧栏滚动布局
This commit is contained in:
@@ -194,7 +194,7 @@ export default function AdminLayout() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Layout.Sider>
|
</Layout.Sider>
|
||||||
<Layout>
|
<Layout className="admin-main-shell">
|
||||||
<Layout.Header className="admin-topbar">
|
<Layout.Header className="admin-topbar">
|
||||||
<Space className="admin-user" size={12}>
|
<Space className="admin-user" size={12}>
|
||||||
<Dropdown
|
<Dropdown
|
||||||
|
|||||||
@@ -55,15 +55,25 @@ select {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.admin-shell {
|
.admin-shell {
|
||||||
|
height: 100vh;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.admin-sider {
|
.admin-sider {
|
||||||
|
height: 100vh;
|
||||||
|
overflow: hidden;
|
||||||
border-right: 1px solid #edf0f5;
|
border-right: 1px solid #edf0f5;
|
||||||
box-shadow: 4px 0 18px rgba(15, 23, 42, 0.04);
|
box-shadow: 4px 0 18px rgba(15, 23, 42, 0.04);
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.admin-main-shell {
|
||||||
|
min-width: 0;
|
||||||
|
min-height: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
.admin-sider .ant-layout-sider-children {
|
.admin-sider .ant-layout-sider-children {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
@@ -178,6 +188,7 @@ select {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.admin-topbar {
|
.admin-topbar {
|
||||||
|
flex: 0 0 64px;
|
||||||
height: 64px;
|
height: 64px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -197,6 +208,9 @@ select {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.admin-content {
|
.admin-content {
|
||||||
|
height: calc(100vh - 64px);
|
||||||
|
min-height: 0;
|
||||||
|
overflow: auto;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user