From 0faf9fb4e8d485267233726cfdfe6ac7798b5483 Mon Sep 17 00:00:00 2001
From: JianFeeeee <JianFeeeee@users.noreply.gitcode.com>
Date: Mon, 14 Sep 2026 18:45:36 +0800
Subject: [PATCH] =?UTF-8?q?style(webui):=20=E9=98=9F=E5=88=97/=E7=AE=A1?=
 =?UTF-8?q?=E9=81=93=E5=88=97=E5=AE=BD=E4=B8=8B=E9=99=90=E6=94=B6=E5=88=B0?=
 =?UTF-8?q?=20100px=EF=BC=8C=E6=B6=88=E6=8E=89=E3=80=8C4=20=E4=B8=AA=20+?=
 =?UTF-8?q?=201=20=E4=B8=AA=E3=80=8D=E5=AD=A4=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

118px 时容器 540px（小窗口侧栏展开的宽度）只放得下 4 列，第 5 个框
落到第二行且后面四个位置全空 —— 正是「看着空」的那种观感。
收到 100px 后 540px 也能一行放下 5 个；配套给 .rt-qmeta 加 wrap，
窄框里「登记/抢占」两枚迷你条换行而不是撑破框。

五档实测（1400/1100/900/700/480）：1400/1100/900/700 都是 5 框一行
（200/140/100/120px），480 为 3+2；均无横向溢出，框内元素无越界。
---
 internal/plugins/webui/dashboard.css | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/internal/plugins/webui/dashboard.css b/internal/plugins/webui/dashboard.css
index ddfdd0a..bf5f361 100644
--- a/internal/plugins/webui/dashboard.css
+++ b/internal/plugins/webui/dashboard.css
@@ -2353,9 +2353,10 @@
        同一套视觉语言），深度用大字报出来，下面是可见的格槽。 */
     .rt-queues {
       display: grid;
-      /* 118px 而不是 150px：容器 640–740px（窄屏侧栏收起后就是这个宽度）时
-         5 个框仍能排成一行，不会出现「4 个 + 1 个」的孤行。 */
-      grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
+      /* 100px 而不是 150px：两块都要保证「5 个一行」。
+         否则容器 540px（小窗口侧栏展开时就是这个宽度）会排成「4 个 + 1 个」——
+         第二行四个空位，看着就是一块坑。宁可框窄一点，也不留孤行。 */
+      grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
       gap: 10px;
       margin-bottom: 8px;
     }
@@ -2401,7 +2402,8 @@
     .rt-qmeta {
       display: flex;
       align-items: center;
-      gap: 8px;
+      flex-wrap: wrap;
+      gap: 4px 8px;
       font-size: 10.5px;
       color: var(--text-muted);
       font-variant-numeric: tabular-nums;
@@ -2708,7 +2710,7 @@
     .rt-pipe-row {
       display: grid;
       /* 与 .rt-queues 同一套列宽规则：两块的框宽、换行点保持一致 */
-      grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
+      grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
       gap: 10px;
       margin: 2px 0 8px;
       transition: opacity 0.3s var(--ease-out);