From b901afc9018877abd7e057ecd2815ab4c04dd9c3 Mon Sep 17 00:00:00 2001
From: AskaEth <i@yeij.top>
Date: Sun, 16 Aug 2026 21:35:44 +0800
Subject: [PATCH] fix: horizontal tab panel in top reserve area, no longer
 covered

---
 app/src/main/assets/h5/css/app.css             | 18 +++++++++---------
 app/src/main/assets/h5/js/webapp/topbar.js     |  4 +++-
 .../main/java/top/yeij/hearth/MainActivity.kt  | 10 +++++-----
 3 files changed, 17 insertions(+), 15 deletions(-)

diff --git a/app/src/main/assets/h5/css/app.css b/app/src/main/assets/h5/css/app.css
index 025ffdd..f18e0d5 100644
--- a/app/src/main/assets/h5/css/app.css
+++ b/app/src/main/assets/h5/css/app.css
@@ -536,16 +536,16 @@ body.webapp-active [data-page="webapplist"] {
 
 #tab-panel {
   position: fixed;
-  /* 与顶栏同一行（12px），避免 top 落入内容 WebView 的 topMargin(56dp) 区域被遮挡 */
-  /* Same row as the topbar (12px) so it stays above the content WebView's
-     topMargin (56dp) and isn't covered */
-  top: 12px;
-  right: 16px;
+  /* 顶栏正下方横向展开，位于内容 WebView 的顶部预留区（96dp）内，不被遮挡 */
+  /* Horizontal row right below the topbar, inside the content WebView's top
+     reserve (96dp) so it isn't covered */
+  top: 54px;
+  left: 84px;
+  right: 12px;
   display: none;
-  max-height: 120px;
-  overflow-y: auto;
-  min-width: 180px;
-  max-width: 260px;
+  flex-direction: row;
+  gap: 8px;
+  overflow-x: auto;
   padding: 8px;
   border-radius: 16px;
   background: var(--glass-bg);
diff --git a/app/src/main/assets/h5/js/webapp/topbar.js b/app/src/main/assets/h5/js/webapp/topbar.js
index 691f2ae..ed7181d 100644
--- a/app/src/main/assets/h5/js/webapp/topbar.js
+++ b/app/src/main/assets/h5/js/webapp/topbar.js
@@ -73,7 +73,9 @@ function showTabPanel(tabs) {
     row.append(name, close);
     panel.appendChild(row);
   });
-  panel.style.display = 'block';
+  // 横向展开（CSS flex-direction: row）
+  // Expand horizontally (CSS flex-direction: row)
+  panel.style.display = 'flex';
 }
 
 // 收起标签面板
diff --git a/app/src/main/java/top/yeij/hearth/MainActivity.kt b/app/src/main/java/top/yeij/hearth/MainActivity.kt
index c7b3792..55c7c27 100644
--- a/app/src/main/java/top/yeij/hearth/MainActivity.kt
+++ b/app/src/main/java/top/yeij/hearth/MainActivity.kt
@@ -51,11 +51,11 @@ class MainActivity : Activity() {
         // 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 CATALOG_URL = "https://example.com/hearth/catalog.json"
-        // 内容 WebView 顶栏预留高度（dp）：H5 顶栏 top 12px + 按钮 30px + padding，约 54dp，
-        // 取 56dp 留余量，避免内容 WebView 覆盖顶栏
-        // Topbar reserved height (dp): H5 topbar top 12px + button 30px + padding ≈ 54dp;
-        // use 56dp with margin so the content WebView doesn't cover the topbar
-        private const val TOPBAR_HEIGHT_DP = 56
+        // 内容 WebView 顶部预留高度（dp）：顶栏（约 54dp）+ 横向标签面板（约 40dp），
+        // 取 96dp 留余量，避免内容 WebView 覆盖顶栏与标签面板
+        // Content WebView top reserve (dp): topbar (~54dp) + horizontal tab panel
+        // (~40dp); use 96dp with margin so the content WebView covers neither
+        private const val TOPBAR_HEIGHT_DP = 96
         // 全局侧边栏收起宽度（dp），内容 WebView 左侧预留，避免挡住侧边栏
         // Global sidebar collapsed width (dp); content WebViews reserve it on the
         // left to avoid covering the sidebar