fix: 修复移动端副导航栏未隐藏的问题
This commit is contained in:
@@ -304,10 +304,12 @@ body {
|
|||||||
|
|
||||||
/* 默认隐藏侧边栏,小屏幕适配 */
|
/* 默认隐藏侧边栏,小屏幕适配 */
|
||||||
.left-sidebar { display: none; }
|
.left-sidebar { display: none; }
|
||||||
|
.left-subnav { display: none; } /* 默认隐藏平板导航 */
|
||||||
|
|
||||||
/* 平板及以上显示副导航 */
|
/* 平板及以上显示副导航 */
|
||||||
@media (min-width: 768px) {
|
@media (min-width: 768px) {
|
||||||
.left-subnav {
|
.left-subnav {
|
||||||
|
display: flex;
|
||||||
width: var(--subnav-width);
|
width: var(--subnav-width);
|
||||||
min-width: var(--subnav-width);
|
min-width: var(--subnav-width);
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
@@ -369,12 +371,14 @@ body {
|
|||||||
background: rgba(0, 0, 0, 0.5);
|
background: rgba(0, 0, 0, 0.5);
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
transition: opacity 0.3s;
|
transition: opacity 0.3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mobile-drawer.open {
|
.mobile-drawer.open {
|
||||||
display: block;
|
display: block;
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
|
pointer-events: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.drawer-content {
|
.drawer-content {
|
||||||
@@ -386,12 +390,20 @@ body {
|
|||||||
max-width: 80vw;
|
max-width: 80vw;
|
||||||
transform: translateX(-100%);
|
transform: translateX(-100%);
|
||||||
transition: transform 0.3s;
|
transition: transform 0.3s;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mobile-drawer.open .drawer-content {
|
.mobile-drawer.open .drawer-content {
|
||||||
transform: translateX(0);
|
transform: translateX(0);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 确保抽屉内的 AppSidebar 有正确样式 */
|
||||||
|
.drawer-content .sidebar {
|
||||||
|
width: 100%;
|
||||||
|
position: static;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
/* 移动端:小屏幕隐藏副导航,显示汉堡菜单按钮 */
|
/* 移动端:小屏幕隐藏副导航,显示汉堡菜单按钮 */
|
||||||
@media (max-width: 767px) {
|
@media (max-width: 767px) {
|
||||||
.content-wrapper {
|
.content-wrapper {
|
||||||
|
|||||||
Reference in New Issue
Block a user