Use inline styles for tx list items to fix overflow
Some checks failed
check / check (push) Has been cancelled
Some checks failed
check / check (push) Has been cancelled
This commit is contained in:
@@ -106,32 +106,39 @@ function renderTransactions(txs) {
|
||||
const errorStyle = tx.isError ? " opacity:0.5" : "";
|
||||
|
||||
const row = document.createElement("div");
|
||||
row.className =
|
||||
"py-2 border-b border-border-light text-xs cursor-pointer hover:bg-hover overflow-hidden";
|
||||
if (errorStyle) row.style.cssText = errorStyle;
|
||||
row.style.cssText =
|
||||
"padding:0.5rem 0;border-bottom:1px solid #ccc;font-size:12px;cursor:pointer;overflow:hidden;" +
|
||||
errorStyle;
|
||||
|
||||
const line1 = document.createElement("div");
|
||||
line1.className = "flex justify-between overflow-hidden";
|
||||
line1.style.cssText =
|
||||
"display:flex;justify-content:space-between;overflow:hidden;";
|
||||
const age = document.createElement("span");
|
||||
age.className = "text-muted min-w-0 truncate";
|
||||
age.style.cssText =
|
||||
"color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;";
|
||||
age.textContent = timeAgo(tx.timestamp);
|
||||
age.title = isoDate(tx.timestamp);
|
||||
const dir = document.createElement("span");
|
||||
dir.className = "shrink-0 pl-2" + (tx.isError ? " text-muted" : "");
|
||||
dir.style.cssText =
|
||||
"flex-shrink:0;padding-left:0.5rem;white-space:nowrap;" +
|
||||
(tx.isError ? "color:#666;" : "");
|
||||
dir.textContent = dirLabel + (tx.isError ? " (failed)" : "");
|
||||
line1.appendChild(age);
|
||||
line1.appendChild(dir);
|
||||
|
||||
const amountStr = tx.value + " " + tx.symbol;
|
||||
const line2 = document.createElement("div");
|
||||
line2.className = "flex justify-between overflow-hidden";
|
||||
line2.style.cssText =
|
||||
"display:flex;justify-content:space-between;overflow:hidden;";
|
||||
const addr = document.createElement("span");
|
||||
addr.className = "min-w-0 truncate";
|
||||
addr.style.cssText =
|
||||
"overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;";
|
||||
const maxAddr = Math.max(10, 38 - Math.max(0, amountStr.length - 10));
|
||||
addr.textContent = truncateMiddle(counterparty, maxAddr);
|
||||
addr.title = counterparty;
|
||||
const amount = document.createElement("span");
|
||||
amount.className = "shrink-0 pl-2";
|
||||
amount.style.cssText =
|
||||
"flex-shrink:0;padding-left:0.5rem;white-space:nowrap;";
|
||||
amount.textContent = amountStr;
|
||||
line2.appendChild(addr);
|
||||
line2.appendChild(amount);
|
||||
|
||||
Reference in New Issue
Block a user