diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/app.js | 3 | ||||
| -rw-r--r-- | src/features/ark.js | 7 | ||||
| -rw-r--r-- | src/format.js | 6 |
3 files changed, 12 insertions, 4 deletions
@@ -19,6 +19,7 @@ import { timeAgo, SATS, ARK_ICON, + BITCOIN_ICON, } from './format.js'; const wallet = new Wallet(); @@ -2057,7 +2058,7 @@ function receiveTab() { let mode = ui.receiveType || 'address'; if (mode !== 'address' && !featModes.some((m) => m.id === mode)) mode = 'address'; const opts = [ - { id: 'address', label: t('receiveAddressTab'), icon: '₿' }, + { id: 'address', label: t('receiveAddressTab'), icon: BITCOIN_ICON(20) }, ...featModes.map((m) => ({ id: m.id, label: m.label, icon: m.icon })), ]; const seg = opts.length > 1 diff --git a/src/features/ark.js b/src/features/ark.js index 5f64b21..92b248a 100644 --- a/src/features/ark.js +++ b/src/features/ark.js @@ -269,11 +269,12 @@ export function arkFeature(ctx) { return h( 'div', { class: 'item', style: 'cursor:pointer', onClick: () => { ui.arkMoveDetail = m.id; render(); } }, - h('div', { class: `ico ${incoming ? 'in' : 'out'}` }, incoming ? '↓' : '↑'), + // Ark mark in the (direction-colored) circle carries the rail; the label + // + signed amount carry direction, so no redundant "Ark" text chip. + h('div', { class: `ico ${incoming ? 'in' : 'out'}`, html: ARK_MARK(15) }), h('div', { class: 'grow' }, h('div', { class: 'row gap6' }, label, - h('span', { class: 'tag' }, 'Ark'), m.status !== 'complete' ? h('span', { class: 'tag pending' }, m.status) : null), h('div', { class: 'small faint' }, timeAgo(m.ts / 1000))), h('div', { style: 'text-align:right' }, @@ -292,8 +293,8 @@ export function arkFeature(ctx) { 'div', { class: 'card col', style: 'gap:10px' }, h('div', { class: 'row gap6', style: 'align-items:center' }, + h('span', { html: ARK_ICON(18) }), h('h3', { style: 'margin:0' }, label), - h('span', { class: 'tag' }, 'Ark'), m.status !== 'complete' ? h('span', { class: 'tag pending' }, m.status) : null), h('div', { class: incoming ? 'amount-pos' : 'amount-neg', style: 'font-size:20px' }, (incoming ? '+' : '-') + fmtAmount(m.amountSat) + ' ' + unitLabel()), diff --git a/src/format.js b/src/format.js index 56f2b82..b553f5c 100644 --- a/src/format.js +++ b/src/format.js @@ -13,6 +13,12 @@ export const ARK_MARK = (px = 16) => export const ARK_ICON = (px = 16) => `<svg width="${px}" height="${px}" viewBox="0 0 400 400" style="display:inline-block;vertical-align:-3px"><rect width="400" height="400" rx="92" fill="#00090C"/><path fill="#fff" fill-rule="evenodd" transform="translate(37 34) scale(0.82)" d="${ARK_PATH}"/></svg>`; +// The Bitcoin logo — coinos's bitcoin.svg (orange disc + tilted white ₿). +const BTC_DISC = 'm63.033,39.744c-4.274,17.143-21.637,27.576-38.782,23.301-17.138-4.274-27.571-21.638-23.295-38.78,4.272-17.145,21.635-27.579,38.775-23.305,17.144,4.274,27.576,21.64,23.302,38.784z'; +const BTC_B = 'm46.103,27.444c0.637-4.258-2.605-6.547-7.038-8.074l1.438-5.768-3.511-0.875-1.4,5.616c-0.923-0.23-1.871-0.447-2.813-0.662l1.41-5.653-3.509-0.875-1.439,5.766c-0.764-0.174-1.514-0.346-2.242-0.527l0.004-0.018-4.842-1.209-0.934,3.75s2.605,0.597,2.55,0.634c1.422,0.355,1.679,1.296,1.636,2.042l-1.638,6.571c0.098,0.025,0.225,0.061,0.365,0.117-0.117-0.029-0.242-0.061-0.371-0.092l-2.296,9.205c-0.174,0.432-0.615,1.08-1.609,0.834,0.035,0.051-2.552-0.637-2.552-0.637l-1.743,4.019,4.569,1.139c0.85,0.213,1.683,0.436,2.503,0.646l-1.453,5.834,3.507,0.875,1.439-5.772c0.958,0.26,1.888,0.5,2.798,0.726l-1.434,5.745,3.511,0.875,1.453-5.823c5.987,1.133,10.489,0.676,12.384-4.739,1.527-4.36-0.076-6.875-3.226-8.515,2.294-0.529,4.022-2.038,4.483-5.155zm-8.022,11.249c-1.085,4.36-8.426,2.003-10.806,1.412l1.928-7.729c2.38,0.594,10.012,1.77,8.878,6.317zm1.086-11.312c-0.99,3.966-7.1,1.951-9.082,1.457l1.748-7.01c1.982,0.494,8.365,1.416,7.334,5.553z'; +export const BITCOIN_ICON = (px = 16) => + `<svg width="${px}" height="${px}" viewBox="0 0 64 64" style="display:inline-block;vertical-align:-3px"><path fill="#f7931a" d="${BTC_DISC}"/><path fill="#fff" d="${BTC_B}"/></svg>`; + export function btc(sats) { return (Number(sats) / SATS).toFixed(8); } |