Use compact [ ] select button and show active address above actions
Some checks failed
check / check (push) Has been cancelled
Some checks failed
check / check (push) Has been cancelled
Replace [select] with [ ] to avoid wrapping the full address line. ACTIVE label stays as-is for discoverability. Show the currently active address (full, untruncated, with color dot) above the Send and Receive buttons on the home screen.
This commit is contained in:
@@ -178,6 +178,12 @@
|
|||||||
class="text-2xl font-bold mb-2 min-h-[2rem]"
|
class="text-2xl font-bold mb-2 min-h-[2rem]"
|
||||||
></div>
|
></div>
|
||||||
|
|
||||||
|
<!-- active address display -->
|
||||||
|
<div
|
||||||
|
id="active-address-display"
|
||||||
|
class="text-xs break-all mb-3"
|
||||||
|
></div>
|
||||||
|
|
||||||
<!-- quick actions for active address -->
|
<!-- quick actions for active address -->
|
||||||
<div class="flex gap-2 mb-3">
|
<div class="flex gap-2 mb-3">
|
||||||
<button
|
<button
|
||||||
|
|||||||
@@ -21,12 +21,24 @@ function renderTotalValue() {
|
|||||||
el.textContent = formatUsd(getTotalValueUsd(state.wallets));
|
el.textContent = formatUsd(getTotalValueUsd(state.wallets));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function renderActiveAddress() {
|
||||||
|
const el = $("active-address-display");
|
||||||
|
if (!el) return;
|
||||||
|
if (state.activeAddress) {
|
||||||
|
const dot = addressDotHtml(state.activeAddress);
|
||||||
|
el.innerHTML = dot + state.activeAddress;
|
||||||
|
} else {
|
||||||
|
el.textContent = "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function render(ctx) {
|
function render(ctx) {
|
||||||
const container = $("wallet-list");
|
const container = $("wallet-list");
|
||||||
if (state.wallets.length === 0) {
|
if (state.wallets.length === 0) {
|
||||||
container.innerHTML =
|
container.innerHTML =
|
||||||
'<p class="text-muted py-2">No wallets yet. Add one to get started.</p>';
|
'<p class="text-muted py-2">No wallets yet. Add one to get started.</p>';
|
||||||
renderTotalValue();
|
renderTotalValue();
|
||||||
|
renderActiveAddress();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -45,7 +57,7 @@ function render(ctx) {
|
|||||||
const isActive = state.activeAddress === addr.address;
|
const isActive = state.activeAddress === addr.address;
|
||||||
const activeHtml = isActive
|
const activeHtml = isActive
|
||||||
? `<span class="font-bold text-xs">ACTIVE</span>`
|
? `<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>`;
|
: `<span class="btn-select-active text-xs cursor-pointer" data-addr="${addr.address}">[ ]</span>`;
|
||||||
const dot = addressDotHtml(addr.address);
|
const dot = addressDotHtml(addr.address);
|
||||||
html += `<div class="text-xs font-bold">Address ${wi + 1}.${ai + 1}</div>`;
|
html += `<div class="text-xs font-bold">Address ${wi + 1}.${ai + 1}</div>`;
|
||||||
if (addr.ensName) {
|
if (addr.ensName) {
|
||||||
@@ -146,6 +158,7 @@ function render(ctx) {
|
|||||||
});
|
});
|
||||||
|
|
||||||
renderTotalValue();
|
renderTotalValue();
|
||||||
|
renderActiveAddress();
|
||||||
}
|
}
|
||||||
|
|
||||||
function selectActiveAddress() {
|
function selectActiveAddress() {
|
||||||
|
|||||||
Reference in New Issue
Block a user