Fix 4 HIGH overflow bugs: scrollable Docker tiles, tables, tabs, app rows

- Dashboard: overflow-x auto on card td cells for Docker container grid
- Dashboard: text-overflow ellipsis on span.outer for long container names
- Main: overflow-x auto on tabpanels (ZFS Master, Boot Device, etc.)
- Docker/VM: overflow-x auto on .TableContainer wrapper
- Apps: overflow-x auto on .ca_homeTemplates card rows
- Apps: box-sizing border-box on .ca_appPopup to prevent card overflow
- Consistent glass scrollbar styling (thin, translucent) on all

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Kaloyan Danchev
2026-02-27 15:21:27 +02:00
parent e0f8d5da4b
commit 7bacf965cc

View File

@@ -1075,6 +1075,9 @@ table.dashboard > tbody.sortable > tr > td {
padding: 6px 6px !important;
color: var(--glass-text) !important;
background: transparent !important;
overflow-x: auto !important;
scrollbar-color: rgba(255, 255, 255, 0.15) transparent !important;
scrollbar-width: thin !important;
}
/* Header row of each card */
@@ -1269,6 +1272,9 @@ table.dashboard span.outer {
background: transparent !important;
border: none !important;
border-bottom: none !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
max-width: 100% !important;
}
/* Folder showcase containers */
@@ -1716,6 +1722,13 @@ a[href*="forums.unraid.net"] {
DOCKER & VM LIST PAGES (advanced table view)
============================================ */
/* Docker/VM page tables: allow horizontal scroll on wrapper */
.TableContainer {
overflow-x: auto !important;
scrollbar-color: rgba(255, 255, 255, 0.15) transparent !important;
scrollbar-width: thin !important;
}
/* Table header bar on Docker/VM pages */
#docker_list thead,
#vm_list thead,
@@ -2264,7 +2277,16 @@ a.caButton:hover {
/* --- Home templates horizontal scroll area --- */
.ca_homeTemplates {
scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
overflow-x: auto !important;
overflow-y: hidden !important;
scrollbar-color: rgba(255, 255, 255, 0.15) transparent !important;
scrollbar-width: thin !important;
padding-bottom: 8px !important;
}
/* App card box-sizing to prevent individual card overflow */
.ca_appPopup {
box-sizing: border-box !important;
}
/* --- Alternate view (app detail popup) --- */
@@ -2834,6 +2856,13 @@ td.folder-storage {
margin: 0 8px !important;
}
/* Tabpanels (ZFS Master, Boot Device, etc.): allow horizontal scroll */
[role="tabpanel"] {
overflow-x: auto !important;
scrollbar-color: rgba(255, 255, 255, 0.15) transparent !important;
scrollbar-width: thin !important;
}
/* Fix stacked panels: don't apply to tabpanel children
which have their own panel structure */
[role="tabpanel"] div.Panel + div.Panel {