snxraven/peardock
1
1
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Fix Images actions column clipping remove button
Release rolling / release (push) Has been cancelled
Details

Browse Source 
Widen the actions column and keep button groups visible so the
remove control is not cut off under fixed table layout.
This commit is contained in:
Raven Scott
2026-07-16 15:08:02 -04:00
parent 60315d53f0
commit 83353602df
1 changed files with 58 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/modern.css
+58 -12
View File
@@ -2346,6 +2346,22 @@ table.pd-col-table td.pd-col-hidden {
max-width: 100%;
}
/* Action columns: never clip icon button groups (remove was cut off on Images) */
.view table td[data-col='actions'],
.view table th[data-col='actions'],
.view table td.container-actions-cell {
max-width: none !important;
overflow: visible !important;
text-overflow: clip !important;
white-space: nowrap !important;
}
.view table td[data-col='actions'] .btn-group {
display: inline-flex;
flex-wrap: nowrap;
white-space: nowrap;
}
.view .table td code {
display: inline-block;
max-width: 100%;
@@ -2530,50 +2546,74 @@ table.pd-col-table td.pd-col-hidden {
#images-view table td:nth-child(1),
#images-view table th:nth-child(8),
#images-view table td:nth-child(8),
#images-view table th[data-col='actions'],
#images-view table td[data-col='actions'],
#networks-view table th:nth-child(7),
#networks-view table td:nth-child(7),
#networks-view table th[data-col='actions'],
#networks-view table td[data-col='actions'],
#volumes-view table th:nth-child(5),
#volumes-view table td:nth-child(5),
#volumes-view table th[data-col='actions'],
#volumes-view table td[data-col='actions'],
#stacks-view table th:nth-child(5),
#stacks-view table td:nth-child(5),
#stacks-view table th[data-col='actions'],
#stacks-view table td[data-col='actions'],
#registry-view table th:nth-child(1),
#registry-view table td:nth-child(1),
#registry-view table th:nth-child(5),
#registry-view table td:nth-child(5) {
overflow: visible !important;
text-overflow: clip !important;
max-width: none;
white-space: nowrap;
max-width: none !important;
white-space: nowrap !important;
}
/* Prefer name / primary columns take remaining space */
#images-view table th:nth-child(2),
#images-view table td:nth-child(2) {
width: 22%;
width: 20%;
}
#images-view table th:nth-child(3),
#images-view table td:nth-child(3) {
width: 16%;
width: 14%;
}
#images-view table th:nth-child(4),
#images-view table td:nth-child(4) {
width: 7rem;
width: 6.5rem;
}
#images-view table th:nth-child(5),
#images-view table td:nth-child(5) {
width: 5.5rem;
width: 5.25rem;
}
#images-view table th:nth-child(6),
#images-view table td:nth-child(6) {
width: 6.5rem;
width: 6rem;
}
#images-view table th:nth-child(7),
#images-view table td:nth-child(7) {
width: 6.5rem;
width: 6rem;
}
/* 5 icon buttons (inspect/tag/push/pull/remove) — 9rem was clipping remove */
#images-view table th:nth-child(8),
#images-view table td:nth-child(8) {
width: 9rem;
#images-view table td:nth-child(8),
#images-view table th[data-col='actions'],
#images-view table td[data-col='actions'] {
width: 12.75rem;
min-width: 12.75rem;
max-width: none !important;
padding-right: 0.85rem;
text-align: right;
overflow: visible !important;
}
#images-view table td[data-col='actions'] .btn-group,
#images-view table td:nth-child(8) .btn-group {
display: inline-flex;
flex-wrap: nowrap;
white-space: nowrap;
max-width: none;
}
#networks-view table th:nth-child(1),
@@ -2834,16 +2874,22 @@ table.pd-col-table td.pd-col-hidden {
width: 3rem;
}
/* Images / resource actions: icon-only width */
/* Resource actions: keep full icon group visible (remove was clipped at 4.5rem) */
#images-view table th:nth-child(8),
#images-view table td:nth-child(8),
#images-view table th[data-col='actions'],
#images-view table td[data-col='actions'] {
width: 12.75rem;
min-width: 11.5rem;
}
#networks-view table th:nth-child(7),
#networks-view table td:nth-child(7),
#volumes-view table th:nth-child(5),
#volumes-view table td:nth-child(5),
#stacks-view table th:nth-child(5),
#stacks-view table td:nth-child(5) {
width: 4.5rem;
width: 7.5rem;
min-width: 6.5rem;
}
.page-header h2 {