diff --git a/apps/ui/css/catalog.css b/apps/ui/css/catalog.css index 20003fd..dbae1e1 100644 --- a/apps/ui/css/catalog.css +++ b/apps/ui/css/catalog.css @@ -271,6 +271,7 @@ .table-wrap table { width: 100%; border-collapse: collapse; + table-layout: fixed; } .table-wrap thead tr { background: var(--bg-canvas); @@ -300,6 +301,21 @@ .table-wrap tbody tr:last-child { border-bottom: none; } .table-wrap tbody tr:hover { background: var(--bg-overlay); } .table-wrap td { padding: 14px 16px; vertical-align: middle; } +.table-wrap th:nth-child(2), +.table-wrap td:nth-child(2) { width: 112px; } +.table-wrap th:nth-child(3), +.table-wrap td:nth-child(3) { width: 118px; } +.table-wrap th:nth-child(4), +.table-wrap td:nth-child(4) { width: 140px; } +.table-wrap th:nth-child(5), +.table-wrap td:nth-child(5) { width: 280px; } +.table-wrap th:last-child, +.table-wrap td:last-child { + width: 96px; + min-width: 96px; + padding-left: 8px; + padding-right: 16px; +} .op-name { font-family: 'JetBrains Mono', 'Fira Code', monospace; font-size: 13px; font-weight: 500; color: var(--text-primary); } .op-display { font-size: 12px; color: var(--text-muted); margin-top: 3px; } @@ -357,31 +373,42 @@ text-overflow: ellipsis; white-space: nowrap; } +.target-url-cell span { + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; +} .target-url-cell a { color: inherit; text-decoration: none; } .target-url-cell svg { flex-shrink: 0; opacity: 0.5; } .date-cell { font-size: 13px; color: var(--text-muted); white-space: nowrap; } -.row-actions { display: flex; align-items: center; gap: 4px; justify-content: flex-end; } +.row-actions { + display: flex; + align-items: center; + gap: 6px; + justify-content: flex-end; + min-width: 74px; +} .row-btn { - padding: 5px 11px; + width: 34px; + height: 34px; + padding: 0; border-radius: var(--radius-sm); border: 1px solid var(--border); background: var(--bg-surface); font-size: 12.5px; color: var(--text-secondary); transition: all 0.1s; + display: inline-flex; + align-items: center; + justify-content: center; + flex: 0 0 34px; } .row-btn:hover { border-color: var(--bg-muted); color: var(--text-primary); background: var(--bg-overlay); } .row-btn.danger:hover { border-color: var(--red-border); color: var(--red); background: var(--red-bg); } .row-btn-edit { - width: 34px; - height: 34px; - padding: 0; - display: flex; - align-items: center; - justify-content: center; border-radius: var(--radius); }