fix: horizontal tab panel in top reserve area, no longer covered

This commit is contained in:
2026-08-16 21:35:44 +08:00
parent bc08a8e4c3
commit b901afc901
3 changed files with 17 additions and 15 deletions
+9 -9
View File
@@ -536,16 +536,16 @@ body.webapp-active [data-page="webapplist"] {
#tab-panel { #tab-panel {
position: fixed; position: fixed;
/* 顶栏同一行(12px),避免 top 落入内容 WebView 的 topMargin(56dp) 区域被遮挡 */ /* 顶栏正下方横向展开,位于内容 WebView 的顶部预留区(96dp)内,不被遮挡 */
/* Same row as the topbar (12px) so it stays above the content WebView's /* Horizontal row right below the topbar, inside the content WebView's top
topMargin (56dp) and isn't covered */ reserve (96dp) so it isn't covered */
top: 12px; top: 54px;
right: 16px; left: 84px;
right: 12px;
display: none; display: none;
max-height: 120px; flex-direction: row;
overflow-y: auto; gap: 8px;
min-width: 180px; overflow-x: auto;
max-width: 260px;
padding: 8px; padding: 8px;
border-radius: 16px; border-radius: 16px;
background: var(--glass-bg); background: var(--glass-bg);
+3 -1
View File
@@ -73,7 +73,9 @@ function showTabPanel(tabs) {
row.append(name, close); row.append(name, close);
panel.appendChild(row); panel.appendChild(row);
}); });
panel.style.display = 'block'; // 横向展开(CSS flex-direction: row
// Expand horizontally (CSS flex-direction: row)
panel.style.display = 'flex';
} }
// 收起标签面板 // 收起标签面板
@@ -51,11 +51,11 @@ class MainActivity : Activity() {
// Placeholder manifest/catalog URLs; replace with the real server on device // Placeholder manifest/catalog URLs; replace with the real server on device
private const val MANIFEST_URL = "https://example.com/hearth/manifest.json" private const val MANIFEST_URL = "https://example.com/hearth/manifest.json"
private const val CATALOG_URL = "https://example.com/hearth/catalog.json" private const val CATALOG_URL = "https://example.com/hearth/catalog.json"
// 内容 WebView 顶预留高度(dp):H5 顶栏 top 12px + 按钮 30px + padding,约 54dp // 内容 WebView 顶预留高度(dp):顶栏(约 54dp)+ 横向标签面板(约 40dp
// 取 56dp 留余量,避免内容 WebView 覆盖顶栏 // 取 96dp 留余量,避免内容 WebView 覆盖顶栏与标签面板
// Topbar reserved height (dp): H5 topbar top 12px + button 30px + padding ≈ 54dp; // Content WebView top reserve (dp): topbar (~54dp) + horizontal tab panel
// use 56dp with margin so the content WebView doesn't cover the topbar // (~40dp); use 96dp with margin so the content WebView covers neither
private const val TOPBAR_HEIGHT_DP = 56 private const val TOPBAR_HEIGHT_DP = 96
// 全局侧边栏收起宽度(dp),内容 WebView 左侧预留,避免挡住侧边栏 // 全局侧边栏收起宽度(dp),内容 WebView 左侧预留,避免挡住侧边栏
// Global sidebar collapsed width (dp); content WebViews reserve it on the // Global sidebar collapsed width (dp); content WebViews reserve it on the
// left to avoid covering the sidebar // left to avoid covering the sidebar