Stop the proxy table widening its own column instead of scrolling inside it

This commit is contained in:
Gmer4Lfe
2026-08-16 02:10:22 -04:00
parent 51283a626c
commit bd30c4e05a
+12 -3
View File
@@ -79,7 +79,11 @@ require_once dirname(__DIR__) . '/include/ai_chat.php';
/* ── Panels ──────────────────────────────────────────────────────────────── */ /* ── Panels ──────────────────────────────────────────────────────────────── */
.vv-au-panel { display:none; } .vv-au-panel { display:none; }
.vv-au-panel.active { display:block; } /* min-width:0 because a panel may be laid out as a flex or grid item, whose default min-width:auto
means "never shrink below your content". The Proxies table is deliberately allowed to exceed the
page width and scroll inside its own container; without this that width propagates upward and
widens the panel instead. */
.vv-au-panel.active { display:block;min-width:0; }
/* ── Tables ──────────────────────────────────────────────────────────────── */ /* ── Tables ──────────────────────────────────────────────────────────────── */
.vv-au-tbl { width:100%;border-collapse:collapse;font-size:11px; } .vv-au-tbl { width:100%;border-collapse:collapse;font-size:11px; }
@@ -102,7 +106,7 @@ require_once dirname(__DIR__) . '/include/ai_chat.php';
.vv-au-badge.host { background:#111;border:1px solid #1e1e1e;color:#444; } .vv-au-badge.host { background:#111;border:1px solid #1e1e1e;color:#444; }
/* ── Cards ───────────────────────────────────────────────────────────────── */ /* ── Cards ───────────────────────────────────────────────────────────────── */
.vv-au-card { background:#161616;border:1px solid #222;border-radius:6px;overflow:hidden; } .vv-au-card { background:#161616;border:1px solid #222;border-radius:6px;overflow:hidden;min-width:0; }
.vv-au-card-h { display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid #1e1e1e;background:#111; } .vv-au-card-h { display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid #1e1e1e;background:#111; }
.vv-au-card-title { font-size:11px;font-weight:bold;color:#666;text-transform:uppercase;letter-spacing:.06em;flex:1; } .vv-au-card-title { font-size:11px;font-weight:bold;color:#666;text-transform:uppercase;letter-spacing:.06em;flex:1; }
@@ -276,7 +280,12 @@ require_once dirname(__DIR__) . '/include/ai_chat.php';
widest cell, so the three of them were three different widths and every column shifted whenever widest cell, so the three of them were three different widths and every column shifted whenever
the numbers changed. Declared once here and the host column takes whatever is left. */ the numbers changed. Declared once here and the host column takes whatever is left. */
.vv-au-tbl.fixed { table-layout:fixed;min-width:960px; } .vv-au-tbl.fixed { table-layout:fixed;min-width:960px; }
.vv-au-tblwrap { overflow-x:auto; } /* The scroll container must never be able to widen what contains it. A flex or grid item defaults
to min-width:auto, which means "never shrink below your content" — and the min-width above makes
that content 960px wide, so without these three the table pushes its whole column out to 960 and
into whatever sits beside or below it, instead of scrolling inside the card. The overflow is the
whole point: the table is allowed to be wider than the page, the page is not allowed to notice. */
.vv-au-tblwrap { overflow-x:auto;max-width:100%;min-width:0; }
.vv-au-c-flags { width:154px; } .vv-au-c-flags { width:154px; }
/* 60 spark bars at 2px plus 1px gaps is 179px, and the cell has 10px padding either side. Every /* 60 spark bars at 2px plus 1px gaps is 179px, and the cell has 10px padding either side. Every
figure column gets that same width whether or not it draws bars. */ figure column gets that same width whether or not it draws bars. */