Use inline styles for tx list items to fix overflow
Some checks failed
check / check (push) Has been cancelled

This commit is contained in:
2026-02-26 02:33:42 +07:00
parent be08723851
commit 197f40bde5

View File

@@ -106,32 +106,39 @@ function renderTransactions(txs) {
const errorStyle = tx.isError ? " opacity:0.5" : ""; const errorStyle = tx.isError ? " opacity:0.5" : "";
const row = document.createElement("div"); const row = document.createElement("div");
row.className = row.style.cssText =
"py-2 border-b border-border-light text-xs cursor-pointer hover:bg-hover overflow-hidden"; "padding:0.5rem 0;border-bottom:1px solid #ccc;font-size:12px;cursor:pointer;overflow:hidden;" +
if (errorStyle) row.style.cssText = errorStyle; errorStyle;
const line1 = document.createElement("div"); 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"); 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.textContent = timeAgo(tx.timestamp);
age.title = isoDate(tx.timestamp); age.title = isoDate(tx.timestamp);
const dir = document.createElement("span"); 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)" : ""); dir.textContent = dirLabel + (tx.isError ? " (failed)" : "");
line1.appendChild(age); line1.appendChild(age);
line1.appendChild(dir); line1.appendChild(dir);
const amountStr = tx.value + " " + tx.symbol; const amountStr = tx.value + " " + tx.symbol;
const line2 = document.createElement("div"); 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"); 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)); const maxAddr = Math.max(10, 38 - Math.max(0, amountStr.length - 10));
addr.textContent = truncateMiddle(counterparty, maxAddr); addr.textContent = truncateMiddle(counterparty, maxAddr);
addr.title = counterparty; addr.title = counterparty;
const amount = document.createElement("span"); 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; amount.textContent = amountStr;
line2.appendChild(addr); line2.appendChild(addr);
line2.appendChild(amount); line2.appendChild(amount);