fix(audit): wrap long audit details instead of truncating
A `truncate` (nowrap) cell in the auto-layout DataTable sizes the whole table to its widest row, so one long summary/change stretched the table past the card and the row rules bled into the page. break-words keeps every row inside the card.
This commit is contained in:
@@ -80,9 +80,12 @@ export function auditColumns(
|
|||||||
render: (r) => {
|
render: (r) => {
|
||||||
const change = changeText(r);
|
const change = changeText(r);
|
||||||
return (
|
return (
|
||||||
|
// break-words (wrap), NOT truncate: in the auto-layout table a `truncate` (nowrap) cell
|
||||||
|
// sizes to its longest row, so one long summary/change stretched the whole table past the
|
||||||
|
// card (the row rules bled into the page). Wrapping keeps every row inside the container.
|
||||||
<div className="min-w-0">
|
<div className="min-w-0">
|
||||||
{r.summary && <div className="truncate">{r.summary}</div>}
|
{r.summary && <div className="break-words">{r.summary}</div>}
|
||||||
{change && <div className="text-[11px] text-muted truncate">{change}</div>}
|
{change && <div className="text-[11px] text-muted break-words">{change}</div>}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user