Rearrange home address layout and widen rename input
Some checks failed
check / check (push) Has been cancelled

Each address now shows: title on its own line, full untruncated
address with ACTIVE/select marker on the next line, USD total
right-aligned on the next line, then token balances below. The
wallet rename input now fills the available width.
This commit is contained in:
2026-02-26 15:48:09 +07:00
parent 5d1873ac78
commit fced156e3e

View File

@@ -4,7 +4,6 @@ const {
showFlash,
balanceLinesForAddress,
addressDotHtml,
truncateMiddle,
} = require("./helpers");
const { state, saveState, currentAddress } = require("../../shared/state");
const { updateSendBalance, renderSendTokenSelect } = require("./send");
@@ -47,16 +46,17 @@ function render(ctx) {
const activeHtml = isActive
? `<span class="font-bold text-xs">ACTIVE</span>`
: `<span class="btn-select-active text-xs font-normal cursor-pointer" data-addr="${addr.address}">[<span class="underline decoration-dashed">select</span>]</span>`;
html += `<div class="text-xs font-bold flex justify-between items-center"><span>Address ${wi + 1}.${ai + 1}</span>${activeHtml}</div>`;
const dot = addressDotHtml(addr.address);
html += `<div class="text-xs font-bold">Address ${wi + 1}.${ai + 1}</div>`;
if (addr.ensName) {
html += `<div class="text-xs font-bold flex items-center">${dot}${addr.ensName}</div>`;
}
const addrUsd = formatUsd(getAddressValueUsd(addr));
html += `<div class="flex text-xs">`;
html += `<span class="flex items-center" style="width:42ch;max-width:100%">${addr.ensName ? "" : dot}${truncateMiddle(addr.address, 40)}</span>`;
html += `<span class="text-right text-muted flex-1">${addrUsd}</span>`;
html += `<div class="flex text-xs items-center justify-between">`;
html += `<span class="flex items-center break-all">${addr.ensName ? "" : dot}${addr.address}</span>`;
html += `<span class="flex-shrink-0 ml-1">${activeHtml}</span>`;
html += `</div>`;
const addrUsd = formatUsd(getAddressValueUsd(addr));
html += `<div class="text-xs text-muted text-right">${addrUsd}</div>`;
html += balanceLinesForAddress(
addr,
state.trackedTokens,
@@ -122,7 +122,7 @@ function render(ctx) {
input.value = wallet.name;
input.className =
"font-bold border border-border p-0 bg-bg text-fg";
input.style.width = span.offsetWidth + 20 + "px";
input.style.width = "100%";
const save = async () => {
const val = input.value.trim();
if (val && val !== wallet.name) {