silentmode/theseus
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(aegis): 0.10.0 — lead with the balance, and make the section bar read as an app

Browse source 
First pass of the wallet-app restyle. The panel led with a 22px balance that
carried no more weight than the labels around it, so the one number people
open the sidebar to read had to be hunted for. It is now the hero: 32px,
thousands-grouped, with the fractional part dimmed so magnitude reads before
precision. The ticker and the fiat conversion sit on its baseline as
annotations rather than peers, and wrap to their own line intact once the
amount outgrows a narrow panel.

The Receive/Send/History/Settings bar used an underline for the active tab,
which read as browser chrome and all but vanished at sidebar widths — a 2px
rule under a short label is easy to miss. It is a segmented pill bar now,
active section filled in the accent. The hover tint derives from --ink so it
shows in the light theme too, where a white overlay was invisible.

No charts yet: there is no price history behind Coin-Spectrum to draw, so
nothing here fakes a trend line.
This commit is contained in:
Local Dev 2026-09-27 00:47:57 +02:00
parent 464d83316b
commit 546b8f5767
3 changed files with 45 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
bundled-addons/aegis/addon.json
View file

@ -1,7 +1,7 @@
{
"id": "aegis",
"name": "Aegis Wallet",
"version": "0.9.10",
"version": "0.10.0",
"category": "plugin",
"description": "Multi-chain wallet (BCH, BTC, TRX, ETH, SOL, SC, DGB) derived from your Theseus vault. Dapps get window.bitcoincash on .x sites; window.tronWeb / window.tronLink / window.ethereum / window.solana on any https page.",
"author": "Silent Mode",

34
bundled-addons/aegis/panel.html
View file

@ -32,10 +32,19 @@
.net { display: flex; align-items: center; gap: 6px; color: var(--dim); font-size: 11.5px; white-space: nowrap; }
.dot { width: 7px; height: 7px; border-radius: 50%; background: var(--dim); }
.dot.on { background: var(--ok); } .dot.busy { background: #e0b341; }
.bal { margin-top: 8px; font-variant-numeric: tabular-nums; }
.bal .big { font-size: 22px; font-weight: 650; letter-spacing: .2px; }
.bal .big small { font-size: 13px; color: var(--mut); font-weight: 500; margin-left: 4px; }
.bal .sub { color: var(--dim); font-size: 11.5px; display: flex; align-items: center; gap: 8px; }
/* Balance hero. Every modern wallet leads with one large numeral and pushes
the fractional part back to ~40% opacity, so the eye reads magnitude
before precision; the ticker and the fiat conversion are annotations on
that number rather than peers of it. Baseline-aligned flex keeps them on
the numeral's baseline however long the amount grows. */
.bal { margin-top: 10px; font-variant-numeric: tabular-nums; }
.bal .big { font-size: 32px; font-weight: 680; letter-spacing: -.6px; line-height: 1.1;
display: flex; align-items: baseline; gap: 5px; flex-wrap: wrap; }
.bal .big .dec { color: var(--dim); font-weight: 620; }
.bal .big small { font-size: 13px; color: var(--mut); font-weight: 500; margin-left: 0; }
/* Scoped to the hero — .fiat is also the Send form's conversion line. */
.bal .big .fiat { font-size: 14px; margin-left: 6px; }
.bal .sub { color: var(--dim); font-size: 11.5px; display: flex; align-items: center; gap: 8px; margin-top: 3px; }
.bal .sub .netlbl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
/* Full-panel sheet — fills most of the sidebar but stops above the
footer so the aegis.x brand + version chip stay visible. Users
@ -161,11 +170,18 @@
.setsecnav button.on { background: rgb(from var(--acid, #d6ff3d) r g b / .16);
color: var(--acid, #d6ff3d); font-weight: 600; }
.setsecnav button:hover:not(.on) { color: var(--ink); }
nav { display: flex; border-bottom: 1px solid var(--line); background: var(--panel); }
nav button { flex: 1; padding: 9px 0 8px; border: 0; background: transparent; color: var(--mut); cursor: pointer;
font: inherit; font-size: 12.5px; border-bottom: 2px solid transparent; }
nav button.on { color: var(--acid); border-bottom-color: var(--acid); }
nav button:hover { color: var(--ink); }
/* Segmented pill bar. The underline-tab treatment read as browser chrome,
and a 2px underline under a short label is nearly invisible once the
sidebar is narrow. A filled pill for the active section is what the
wallet apps use and it holds up at any width. The hover tint derives
from --ink so it also shows in the light theme, where a white overlay
would vanish. */
nav { display: flex; gap: 4px; padding: 6px 8px; border-bottom: 1px solid var(--line); background: var(--panel); }
nav button { flex: 1; padding: 7px 0; border: 0; border-radius: 999px; background: transparent;
color: var(--mut); cursor: pointer; font: inherit; font-size: 12.5px;
transition: background .12s, color .12s; }
nav button.on { background: var(--acid); color: #0b0f08; font-weight: 650; }
nav button:hover:not(.on) { background: rgb(from var(--ink) r g b / .08); color: var(--ink); }
main { flex: 1; overflow: auto; padding: 14px; }
/* Persistent aegis.x brand strip. Sticks to the panel's bottom edge so the
wallet always advertises its own front-door site — helps users bookmark

22
bundled-addons/aegis/panel.js
View file

@ -140,6 +140,22 @@ function fmtBig(units, dec) {
const s = (Number(units || 0) / Math.pow(10, d)).toFixed(d);
return s.replace(/(\.\d*?[1-9])0+$|\.0+$/, "$1");
}
// Paint the header balance. Groups the integer part with thousands
// separators and wraps the fraction in .dec so CSS can dim it — the
// "$98,230.02" treatment the reference wallets lead with. Anything that is
// not a bare number (an em dash, a skeleton, an error) falls through to
// plain text. The regex guarantees the interpolated pieces are digits,
// sign and dot only, so building this with innerHTML cannot inject markup.
function setBalMain(text) {
const el = $("balMain");
if (!el) return;
const s = String(text == null ? "—" : text);
const m = /^(-?)(d+)(.d+)?$/.exec(s);
if (!m) { el.textContent = s; return; }
const grouped = m[2].replace(/B(?=(d{3})+(?!d))/g, ",");
el.innerHTML = m[1] + grouped + (m[3] ? '<span class="dec">' + m[3] + "</span>" : "");
}
function fmtSmall(units) {
if (typeof units === "string" && /^-?\d+$/.test(units)) return units.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
return Number(units || 0).toLocaleString("en-US");
@ -2991,7 +3007,7 @@ function render() {
// Sia-specific gate: adapter is up, keys are derived, but no walletd URL
// means no balance / history until the user configures one in Settings.
if (chain() === "sc" && s.needsWalletdUrl) {
$("balMain").textContent = "—"; $("balTicker").textContent = s.meta.ticker;
setBalMain("—"); $("balTicker").textContent = s.meta.ticker;
$("netlbl").textContent = "point Aegis at a walletd node in Settings";
$("tabs").hidden = true;
gate.hidden = false;
@ -2999,7 +3015,7 @@ function render() {
return;
}
const total = balanceSum(s.balance);
$("balMain").textContent = fmtBig(total);
setBalMain(fmtBig(total));
$("balTicker").textContent = s.meta.ticker;
const uc = s.balance?.unconfirmed;
if (uc && uc !== "0" && uc !== 0) $("netlbl").textContent += ` · ${fmtBig(uc)} unconfirmed`;
@ -3009,7 +3025,7 @@ function render() {
$("balFiat").textContent = fiat || "";
$("balFiat").hidden = !fiat;
} else {
$("balMain").textContent = "—"; $("balTicker").textContent = "";
setBalMain("—"); $("balTicker").textContent = "";
$("balFiat").hidden = true;
}
renderPortfolio();