修复手机端名单抽屉滚动失效问题:打通 flex 高度约束链,启用 overflow-y:auto
This commit is contained in:
+8
-3
@@ -801,13 +801,17 @@ a:hover {
|
|||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ── 名单/房间抽屉:复用原 right-panel 结构 ── */
|
/* ── 名单/房间抽屉:限制最大高度,内部用户列表区启用滚动 ── */
|
||||||
|
#mobile-drawer-users {
|
||||||
|
max-height: 80vh;
|
||||||
|
}
|
||||||
|
|
||||||
#mobile-drawer-users .mobile-drawer-body {
|
#mobile-drawer-users .mobile-drawer-body {
|
||||||
max-height: 65vh;
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
min-height: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#mobile-drawer-users .mobile-right-clone {
|
#mobile-drawer-users .mobile-right-clone {
|
||||||
@@ -825,7 +829,8 @@ a:hover {
|
|||||||
#mobile-drawer-users .user-list-content {
|
#mobile-drawer-users .user-list-content {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
max-height: calc(65vh - 80px);
|
min-height: 0;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
}
|
}
|
||||||
|
|
||||||
#mobile-drawer-users .online-stats {
|
#mobile-drawer-users .online-stats {
|
||||||
|
|||||||
@@ -86,7 +86,7 @@
|
|||||||
|
|
||||||
{{-- 用户列表容器 --}}
|
{{-- 用户列表容器 --}}
|
||||||
<div id="mob-online-users-list"
|
<div id="mob-online-users-list"
|
||||||
style="flex:1;overflow-y:auto;padding:2px 0;">
|
style="flex:1;overflow-y:auto;min-height:0;-webkit-overflow-scrolling:touch;">
|
||||||
<div style="text-align:center;color:#aaa;padding:20px;font-size:12px;">加载中...</div>
|
<div style="text-align:center;color:#aaa;padding:20px;font-size:12px;">加载中...</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user